[S] Responsive chart

pull/10/head
Azalea 2024-02-12 04:49:02 -05:00
parent ac4c66a1f7
commit 97794ce7c5
1 changed files with 10 additions and 1 deletions

View File

@ -64,7 +64,9 @@
</div> </div>
<div class="trend"> <div class="trend">
<Line data={{ <!-- ChartJS cannot be fully responsive unless there is a parent div that's independent from its size and helps it determine its size -->
<div class="chartjs-box-reference">
<Line data={{
datasets: [ datasets: [
{ {
label: 'Rating', label: 'Rating',
@ -76,6 +78,7 @@
} }
] ]
}} options={CHARTJS_OPT} /> }} options={CHARTJS_OPT} />
</div>
</div> </div>
<div class="info-bottom"> <div class="info-bottom">
@ -259,6 +262,12 @@ $gap: 20px
width: 100% width: 100%
max-width: 790px max-width: 790px
position: relative
> .chartjs-box-reference
position: absolute
inset: 0
@media (max-width: $w-mobile) @media (max-width: $w-mobile)
flex-direction: column flex-direction: column
max-height: unset max-height: unset