fixing chart dimensions

This commit is contained in:
2025-10-05 06:37:26 -07:00
parent 8d80431850
commit c3d37f0243

View File

@@ -3,32 +3,36 @@
{% block title %}Daily Calories Chart{% endblock %}
{% block content %}
<div class="container mt-4">
<div class="container mt-4 d-flex flex-column min-vh-100">
<h2><i class="bi bi-graph-up"></i> Daily Calories Chart</h2>
<div class="row mb-4">
<div class="col-md-6">
<div class="card">
<div class="card-body">
<label for="daysSelect" class="form-label">Select Time Period:</label>
<select class="form-select" id="daysSelect">
<option value="7">Past 7 Days</option>
<option value="30">Past 30 Days</option>
</select>
<button class="btn btn-primary mt-2" id="loadChartBtn">Load Chart</button>
<div class="d-flex align-items-center flex-wrap gap-2">
<label for="daysSelect" class="form-label mb-0 me-2">Select Time Period:</label>
<select class="form-select w-auto" id="daysSelect">
<option value="7">Past 7 Days</option>
<option value="30">Past 30 Days</option>
</select>
<button class="btn btn-primary" id="loadChartBtn">Load Chart</button>
</div>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="card">
<div class="row flex-grow-1">
<div class="col-md-12 h-100">
<div class="card h-100">
<div class="card-header">
<h5 class="mb-0">Calories Consumed</h5>
</div>
<div class="card-body">
<canvas id="caloriesChart" width="400" height="200"></canvas>
<div class="card-body p-2 h-100">
<div class="position-relative h-100">
<canvas id="caloriesChart" class="w-100 h-100"></canvas>
</div>
</div>
</div>
</div>
@@ -81,6 +85,7 @@
},
options: {
responsive: true,
maintainAspectRatio: false,
scales: {
y: {
beginAtZero: true,