R49: 榜单三 tab 行高对齐账号周榜——功能页 td 统一 42px / 首页数据行 min-height 40px(账号周榜因功能列按钮撑高,热榜/点赞榜无按钮矮一截,切 tab 行高跳动);style aj→ak

This commit is contained in:
maogeigei committed 2026-09-03 22:27:49 +08:00
1 parent 3f85853c9e
commit a88f2dc262
3 files changed
+17 -1

No files matched your search

+11
View File
@@ -495,3 +495,14 @@
- **核验**:源 vs dsh strip CR 后 diff 全一致;旧维度名 grep 仅剩 last_change 历史记录(正常)
- **行尾事实**:源 md 工作区 CRLF、dsh 副本 LF——diff 前须 `tr -d '\r'` 归一,否则整文件误报差异
- **commit dd80d5d 已 push origin/main**(d1806a0..dd80d5d,含 dd499d7 memory 一并推送)
## R48 账号/视频详情属性内容统一宽度 140px(19:35-20:20 定稿)
- **用户真实意图(两次纠正后定稿)**:①「间隔不一样」≠行高≠列间 gap——是**各属性内容宽度参差**(grid `minmax(min-content,max-content)` 列贴内容:抖音号列 75.7~108.9px / 数字列 42px / 粉丝~70px / 获赞~80px,gap 其实恒 80px,是列宽不一造成视觉间隔差);②方案不是「max-width 上限」(只压抖音号列,其余列仍参差)而是**所有属性值固定统一 width**
- **终版落码(账号详情 + 视频详情同款)**:`.account-grid/.video-grid` 内 `.info-item { width: 140px }`(先 80 后用户改 140);`gap: 10px 80px → 10px 0`(去掉横向间隔,用户:「内容统一宽度不就行了,先设置80PX,不要其他间隔」→ 后改 140px);`.info-item .info-value { overflow:hidden; text-overflow:ellipsis; white-space:nowrap }` 统一省略号
- **info-wide 例外**:视频详情「标签」是 `.info-item.info-wide { grid-column:1/-1; width:auto }` 占整行不受限宽保持换行;省略号规则用 `:not(.info-wide)` 排除;账号定位整行在 grid 外天然不受影响
- **连带清理**:视频详情原 `vid-limited` 独立 max-width 220 被统一 140 覆盖→删冗余 CSS 规则(JS title 提示保留,hover 看全量);抖音号链接 title 改为「{完整抖音号} · 点击打开抖音主页」(省略号下 hover 看全量)
- **版本**:style.css af→ai(账号)→aj(视频详情);data-pages.js aj→ak(title 改动)
- **实测**:CDP 9225 账号页 7 字段、视频页 8 字段全 140px 等宽 PASS;colGap=0
- **commit**:c58f4ad(账号详情)+ 3f85853(视频详情),**⚠️ 未 push(SSH 222 Connection closed,待网络恢复重试)**
- **tmp 清理(20:18)**:60 个冒烟脚本/截图/probe 全清空(tmp/ 已被 .gitignore 忽略不入库);仅剩 `cdp-profile-r28`(66MB)被 9225 调试浏览器占用无法删(Device busy),关浏览器后可清
- **坑**:find -exec rm -rf 碰到被占用目录会卡住被 SIGTERM 中断、后续条目没删完→需 `! -name '被占用目录'` 排除后分批删
@@ -4,7 +4,7 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>MCN热点雷达</title>
<link rel="stylesheet" href="style.css?v=20260903aj">
<link rel="stylesheet" href="style.css?v=20260903ak">
<script src="vendor/echarts.min.js"></script>
</head>
<body>
@@ -458,6 +458,9 @@ main#view { height: calc(100vh - 55px); overflow: auto; } /* 55px=topbar 实际
/* 周榜表:fixed 布局固定列宽(auto 布局下 100% 表格富余空间会按比例摊薄拉宽列,min-width 压不住;fixed 下 width 为硬约束,账号列吃剩余) */
.table.table-rank { table-layout: fixed; }
.table.table-rank th, .table.table-rank td { overflow: hidden; text-overflow: ellipsis; }
/* R49 三 tab 行高对齐(09-03):账号周榜因「功能」列按钮(.btn-sm)行高 42px,热榜/点赞榜无按钮仅 34.7px——
统一 td 高度 42px(box-sizing:border-box,含 padding 7×2),三 tab 切换行高不再跳动 */
.table.table-rank td { height: 42px; }
.table.table-rank th.th-wide { width: 90px; }
.table.table-rank th:nth-child(1) { width: 40px; } /* 排名 */
.table.table-rank th:nth-child(2) { width: 90px; } /* 赛道 */
@@ -630,6 +633,8 @@ td.td-title { max-width: 240px; }
.rank-date-label { font-size: 14px; color: var(--dim); min-width: 62px; text-align: center; white-space: nowrap; }
.rank-preview-list { border: 1px solid var(--border); border-radius: 10px; overflow: hidden; background: var(--panel); box-shadow: var(--shadow); }
.rank-row { display: grid; grid-template-columns: 34px 84px minmax(80px, 1fr) 76px repeat(4, 76px) 72px; align-items: center; gap: 6px; padding: 6px 10px; font-size: 14px; border-bottom: 1px solid var(--border); }
/* R49 首页三 tab 行高对齐(09-03):账号周榜行高 40px(功能列按钮撑高),热榜/点赞榜 30.7px——统一数据行 min-height 40px */
.rank-preview-list .rank-row:not(.rank-head) { min-height: 40px; }
.rank-row:last-child { border-bottom: none; }
.rank-head { background: var(--panel); color: var(--dim); font-weight: 600; font-size: 13px; }
/* 首页 视频热榜/点赞榜 预览(8 列:排名/赛道/作品标题/作者/4 数值)——标题与作者吃剩余宽 */