yohaku 手机端打磨:dock 去圆标只留站名,压掉 iOS 顶部弹性露底(100dvh)

This commit is contained in:
Sakurasan committed 2026-09-30 21:06:43 +08:00
1 parent 1b3eb870da
commit 942bad6158
3 files changed
+18 -8

No files matched your search

+6 -4
View File
@@ -61,19 +61,21 @@ html[data-ui='vivid'] .dock {position:fixed;z-index:90;
backdrop-filter:blur(20px) saturate(1.5);
-webkit-backdrop-filter:blur(20px) saturate(1.5);
box-shadow:var(--shadow-lg);}
html[data-ui='vivid'] .dock-brand {display:flex;align-items:center;gap:9px;
html[data-ui='vivid'] .dock-brand {display:flex;align-items:center;
font-weight:700;font-size:14px;letter-spacing:.02em;color:var(--ink);}
/* 窄屏才把 dock 摆出来;这条必须压在基准规则(display:none)之后 */
@media (max-width:720px) {
html[data-ui='vivid'] .dock {display:flex}
}
/* 品牌标记换成站标「一横」:它自身就是圆,所以去掉渐变圆盘与首字母字号;
右下角那颗绿色在线点保留(它是「有人在写」的信号,不属于被替换的部分)。 */
html[data-ui='vivid'] :is(.brand, .dock-brand) .av {width:30px;height:30px;flex:none;
右下角那颗绿色在线点保留(它是「有人在写」的信号,不属于被替换的部分)。
只作用于桌面顶栏 .brand:手机 dock 里已经不放站标(YohakuTop 的 dock 分支),
选择器不再需要 :is() 兼顾两边。 */
html[data-ui='vivid'] .brand .av {width:30px;height:30px;flex:none;
color:var(--ink);
box-shadow:0 0 0 2px var(--paper),0 0 0 3.5px var(--accent-soft);
position:relative;}
html[data-ui='vivid'] :is(.brand, .dock-brand) .av::after {content:"";position:absolute;right:-1px;bottom:-1px;
html[data-ui='vivid'] .brand .av::after {content:"";position:absolute;right:-1px;bottom:-1px;
width:9px;height:9px;border-radius:50%;
background:#34c759;border:2px solid var(--paper);}