|
<!DOCTYPE html> |
|
<html> |
|
|
|
<head> |
|
<style> |
|
body { |
|
font-family: Arial, sans-serif; |
|
margin: 0; |
|
padding: 20px; |
|
background-color: #f4f4f4; |
|
} |
|
|
|
#checkboxes { |
|
margin-bottom: 20px; |
|
} |
|
|
|
.model-checkbox+label { |
|
margin-right: 10px; |
|
padding: 5px 10px; |
|
background-color: #e7e7e7; |
|
border-radius: 5px; |
|
cursor: pointer; |
|
user-select: none; |
|
} |
|
|
|
.model-checkbox { |
|
display: none; |
|
|
|
} |
|
|
|
.model-checkbox:checked+label { |
|
background-color: #d0e6a5; |
|
color: #0b4d03; |
|
} |
|
|
|
table { |
|
width: 100%; |
|
border-collapse: collapse; |
|
background-color: #fff; |
|
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); |
|
margin: auto; |
|
overflow: hidden; |
|
|
|
} |
|
|
|
th, |
|
td { |
|
border: 1px solid #ddd; |
|
padding: 10px 15px; |
|
text-align: center; |
|
} |
|
|
|
th { |
|
background-color: #f8f8f8; |
|
font-weight: bold; |
|
} |
|
|
|
tr:nth-child(even) { |
|
background-color: #f2f2f2; |
|
} |
|
|
|
.performance-bar { |
|
display: block; |
|
height: 20px; |
|
background: linear-gradient(to right, #00ff00 0%, #ff0000 100%); |
|
border-radius: 5px; |
|
} |
|
|
|
.performance { |
|
font-weight: bold; |
|
color: #fff; |
|
text-align: center; |
|
line-height: 20px; |
|
height: 20px; |
|
margin: 0; |
|
} |
|
</style> |
|
|
|
</head> |
|
|
|
<body> |
|
|
|
|
|
|
|
<table id='model-table' style="align:center"> |
|
<thead> |
|
<tr> |
|
<th>Problem ID</th> |
|
<th>Difficulty</th> |
|
{% for model in models %} |
|
<th class="column-{{ model }}">{{ model }}</th> |
|
{% endfor %} |
|
</tr> |
|
</thead> |
|
<tbody> |
|
{% for problem_idx, problem, difficulty in problems %} |
|
<tr> |
|
<td> <a href="{{ url_for('problem_mini', problem_idx=problem_idx) }}"> {{ problem_idx }} </a> </td> |
|
<td> {{ difficulty }} </td> |
|
{% for model in models %} |
|
<td style="background-color: {{ problem[model]['correctness_color'] }};" class="column-{{ model }}"> |
|
{% if model in problem %} |
|
<div> |
|
|
|
{{ problem[model]['correctness'] }}% |
|
</div> |
|
{% else %} |
|
- |
|
{% endif %} |
|
</td> |
|
{% endfor %} |
|
</tr> |
|
{% endfor %} |
|
|
|
</tbody> |
|
</table> |
|
|
|
|
|
</body> |
|
|
|
</html> |
