fix: 为所有卡片添加毛玻璃效果
- 修改 .card 基础样式,添加 backdrop-filter 支持 - 使用 rgba 背景色配合 var(--card-opacity) 实现透明度控制 - 所有卡片(文章、评论、侧边栏等)现在都会应用毛玻璃模糊和饱和度效果 - 夜间模式下使用深色半透明背景
This commit is contained in:
10
style.css
10
style.css
@@ -15153,13 +15153,15 @@ html.darkmode body {
|
||||
|
||||
/* 卡片悬浮效果增强 */
|
||||
.card {
|
||||
border: 1px solid rgba(var(--themecolor-rgbstr), 0.06);
|
||||
background-color: var(--color-foreground);
|
||||
border: 1px solid rgba(var(--themecolor-rgbstr), 0.06);
|
||||
background-color: rgba(255, 255, 255, var(--card-opacity));
|
||||
-webkit-backdrop-filter: blur(var(--card-blur)) saturate(var(--card-saturate));
|
||||
backdrop-filter: blur(var(--card-blur)) saturate(var(--card-saturate));
|
||||
}
|
||||
|
||||
html.darkmode .card {
|
||||
border: 1px solid rgba(255, 255, 255, 0.05);
|
||||
background-color: var(--color-foreground);
|
||||
border: 1px solid rgba(255, 255, 255, 0.05);
|
||||
background-color: rgba(66, 66, 66, var(--card-opacity));
|
||||
}
|
||||
|
||||
/* 文章卡片优化 */
|
||||
|
||||
Reference in New Issue
Block a user