sstent/foodplanner
1
0
Fork 0
mirror of https://github.com/sstent/foodplanner.git synced 2026-01-25 03:01:35 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

fixing chart dimensions

Browse Source
This commit is contained in:
sstent
2025-10-05 06:37:26 -07:00
parent 8d80431850
commit c3d37f0243
1 changed files with 17 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
templates/charts.html
View File

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