mirror of
https://github.com/Aider-AI/aider.git
synced 2025-05-29 00:35:00 +00:00
feat: Make charts responsive and taller on mobile
This commit is contained in:
parent
36cf2348d0
commit
dedbc20ac6
1 changed files with 23 additions and 2 deletions
|
@ -1,5 +1,24 @@
|
|||
<canvas id="blameChart" width="800" height="360" style="margin-top: 20px"></canvas>
|
||||
<canvas id="linesChart" width="800" height="360" style="margin-top: 20px"></canvas>
|
||||
<div class="chart-container">
|
||||
<canvas id="blameChart" style="margin-top: 20px"></canvas>
|
||||
</div>
|
||||
<div class="chart-container">
|
||||
<canvas id="linesChart" style="margin-top: 20px"></canvas>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.chart-container {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 360px;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.chart-container {
|
||||
height: 480px; /* Taller on mobile */
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/moment"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/chartjs-adapter-moment"></script>
|
||||
|
@ -43,6 +62,7 @@ document.addEventListener('DOMContentLoaded', function () {
|
|||
type: 'bar',
|
||||
data: blameData,
|
||||
options: {
|
||||
maintainAspectRatio: false,
|
||||
scales: {
|
||||
x: {
|
||||
type: 'category',
|
||||
|
@ -92,6 +112,7 @@ document.addEventListener('DOMContentLoaded', function () {
|
|||
type: 'bar',
|
||||
data: linesData,
|
||||
options: {
|
||||
maintainAspectRatio: false,
|
||||
scales: {
|
||||
x: {
|
||||
type: 'category',
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue