fix: 为所有卡片添加毛玻璃效果

- 修改 .card 基础样式,添加 backdrop-filter 支持
- 使用 rgba 背景色配合 var(--card-opacity) 实现透明度控制
- 所有卡片(文章、评论、侧边栏等)现在都会应用毛玻璃模糊和饱和度效果
- 夜间模式下使用深色半透明背景
This commit is contained in:
2026-01-27 23:49:32 +08:00
parent a12af3c4df
commit c9cebf0c14

View File

@@ -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));
}
/* 文章卡片优化 */