diff --git a/ProjectSourceCode/src/resources/css/generated-pages/card-styling.css b/ProjectSourceCode/src/resources/css/generated-pages/card-styling.css index f6ac9a5..6152c67 100644 --- a/ProjectSourceCode/src/resources/css/generated-pages/card-styling.css +++ b/ProjectSourceCode/src/resources/css/generated-pages/card-styling.css @@ -54,6 +54,35 @@ flex-direction: row; /* Arrange child elements horizontally */ } + /* + =========================== + LEAGUE INFORMATION CHILD ITEMS + =========================== + */ + + /* Styling for League Logo in League Information Header */ + #generated-page-header-logo + { + margin: 0px 30px; + transform: skewX(20deg); /* Skew the banner to create a triangular side */ + height: 80%; + } + + /* Styling for League Title in League Information Header */ + #generated-page-header-title + { + transform: skewX(20deg); /* Skew the banner to create a triangular side */ + margin-right: 20px; + } + + /* Styling for Flag in League Information Header */ + #generated-page-header-flag + { + transform: skewX(20deg); /* Skew the banner to create a triangular side */ + height: 20px; + margin-right: 200px; + } + /* ============================================= CARDS IN PAGE BODY @@ -74,4 +103,17 @@ background: linear-gradient(to top, rgb(216, 216, 216), rgb(236, 236, 236), rgb(241, 240, 240)); border: 1px solid gray; box-shadow: 0px 3px 8px rgba(0, 0, 0, 0.5); +} + +/* +============================================================== + HOVER STYLES +============================================================== +*/ + +/* Hover Styling for Standings and Top Scorers Cards */ +.card-container:hover +{ + transform: scale(1.01); /* Scale the row by 1.1 on hover */ + box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.3); } \ No newline at end of file diff --git a/ProjectSourceCode/src/resources/css/generated-pages/club-pages/club-page.css b/ProjectSourceCode/src/resources/css/generated-pages/club-pages/club-page.css index f841b9f..126b4b9 100644 --- a/ProjectSourceCode/src/resources/css/generated-pages/club-pages/club-page.css +++ b/ProjectSourceCode/src/resources/css/generated-pages/club-pages/club-page.css @@ -1,32 +1,3 @@ -/* -=========================== -LEAGUE INFORMATION CHILD ITEMS -=========================== -*/ - -/* Styling for League Logo in Club Information Header */ -#club-logo -{ - margin: 0px 30px; - transform: skewX(20deg); /* Skew the banner to create a triangular side */ - height: 80%; -} - -/* Styling for League Title in Club Information Header */ -#club-title -{ - transform: skewX(20deg); /* Skew the banner to create a triangular side */ - margin-right: 20px; -} - -/* Styling for FLag in Club Information Header */ -#club-flag -{ - transform: skewX(20deg); /* Skew the banner to create a triangular side */ - height: 20px; - margin-right: 200px; -} - /* ============================================= CARDS IN PAGE BODY diff --git a/ProjectSourceCode/src/resources/css/generated-pages/league-pages/league-page.css b/ProjectSourceCode/src/resources/css/generated-pages/league-pages/league-page.css index 65de088..05bd64d 100644 --- a/ProjectSourceCode/src/resources/css/generated-pages/league-pages/league-page.css +++ b/ProjectSourceCode/src/resources/css/generated-pages/league-pages/league-page.css @@ -1,68 +1,15 @@ -/* -=========================== -LEAGUE INFORMATION CHILD ITEMS -=========================== -*/ - -/* Adds Red Diagonal Strip at the end of the #league-information-container */ -#league-information-container::after -{ - content: ''; - position: absolute; - top: 0; - right: 0; - bottom: 0; - width: 8px; /* Width of the red strip */ - background-color: red; /* Red color */ -} - -/* Styling for League Logo in League Information Header */ -#league-logo -{ - margin: 0px 30px; - transform: skewX(20deg); /* Skew the banner to create a triangular side */ - height: 80%; -} - -/* Styling for League Title in League Information Header */ -#league-title -{ - transform: skewX(20deg); /* Skew the banner to create a triangular side */ - margin-right: 20px; -} - -/* Styling for FLag in League Information Header */ -#league-flag -{ - transform: skewX(20deg); /* Skew the banner to create a triangular side */ - height: 20px; - margin-right: 200px; -} - /* ============================================= CARDS IN PAGE BODY ============================================= */ -#table-and-top-scorers-containers { +#table-and-top-scorers-containers +{ display: flex; flex-direction: row; } -/* -============================================================== - HOVER STYLES -============================================================== -*/ - - /* Hover Styling for Standings and Top Scorers Cards */ - #table-stats-container:hover, #top-scorers-stats-container:hover - { - transform: scale(1.01); /* Scale the row by 1.1 on hover */ - box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.3); - } - /* ============================================================== DYNAMIC PAGE WIDTH STYLES diff --git a/ProjectSourceCode/src/views/pages/clubs-page.hbs b/ProjectSourceCode/src/views/pages/clubs-page.hbs index 8a9d4d8..fb4e34e 100644 --- a/ProjectSourceCode/src/views/pages/clubs-page.hbs +++ b/ProjectSourceCode/src/views/pages/clubs-page.hbs @@ -2,9 +2,9 @@
- -

{{club.name}}

- {{club.name}} Flag + +

{{club.name}}

+ {{club.name}} Flag
diff --git a/ProjectSourceCode/src/views/pages/leagues-page.hbs b/ProjectSourceCode/src/views/pages/leagues-page.hbs index 2b7e39d..ef48def 100644 --- a/ProjectSourceCode/src/views/pages/leagues-page.hbs +++ b/ProjectSourceCode/src/views/pages/leagues-page.hbs @@ -2,9 +2,9 @@
- -

{{league.competition.league_name}}

- {{league.competition.league_name}} Flag + +

{{league.competition.league_name}}

+ {{league.competition.league_name}} Flag