From ccc146cfbe32495e123e889efebb163e7709d49f Mon Sep 17 00:00:00 2001 From: chengma Date: Sat, 8 Aug 2026 11:16:44 +0800 Subject: [PATCH] =?UTF-8?q?style:=20=E8=9D=A6=E7=9A=AE=E5=95=86=E5=93=81?= =?UTF-8?q?=E5=90=8D=E7=A7=B0=E5=88=97=E5=86=8D=E6=94=B6=E7=AA=84=E5=88=B0?= =?UTF-8?q?=2018%=20(#41)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit 30% → 18%（初版的六成）。蝦皮标题普遍很长，实测最长 60+ 字且全是 关键词堆砌，不收窄的话这一列会把后面的颜色/尺码/SKU/待补几个数字 挤出屏幕——而那几个数字才是这个页面要看的东西。 数值只写在 app.css 一处，模板注释不再重复具体百分比， 免得下次改了数值忘了同步注释。title 属性保留，悬停看完整标题。 Co-Authored-By: Claude Opus 5 --- admin/static/css/app.css | 11 ++++++++--- admin/templates/shopee/list.html | 5 +++-- 2 files changed, 11 insertions(+), 5 deletions(-) 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}}