yohaku 手机端打磨:dock 去圆标只留站名,压掉 iOS 顶部弹性露底(100dvh)
This commit is contained in:
1 parent
1b3eb870da
commit
942bad6158
3 files changed
+18
-8
No files matched your search
@@ -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);}
|
||||
|
||||
|
||||
Reference in new issue
Block a user