Skip to content
Snippets Groups Projects
Commit 20836cf4 authored by maeries's avatar maeries
Browse files

new table design for ranking and competition page

parent 92b41e9b
No related branches found
No related tags found
No related merge requests found
Hide whitespace changes
Inline Side-by-side
competition_page.py
+ 29
− 5
View file @ 20836cf4
...@@ -60,9 +60,24 @@ def get_competition_page_html(self, competition_id): ...@@ -60,9 +60,24 @@ def get_competition_page_html(self, competition_id):
tr:hover {{ tr:hover {{
background-color: #f5f5f5; background-color: #f5f5f5;
}} }}
tr:nth-child(even)>td:nth-child(1) {{
background-color: {self.BORDER_COLOR_DARK};
}}
tr:nth-child(odd)>td:nth-child(1) {{
background-color: {self.BORDER_COLOR};
}}
td:nth-child(1) {{
text-align: center;
font-weight: bold;
}}
p {{ p {{
animation: fadeInUp 0.5s ease-out forwards; animation: fadeInUp 0.5s ease-out forwards;
}} }}
.chart-container {{ .chart-container {{
margin-top: 30px; margin-top: 30px;
display: flex; display: flex;
...@@ -77,19 +92,22 @@ def get_competition_page_html(self, competition_id): ...@@ -77,19 +92,22 @@ def get_competition_page_html(self, competition_id):
padding: 20px; padding: 20px;
box-sizing: border-box; box-sizing: border-box;
}} }}
.chart-container img {{ .chart-container img {{
max-width: 100%; max-width: 100%;
height: auto; height: auto;
}} }}
a {{ a {{
color: {self.LINK_COLOR}; color: black;
text-decoration: none;
transition: color 0.3s ease; transition: color 0.3s ease;
}} }}
a:hover {{ a:hover {{
color: {self.LINK_COLOR_HOVER}; color: {self.LINK_COLOR};
text-decoration: none; text-decoration: underline;
}} }}
.summary-stats {{ .summary-stats {{
display: flex; display: flex;
justify-content: space-around; justify-content: space-around;
...@@ -97,6 +115,7 @@ def get_competition_page_html(self, competition_id): ...@@ -97,6 +115,7 @@ def get_competition_page_html(self, competition_id):
flex-wrap: wrap; flex-wrap: wrap;
animation: fadeInUp 0.5s ease-out forwards; animation: fadeInUp 0.5s ease-out forwards;
}} }}
.stat-box {{ .stat-box {{
padding: 15px; padding: 15px;
border: 1px solid #ddd; border: 1px solid #ddd;
...@@ -107,21 +126,26 @@ def get_competition_page_html(self, competition_id): ...@@ -107,21 +126,26 @@ def get_competition_page_html(self, competition_id):
text-align: center; text-align: center;
background-color: #f9f9f9; background-color: #f9f9f9;
}} }}
.stat-value {{ .stat-value {{
font-size: 24px; font-size: 24px;
font-weight: bold; font-weight: bold;
color: #333; color: #333;
}} }}
.stat-label {{ .stat-label {{
font-size: 14px; font-size: 14px;
color: #666; color: #666;
}} }}
.positive {{ .positive {{
color: green; color: green;
}} }}
.negative {{ .negative {{
color: red; color: red;
}} }}
@keyframes fadeInUp {{ @keyframes fadeInUp {{
from {{ from {{
opacity: 0; opacity: 0;
...@@ -151,7 +175,7 @@ def get_competition_page_html(self, competition_id): ...@@ -151,7 +175,7 @@ def get_competition_page_html(self, competition_id):
<h2>Results</h2> <h2>Results</h2>
<table> <table>
<tr> <tr>
<th>Placement</th> <th></th>
<th>Team</th> <th>Team</th>
<th>Elo Before</th> <th>Elo Before</th>
<th>Elo Change</th> <th>Elo Change</th>
......
main.py
+ 2
− 0
View file @ 20836cf4
...@@ -38,10 +38,12 @@ class EloSystem: ...@@ -38,10 +38,12 @@ class EloSystem:
self.competition_meta_data = self.load_competition_meta_data() self.competition_meta_data = self.load_competition_meta_data()
if self.competition_type == "electric": if self.competition_type == "electric":
self.BORDER_COLOR = "#ffff1e" self.BORDER_COLOR = "#ffff1e"
self.BORDER_COLOR_DARK = "#f9f918"
self.LINK_COLOR = "#ffc400" self.LINK_COLOR = "#ffc400"
self.LINK_COLOR_HOVER = "#cc9d00" self.LINK_COLOR_HOVER = "#cc9d00"
elif self.competition_type == "combustion": elif self.competition_type == "combustion":
self.BORDER_COLOR = "#ff8c00" self.BORDER_COLOR = "#ff8c00"
self.BORDER_COLOR_DARK = "#f98700"
self.LINK_COLOR = "#ff4500" self.LINK_COLOR = "#ff4500"
self.LINK_COLOR_HOVER = "#cc3700" self.LINK_COLOR_HOVER = "#cc3700"
else: else:
......
team_page.py
+ 12
− 10
View file @ 20836cf4
...@@ -171,15 +171,16 @@ def get_team_page_html(self, team_name, team_data, team_competitions): ...@@ -171,15 +171,16 @@ def get_team_page_html(self, team_name, team_data, team_competitions):
</div> </div>
<h2>Competition History</h2> <h2>Competition History</h2>
<table> <div style="overflow: scroll;">
<tr> <table>
<th>Date</th> <tr>
<th>Competition</th> <th>Date</th>
<th>Placement</th> <th>Competition</th>
<th>Elo Before</th> <th>Placement</th>
<th>Elo After</th> <th>Elo Before</th>
<th>Elo Change</th> <th>Elo After</th>
</tr> <th>Elo Change</th>
</tr>
""".format(clean_filename(team_name), team_name) """.format(clean_filename(team_name), team_name)
# Add rows for each competition # Add rows for each competition
...@@ -198,7 +199,8 @@ def get_team_page_html(self, team_name, team_data, team_competitions): ...@@ -198,7 +199,8 @@ def get_team_page_html(self, team_name, team_data, team_competitions):
</tr>""" </tr>"""
html_content += """ html_content += """
</table> </table>
</div>
<p><small>Generated on {}</small></p> <p><small>Generated on {}</small></p>
</body> </body>
......
world_ranking_list.py
+ 26
− 12
View file @ 20836cf4
...@@ -100,6 +100,19 @@ def get_world_ranking_html(self, sorted_teams): ...@@ -100,6 +100,19 @@ def get_world_ranking_html(self, sorted_teams):
background-color: #f5f5f5; background-color: #f5f5f5;
}} }}
tr:nth-child(even)>td:nth-child(1) {{
background-color: {self.BORDER_COLOR_DARK};
}}
tr:nth-child(odd)>td:nth-child(1) {{
background-color: {self.BORDER_COLOR};
}}
td:nth-child(1) {{
text-align: center;
font-weight: bold;
}}
.chart-container {{ .chart-container {{
margin: 30px 0; margin: 30px 0;
display: flex; display: flex;
...@@ -121,14 +134,13 @@ def get_world_ranking_html(self, sorted_teams): ...@@ -121,14 +134,13 @@ def get_world_ranking_html(self, sorted_teams):
}} }}
a {{ a {{
color: {self.LINK_COLOR}; color: black;
text-decoration: none;
transition: color 0.3s ease; transition: color 0.3s ease;
}} }}
a:hover {{ a:hover {{
color: {self.LINK_COLOR_HOVER}; color: {self.LINK_COLOR};
text-decoration: none; text-decoration: underline;
}} }}
.timestamp {{ .timestamp {{
...@@ -202,13 +214,14 @@ def get_world_ranking_html(self, sorted_teams): ...@@ -202,13 +214,14 @@ def get_world_ranking_html(self, sorted_teams):
</div> </div>
<h2>Current Rankings</h2> <h2>Current Rankings</h2>
<table> <div style="overflow: scroll;">
<tr> <table>
<th>Rank</th> <tr>
<th>Team</th> <th></th>
<th>Elo Rating</th> <th>Team</th>
<th>Competitions</th> <th>Elo Rating</th>
</tr> <th>Competitions</th>
</tr>
""" """
# Add rows for each team # Add rows for each team
...@@ -222,7 +235,8 @@ def get_world_ranking_html(self, sorted_teams): ...@@ -222,7 +235,8 @@ def get_world_ranking_html(self, sorted_teams):
</tr>""" </tr>"""
html_content += """ html_content += """
</table> </table>
<div>
<div class="chart-container"> <div class="chart-container">
<img src="images/elo_distribution.png" alt="Elo Distribution"> <img src="images/elo_distribution.png" alt="Elo Distribution">
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment