diff --git a/admin/static/css/app.css b/admin/static/css/app.css index 77a1b71..a88f54a 100644 --- a/admin/static/css/app.css +++ b/admin/static/css/app.css @@ -151,12 +151,17 @@ tr.empty small { color: #aaa; } text-overflow: ellipsis; } -/* 蝦皮数据页商品名称列收窄到 30%,配合 .truncate 一起用(见工单 #41)。 +/* 蝦皮数据页商品名称列收窄,配合 .truncate 一起用(见工单 #41)。 用独立类设 max-width,不用 flex——.search-narrow 那套是给工具条用的, 表格单元格不是 flex 布局,flex 在这里不生效。放在 .truncate 之后, - 同优先级下按 CSS 层叠顺序覆盖 .truncate 的 280px。 */ + 同优先级下按 CSS 层叠顺序覆盖 .truncate 的 280px。 + + 18% = 初版 30% 的六成。蝦皮标题普遍很长(实测最长 60+ 字, + 全是关键词堆砌),不收窄的话这一列会把后面的颜色/尺码/SKU/待补 + 几个关键数字挤出屏幕——而那几个数字才是这个页面要看的东西。 + 完整标题靠悬停的 title 属性看。 */ .col-title { - max-width: 30%; + max-width: 18%; } /* ── 弹窗 ─────────────────────────────── */ diff --git a/admin/templates/shopee/list.html b/admin/templates/shopee/list.html index 4badc23..224e46e 100644 --- a/admin/templates/shopee/list.html +++ b/admin/templates/shopee/list.html @@ -57,8 +57,9 @@ {{.GoodsID}} - {{/* 商品名称列收窄到 30%,用独立的 .col-title 类设 max-width, - 不用 flex——表格单元格和工具条的 .search-narrow 那套不一样,见 #41。 */}} + {{/* 商品名称列收窄,用独立的 .col-title 类设 max-width(具体数值见 app.css), + 不用 flex——表格单元格和工具条的 .search-narrow 那套不一样,见 #41。 + title 属性让悬停能看完整标题,收窄之后必须留着。 */}} {{.Title}} {{.ColorCount}} {{.SizeCount}}