fix(ui): 修复 Chart.js 卡片图无限变高(响应式尺寸反馈循环) - canvas 外包固定高度 .chart-box,canvas 绝对定位 inset:0 - 容器高度不再受 canvas 内联尺寸影响,resize 循环终止
This commit is contained in:
+1
-1
@@ -234,7 +234,7 @@
|
||||
${hist.length > 0
|
||||
? `<div class="spark-wrap">
|
||||
<div class="spark-title">余额历史 · ${WINDOW_LABELS[win]}(${hist.length} 条${th !== null ? `,虚线阈值 ${th}` : ""})</div>
|
||||
<canvas class="card-chart" data-aid="${a.id}"></canvas>
|
||||
<div class="chart-box"><canvas class="card-chart" data-aid="${a.id}"></canvas></div>
|
||||
<div class="window-switch" data-aid="${a.id}">${winBtns}</div>
|
||||
</div>`
|
||||
: ""}
|
||||
|
||||
+11
-4
@@ -597,12 +597,19 @@ label { font-size: 12px; font-weight: 500; color: var(--text-2); margin-bottom:
|
||||
width: 100%;
|
||||
height: 30px;
|
||||
}
|
||||
/* 卡片迷你图(Chart.js canvas) */
|
||||
.card-chart {
|
||||
display: block;
|
||||
width: 100%;
|
||||
/* 卡片迷你图(Chart.js canvas)——chart-box 固定高度,canvas 绝对定位,
|
||||
避免 Chart.js responsive 尺寸与容器高度互相反馈导致无限变高 */
|
||||
.chart-box {
|
||||
position: relative;
|
||||
height: 36px;
|
||||
}
|
||||
.card-chart {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
width: 100% !important;
|
||||
height: 100% !important;
|
||||
display: block;
|
||||
}
|
||||
.spark-title {
|
||||
font-size: 10px;
|
||||
color: var(--text-3);
|
||||
|
||||
Reference in New Issue
Block a user