整合主题管理器，优化主题切换逻辑

2026-09-05 15:36:49 +08:00 · 2025-07-25 13:39:47 +08:00
parent cf72b2cdb9
commit f36c1bd2b5
6 changed files with 450 additions and 215 deletions
@@ -0,0 +1,110 @@
+// 透明主题专用样式
+html[data-theme="transparent"] {
+  // 应用、布局、主内容区域
+  .v-application, .v-layout, .v-main, .layout-page-content {
+    background: transparent;
+  }
+  
+  // 侧边导航栏
+  .layout-vertical-nav {
+    backdrop-filter: blur(16px);
+    background-color: rgba(var(--v-theme-surface), 0.2);
+    border-inline-end: 1px solid rgba(var(--v-theme-on-surface), 0.05);
+  }
+
+  // 列表
+  .v-list {
+    backdrop-filter: blur(10px);
+    background-color: rgba(var(--v-theme-surface), 0.3);
+  }
+  
+  // 卡片
+  .v-card:not(.no-blur) {
+    backdrop-filter: blur(10px);
+    background-color: rgba(var(--v-theme-surface), 0.3);
+
+    .v-list {
+      backdrop-filter: none;
+      background-color: transparent;
+    }
+  }
+
+  // 工具栏
+  .v-toolbar {
+    backdrop-filter: blur(10px);
+    background-color: rgba(var(--v-theme-surface), 0.3);
+  }
+  
+  // 表格
+  .v-table {
+    border-radius: 0;
+    background-color: rgba(var(--v-theme-surface), 0);
+
+    .v-table__wrapper > table > thead {
+      background-color: rgba(var(--v-theme-surface), 0.3);
+    }
+  }
+  
+  // 页脚
+  .v-footer {
+    backdrop-filter: blur(10px);
+    background-color: rgba(var(--v-theme-surface), 0.3);
+  }
+
+  // Sheet
+  .v-sheet {
+    backdrop-filter: blur(10px);
+    background-color: rgba(var(--v-theme-surface), 0.3);
+  }
+  
+  // 页面容器
+  .layout-content-wrapper {
+    background: transparent;
+  }
+  
+  // 无内容区域的背景设为透明
+  .page-content-container {
+    background: transparent;
+  }
+  
+  // 对话框和菜单蒙层样式
+  .v-overlay__scrim {
+    background: rgba(var(--v-overlay-scrim-background), var(--v-overlay-scrim-opacity));
+  }
+
+  // 折叠面板
+  .v-expansion-panel {
+    backdrop-filter: blur(10px);
+    background-color: rgba(var(--v-theme-surface), 0.3);
+  }
+
+  // 加载占位
+  .v-skeleton-loader {
+    background-color: rgba(var(--v-theme-surface), 0.3);
+  }
+
+  // 输入框和搜索框
+  .v-field {
+    background-color: rgba(var(--v-theme-surface), 0);
+  }
+  
+  // 弹出层内容
+  .v-overlay__content {
+    border-radius: 12px !important;
+    backdrop-filter: blur(10px) !important;
+
+    .v-list {
+      backdrop-filter: blur(10px);
+      background-color: rgb(var(--v-theme-surface), 0.5) !important;
+    }
+
+    .v-card:not(.bg-primary) {
+      backdrop-filter: blur(10px);
+      background-color: rgb(var(--v-theme-surface), 0.5) !important;
+    }
+
+    .v-table__wrapper table thead {
+      background-color: rgba(var(--v-theme-surface), 0.3);
+    }
+  }
+}