Greg/SportAttendanceSheet
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Reports resized

Browse Source
This commit is contained in:
Greg 2025-05-10 23:12:36 +02:00
parent aff2c1d862
commit f2ead5dbac
1 changed files with 11 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

22
templates/reports.html
View File

@ -13,19 +13,19 @@
align-items: flex-start; align-items: flex-start;
flex-wrap: wrap; flex-wrap: wrap;
} }
.chart-container.small-chart { .chart-container.large-chart {
background: #393E46; background: #393E46;
padding: 1em 1.2em; padding: 1.5em 2em;
border-radius: 8px; border-radius: 8px;
margin-bottom: 1em; margin-bottom: 1em;
min-width: 320px; min-width: 400px;
max-width: 350px; max-width: 520px;
flex: 1 1 320px; flex: 1 1 400px;
box-sizing: border-box; box-sizing: border-box;
} }
.chart-container.small-chart canvas { .chart-container.large-chart canvas {
max-width: 100%; max-width: 100%;
height: 260px !important; height: 370px !important;
width: 100% !important; width: 100% !important;
} }
h2 { color: #948979; font-size: 1.1em; margin-bottom: 0.5em; } h2 { color: #948979; font-size: 1.1em; margin-bottom: 0.5em; }
@ -41,13 +41,13 @@
<body> <body>
<a href="/" style="margin-bottom: 2em; display: inline-block;">Back to Attendance</a> <a href="/" style="margin-bottom: 2em; display: inline-block;">Back to Attendance</a>
<div class="charts-flex"> <div class="charts-flex">
<div class="chart-container small-chart"> <div class="chart-container large-chart">
<h2>Attendance Count per Player</h2> <h2>Attendance Count per Player</h2>
<canvas id="barChart" width="300" height="300"></canvas> <canvas id="barChart" width="480" height="400"></canvas>
</div> </div>
<div class="chart-container small-chart"> <div class="chart-container large-chart">
<h2>Player Attendance Share (Pie)</h2> <h2>Player Attendance Share (Pie)</h2>
<canvas id="pieChart" width="300" height="300"></canvas> <canvas id="pieChart" width="400" height="400"></canvas>
</div> </div>
</div> </div>
<script> <script>