diff --git a/frontend/src/ui/yohaku/home.css b/frontend/src/ui/yohaku/home.css index 856942e..17a1f4b 100644 --- a/frontend/src/ui/yohaku/home.css +++ b/frontend/src/ui/yohaku/home.css @@ -110,10 +110,11 @@ html[data-ui='vivid'] .tg::before {content:"#"} /* 短文纸条:不再用左线标记(线 + 内边距在手机上吃掉近 30px,且离内容有段 间距)。区分改用两层信号:极淡的强调色底块(背景不占布局宽度)+ meta 里的 SHORT 徽标;正文与长文卡片左缘对齐,一行内容都不浪费。 */ +/* 内边距对齐全站 12px 节奏;meta 上方 16px 的旧留白收掉 */ html[data-ui='vivid'] .note {display:block; background:color-mix(in srgb,var(--accent) 7%,transparent); border-radius:var(--radius); - padding:14px; + padding:12px; margin-left:0; position:relative; transition:background .35s var(--ease),transform .55s var(--spring),border-color .3s;} @@ -123,7 +124,7 @@ html[data-ui='vivid'] .note {display:block; box-shadow:var(--shadow);} } html[data-ui='vivid'] .note .meta {display:flex;gap:10px;align-items:center; - font-size:12px;color:var(--muted);font-weight:600;margin-top:16px;} + font-size:12px;color:var(--muted);font-weight:600;margin-top:10px;} html[data-ui='vivid'] .note .body {margin:0;font-size:15.5px;line-height:1.8;color:var(--text); /* 短文正文用的是 .body 而不是 .prose,所以拿不到 styles.css 里 .prose 的 overflow-wrap:anywhere——裸链接这种不可断行的长 token 会把整列撑到 550px+, diff --git a/frontend/src/ui/yohaku/mobile.css b/frontend/src/ui/yohaku/mobile.css index 0840d53..bb9ad7c 100644 --- a/frontend/src/ui/yohaku/mobile.css +++ b/frontend/src/ui/yohaku/mobile.css @@ -28,6 +28,8 @@ /* 页脚两侧跟内容对齐;底部 120px 是给旧 dock 留的,现在只有快发 FAB, 收到 56px 够它的悬浮高度 */ html[data-ui='vivid'] .foot {padding:28px 12px 56px} + /* 时间线条目间隔桌面 18px,手机上收一档:一屏能多看半条内容 */ + html[data-ui='vivid'] .feed {gap:14px} /* 标签 chips 在手机上会折成三四行,搜索框再挤一个 150px 控件 —— 都收起来, 只留类型分段,筛选条回到一行。