lucaspatenaude/ScoreSpot
1
0
Fork 0
Code Projects 1 Releases 1 Wiki Activity

More style clean ups on league page

Browse Source
This commit is contained in:
Lucas Patenaude
2024-04-14 21:52:31 -06:00
parent f944e38c02
commit 8b6f2e36a7
4 changed files with 36 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
ProjectSourceCode/src/resources/css/league-pages/league-page.css
View File

@@ -90,6 +90,11 @@
============================================= =============================================
*/ */
#table-and-top-scorers-containers {
display: flex;
flex-direction: row;
}
/* Styling for Standings and Top Scorers Cards */ /* Styling for Standings and Top Scorers Cards */
#table-stats-container, #top-scorers-stats-container #table-stats-container, #top-scorers-stats-container
{ {
@@ -121,9 +126,12 @@
*/ */
/* Width of Screen is Less Than 950px */ /* Width of Screen is Less Than 950px */
@media (max-width: 950px) @media (max-width: 1230px)
{ {
#table-and-top-scorers-containers {
display: flex;
flex-direction: column;
}
} }

27
ProjectSourceCode/src/resources/css/league-pages/league-table.css
View File

@@ -1,4 +1,5 @@
#league-table-and-information-container { /* Container for all table elements */
#league-table-container {
width: 60%; width: 60%;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
@@ -6,10 +7,7 @@
transition: transform 0.3s ease; /* Add smooth transition effect */ transition: transform 0.3s ease; /* Add smooth transition effect */
} }
#standings-table {
width: 100%;
padding: 15px;
}
#table-stats-container { #table-stats-container {
width: 100%; width: 100%;
@@ -19,7 +17,13 @@
border-bottom: 3px solid red; /* Add red bottom border */ border-bottom: 3px solid red; /* Add red bottom border */
} }
#club-logo-row { #standings-table {
width: 100%;
padding: 15px;
}
/* */
#club-logo-column {
width: 25px; width: 25px;
} }
@@ -30,7 +34,7 @@
} }
#club-name { #club-name-column {
cursor: pointer; cursor: pointer;
} }
@@ -62,8 +66,9 @@
} }
} }
@media (max-width: 950px) { @media (max-width: 1230px) {
#league-table-and-information-container { #league-table-container {
width: 100%; /* Set the width to 60% when window width is less than 1161px */ align-items: center;
} width: 75%;
}
} }

10
ProjectSourceCode/src/resources/css/league-pages/top-scorers.css
View File

@@ -1,6 +1,5 @@
#top-scorers-container { #top-scorers-container {
flex: 1; width: 35%;
width: 100%;
/* Add any other styling you need for the top scorers container */ /* Add any other styling you need for the top scorers container */
} }
@@ -28,4 +27,11 @@
#club-name-column { #club-name-column {
padding-right: 15px; padding-right: 15px;
}
@media (max-width: 1230px) {
#top-scorers-container {
align-items: center;
width: 75%;
}
} }

4
ProjectSourceCode/src/views/pages/leagues-page.hbs
View File

@@ -38,8 +38,8 @@
{{#each league.standings}} {{#each league.standings}}
<tr> <tr>
<td>{{table.league_position}}</td> <td>{{table.league_position}}</td>
<td id="club-logo-row"><img src="{{table.team_crest}}" alt="{{table.team_name}} Crest" id="table-club-logo" clubID="{{table.team_id}}"></td> <td id="club-logo-column"><img src="{{table.team_crest}}" alt="{{table.team_name}} Crest" id="table-club-logo" clubID="{{table.team_id}}"></td>
<td><span id="club-name" clubID="{{table.team_id}}">{{table.team_name}}</span></td> <td><span id="club-name-column" clubID="{{table.team_id}}">{{table.team_name}}</span></td>
<td>{{games_played}}</td> <td>{{games_played}}</td>
<td>{{wins}}</td> <td>{{wins}}</td>
<td>{{losses}}</td> <td>{{losses}}</td>