mirror of https://github.com/hykilpikonna/AquaDX
[S] Responsive chart
parent
ac4c66a1f7
commit
97794ce7c5
|
@ -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
|
||||||
|
|
Loading…
Reference in New Issue