Modified the canvas grid

This commit is contained in:
JKuijperM 2026-05-05 21:14:21 +02:00
parent dfedd64289
commit 496e563acc
2 changed files with 23 additions and 9 deletions

View File

@ -80,7 +80,7 @@ a.danger {
.dashboard-grid { .dashboard-grid {
display: grid; display: grid;
grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); grid-template-columns: repeat(2, 1fr);
gap: 20px gap: 20px
} }
@ -89,15 +89,14 @@ a.danger {
border-radius: 8px; border-radius: 8px;
padding: 16px; padding: 16px;
box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08); box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
display: flex;
flex-direction: column;
overflow: hidden;
} }
.card-chart { .card-chart {
max-width: 300px; height: 500px;
} position: relative;
.card-chart canvas {
width: 100% !important;
height: 220px !important;
} }
.chart-box { .chart-box {
@ -105,6 +104,19 @@ a.danger {
margin-bottom: 2rem; margin-bottom: 2rem;
} }
.canvas-wrapper {
flex-grow: 1;
min-height: 0;
position: relative;
width: 100%;
}
.card-chart canvas {
display: block;
width: 100% !important;
height: 100% !important;
}
.kpi-grid { .kpi-grid {
display: grid; display: grid;
grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));

View File

@ -150,8 +150,10 @@
<h3>{{ acc.name }}</h3> <h3>{{ acc.name }}</h3>
<p><strong>Saldo actual:</strong> {{ acc.current_balance|floatformat:2 }} €</p> <p><strong>Saldo actual:</strong> {{ acc.current_balance|floatformat:2 }} €</p>
<div class="canvas-wrapper">
<canvas id="accountChart{{ acc.id }}"></canvas> <canvas id="accountChart{{ acc.id }}"></canvas>
</div> </div>
</div>
{% endfor %} {% endfor %}
</div> </div>