1.0
This commit is contained in:
		
							
								
								
									
										102
									
								
								xyzw_web_helper-main开源源码更新/src/assets/styles/variables.scss
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										102
									
								
								xyzw_web_helper-main开源源码更新/src/assets/styles/variables.scss
									
									
									
									
									
										Normal file
									
								
							@@ -0,0 +1,102 @@
 | 
			
		||||
// 颜色变量
 | 
			
		||||
:root {
 | 
			
		||||
  // 主题色
 | 
			
		||||
  --primary-color: #667eea;
 | 
			
		||||
  --primary-color-hover: #5a67d8;
 | 
			
		||||
  --primary-color-light: #e6f7ff;
 | 
			
		||||
  
 | 
			
		||||
  // 辅助色
 | 
			
		||||
  --secondary-color: #764ba2;
 | 
			
		||||
  --success-color: #18a058;
 | 
			
		||||
  --warning-color: #f5a623;
 | 
			
		||||
  --error-color: #d03050;
 | 
			
		||||
  --info-color: #2080f0;
 | 
			
		||||
  
 | 
			
		||||
  // 中性色
 | 
			
		||||
  --text-primary: #333333;
 | 
			
		||||
  --text-secondary: #666666;
 | 
			
		||||
  --text-tertiary: #999999;
 | 
			
		||||
  --text-disabled: #cccccc;
 | 
			
		||||
  
 | 
			
		||||
  // 背景色
 | 
			
		||||
  --bg-primary: #ffffff;
 | 
			
		||||
  --bg-secondary: #f5f7fa;
 | 
			
		||||
  --bg-tertiary: #f0f2f5;
 | 
			
		||||
  --bg-overlay: rgba(0, 0, 0, 0.5);
 | 
			
		||||
  
 | 
			
		||||
  // 边框色
 | 
			
		||||
  --border-light: #e5e7eb;
 | 
			
		||||
  --border-medium: #d1d5db;
 | 
			
		||||
  --border-dark: #9ca3af;
 | 
			
		||||
  
 | 
			
		||||
  // 阴影
 | 
			
		||||
  --shadow-light: 0 1px 3px rgba(0, 0, 0, 0.1);
 | 
			
		||||
  --shadow-medium: 0 4px 6px rgba(0, 0, 0, 0.1);
 | 
			
		||||
  --shadow-heavy: 0 10px 15px rgba(0, 0, 0, 0.1);
 | 
			
		||||
  
 | 
			
		||||
  // 圆角
 | 
			
		||||
  --border-radius-small: 4px;
 | 
			
		||||
  --border-radius-medium: 8px;
 | 
			
		||||
  --border-radius-large: 12px;
 | 
			
		||||
  --border-radius-xl: 16px;
 | 
			
		||||
  
 | 
			
		||||
  // 间距
 | 
			
		||||
  --spacing-xs: 4px;
 | 
			
		||||
  --spacing-sm: 8px;
 | 
			
		||||
  --spacing-md: 16px;
 | 
			
		||||
  --spacing-lg: 24px;
 | 
			
		||||
  --spacing-xl: 32px;
 | 
			
		||||
  --spacing-2xl: 48px;
 | 
			
		||||
  
 | 
			
		||||
  // 字体
 | 
			
		||||
  --font-size-xs: 12px;
 | 
			
		||||
  --font-size-sm: 14px;
 | 
			
		||||
  --font-size-md: 16px;
 | 
			
		||||
  --font-size-lg: 18px;
 | 
			
		||||
  --font-size-xl: 20px;
 | 
			
		||||
  --font-size-2xl: 24px;
 | 
			
		||||
  --font-size-3xl: 32px;
 | 
			
		||||
  
 | 
			
		||||
  --font-weight-light: 300;
 | 
			
		||||
  --font-weight-normal: 400;
 | 
			
		||||
  --font-weight-medium: 500;
 | 
			
		||||
  --font-weight-semibold: 600;
 | 
			
		||||
  --font-weight-bold: 700;
 | 
			
		||||
  
 | 
			
		||||
  // 行高
 | 
			
		||||
  --line-height-tight: 1.2;
 | 
			
		||||
  --line-height-normal: 1.5;
 | 
			
		||||
  --line-height-relaxed: 1.75;
 | 
			
		||||
  
 | 
			
		||||
  // 动画
 | 
			
		||||
  --transition-fast: 0.15s ease;
 | 
			
		||||
  --transition-normal: 0.3s ease;
 | 
			
		||||
  --transition-slow: 0.5s ease;
 | 
			
		||||
  
 | 
			
		||||
  // Z-index
 | 
			
		||||
  --z-dropdown: 1000;
 | 
			
		||||
  --z-sticky: 1020;
 | 
			
		||||
  --z-fixed: 1030;
 | 
			
		||||
  --z-modal-backdrop: 1040;
 | 
			
		||||
  --z-modal: 1050;
 | 
			
		||||
  --z-popover: 1060;
 | 
			
		||||
  --z-tooltip: 1070;
 | 
			
		||||
  --z-toast: 1080;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
// 暗色主题
 | 
			
		||||
[data-theme="dark"] {
 | 
			
		||||
  --text-primary: #ffffff;
 | 
			
		||||
  --text-secondary: #d1d5db;
 | 
			
		||||
  --text-tertiary: #9ca3af;
 | 
			
		||||
  --text-disabled: #6b7280;
 | 
			
		||||
  
 | 
			
		||||
  --bg-primary: #1f2937;
 | 
			
		||||
  --bg-secondary: #374151;
 | 
			
		||||
  --bg-tertiary: #4b5563;
 | 
			
		||||
  --bg-overlay: rgba(0, 0, 0, 0.7);
 | 
			
		||||
  
 | 
			
		||||
  --border-light: #4b5563;
 | 
			
		||||
  --border-medium: #6b7280;
 | 
			
		||||
  --border-dark: #9ca3af;
 | 
			
		||||
}
 | 
			
		||||
		Reference in New Issue
	
	Block a user