fix(stocktake): 欢迎页补足上下安全边距,显式压过 el-card 的 overflow:hidden

b7cdd5e 的 min-height:0 基础上补两处:

1. 顶部安全边距缺失:内容超高时 .idle-content 的 margin:auto 会塌缩为 0,
   文字直接贴着屏幕顶端。改用**容器自身的 padding: 40px 0** —— padding
   不参与 auto 塌缩,滚到顶/底都稳定保留 40px 呼吸空间。

2. 显式声明两轴 overflow:Element Plus 的 .el-card 默认 `overflow: hidden`
   (实测其 dist/index.css 确有该声明)。原先只写 overflow-y: auto,
   虽然 scoped 选择器(.idle-card[data-v-x],特异性 0,2,0)能压过
   .el-card(0,1,0),但意图不够显式。改为 `overflow: hidden auto` 一次写清
   「横向裁掉、纵向可滚」。

实测 style 块编译通过(12799 字符),min-height:0 / padding:40px 0 /
overflow:hidden auto / margin:auto 均已进入产物。
This commit is contained in:
yueli
2026-09-14 11:05:12 +08:00
parent b7cdd5e58b
commit 66e0728957

View File

@ -1870,9 +1870,16 @@ const goToVarianceReview = () => {
text-align: center; text-align: center;
border: none; border: none;
border-radius: 0; border-radius: 0;
overflow-y: auto; /* 显式写全 overflow 两轴:.el-card 默认 overflow:hidden
这里用 scoped 选择器(.idle-card[data-v-x],特异性 0,2,0压过它
明确声明「横向裁掉、纵向可滚」 */
overflow: hidden auto;
-webkit-overflow-scrolling: touch; /* 平板/iOS 惯性滚动 */ -webkit-overflow-scrolling: touch; /* 平板/iOS 惯性滚动 */
padding-bottom: 40px; /* 底部留白,按钮不贴屏幕边缘 */ /* ★ 上下各留 40px 安全边距。用 padding 而不是子元素 margin
margin:auto 在内容超高时会塌缩为 0导致文字紧贴屏幕顶端
容器自身的 padding 则始终保留,滚到顶/底都有呼吸空间 */
padding: 40px 0;
box-sizing: border-box;
} }
.idle-content { width: 100%; max-width: 400px; padding: 20px; margin: auto; } .idle-content { width: 100%; max-width: 400px; padding: 20px; margin: auto; }
/* 抽盘配置区是双栏,窄容器装不下,此时放宽欢迎页 */ /* 抽盘配置区是双栏,窄容器装不下,此时放宽欢迎页 */