fix(college): 修复 Dashboard Ninja 看板栅格错乱

ks_dashboard_ninja 18.0.2.2.3 初始化 gridstack 时命中 one-column 模式,
容器带上 .grid-stack-1,其 min-width:100% 覆盖了 [gs-w=N] 的 12 栅格宽度,
导致老师/学生看板所有卡片拉成整行宽并互相遮挡(页面呈彩色色块)。

在桌面宽度(>=768px)下解除该 min-width,宽度回归栅格百分比;
窄屏保留原有单列行为。
This commit is contained in:
qitangbo
2026-10-28 19:26:08 +08:00
parent c0da213161
commit 9cb740b17c
@@ -290,3 +290,22 @@
white-space: nowrap; // 不换行
}
// ============================================================
// Dashboard Ninja(ks_dashboard_ninja)看板栅格修复
// ------------------------------------------------------------
// 现象:老师/学生看板里所有卡片被拉成整行宽并相互遮挡,页面看上去是
// 一排彩色色块(图标、数字、标题都被后一张卡片盖住)。
// 原因:该模块初始化 gridstack 时会切到 one-column 模式,容器上带
// `.grid-stack-1`,随之命中 `.grid-stack.grid-stack-1 > .grid-stack-item
// { min-width: 100% }`,把节点真正的 12 栅格宽度([gs-w="N"] 的百分比)
// 覆盖掉了;节点自身的 gs-x/gs-y/gs-w/gs-h 其实都是对的。
// 处理:桌面宽度下解除这个 min-width,让宽度回归 gridstack 的栅格百分比。
// 窄屏(<768px)保留原有单列行为。
// ============================================================
@media (min-width: 768px) {
.grid-stack.grid-stack-1 > .grid-stack-item {
min-width: 0 !important;
}
}