主页面推荐支持关闭，支持自动打开浏览器

ui/src/assets/theme.css

@@ -34,6 +34,7 @@
   --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
   --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
   --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
+  --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
   
   /* 过渡动画 */
   --transition-fast: 0.15s ease;
@@ -45,6 +46,7 @@
   --radius-md: 0.375rem;
   --radius-lg: 0.5rem;
   --radius-xl: 0.75rem;
+  --radius-2xl: 1rem;
   
   /* 间距 */
   --spacing-xs: 0.25rem;
@@ -53,6 +55,13 @@
   --spacing-lg: 1rem;
   --spacing-xl: 1.5rem;
   --spacing-2xl: 2rem;
+  --spacing-3xl: 3rem;
+  
+  /* 渐变色 */
+  --gradient-primary: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);
+  --gradient-secondary: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
+  --gradient-success: linear-gradient(135deg, #10b981 0%, #059669 100%);
+  --gradient-warning: linear-gradient(135deg, #f59e0b 0%, #d97706 100%);
 }
 
 /* 暗色主题 */
@@ -400,8 +409,8 @@
 /* 切换开关 */
 .toggle-switch {
   position: relative;
-  width: 28px;
-  height: 14px;
+  width: 44px;
+  height: 24px;
 }
 
 .toggle-switch input {
@@ -419,19 +428,21 @@
   bottom: 0;
   background-color: var(--color-border);
   transition: var(--transition-normal);
-  border-radius: 14px;
+  border-radius: 24px;
+  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.1);
 }
 
 .toggle-slider:before {
   position: absolute;
   content: "";
-  height: 10px;
-  width: 10px;
-  left: 2px;
-  bottom: 2px;
+  height: 18px;
+  width: 18px;
+  left: 3px;
+  bottom: 3px;
   border-radius: 50%;
   background-color: white;
   transition: var(--transition-normal);
+  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
 }
 
 .toggle-switch input:checked + .toggle-slider {
@@ -439,11 +450,15 @@
 }
 
 .toggle-switch input:focus + .toggle-slider {
-  box-shadow: 0 0 1px var(--color-primary);
+  box-shadow: 0 0 0 2px var(--color-primary-light);
 }
 
 .toggle-switch input:checked + .toggle-slider:before {
-  transform: translateX(14px);
+  transform: translateX(20px);
+}
+
+.toggle-switch:hover .toggle-slider {
+  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.1), 0 0 0 2px var(--color-primary-light);
 }
 
 /* 加载状态 */