@mc-markets/ui 1.0.34 → 1.0.37

package/dist/{packages/styles → styles}/theme-config.d.ts

@@ -60,8 +60,6 @@ export declare class ThemeConfigManager {
     private generateLightColors;
     /** 生成深色变体 */
     private generateDarkColors;
-    /** 使颜色变暗 */
-    private darkenColor;
     /** 重置主题 */
     resetTheme(): void;
     /** 导出主题配置 */

package/dist/types/auto-imports.d.ts

@@ -0,0 +1,84 @@
+/* eslint-disable */
+/* prettier-ignore */
+// @ts-nocheck
+// Generated by unplugin-auto-import
+export {}
+declare global {
+  const EffectScope: typeof import('vue')['EffectScope']
+  const acceptHMRUpdate: typeof import('pinia')['acceptHMRUpdate']
+  const computed: typeof import('vue')['computed']
+  const createApp: typeof import('vue')['createApp']
+  const createPinia: typeof import('pinia')['createPinia']
+  const customRef: typeof import('vue')['customRef']
+  const defineAsyncComponent: typeof import('vue')['defineAsyncComponent']
+  const defineComponent: typeof import('vue')['defineComponent']
+  const defineStore: typeof import('pinia')['defineStore']
+  const effectScope: typeof import('vue')['effectScope']
+  const getActivePinia: typeof import('pinia')['getActivePinia']
+  const getCurrentInstance: typeof import('vue')['getCurrentInstance']
+  const getCurrentScope: typeof import('vue')['getCurrentScope']
+  const h: typeof import('vue')['h']
+  const inject: typeof import('vue')['inject']
+  const isProxy: typeof import('vue')['isProxy']
+  const isReactive: typeof import('vue')['isReactive']
+  const isReadonly: typeof import('vue')['isReadonly']
+  const isRef: typeof import('vue')['isRef']
+  const mapActions: typeof import('pinia')['mapActions']
+  const mapGetters: typeof import('pinia')['mapGetters']
+  const mapState: typeof import('pinia')['mapState']
+  const mapStores: typeof import('pinia')['mapStores']
+  const mapWritableState: typeof import('pinia')['mapWritableState']
+  const markRaw: typeof import('vue')['markRaw']
+  const nextTick: typeof import('vue')['nextTick']
+  const onActivated: typeof import('vue')['onActivated']
+  const onBeforeMount: typeof import('vue')['onBeforeMount']
+  const onBeforeRouteLeave: typeof import('vue-router')['onBeforeRouteLeave']
+  const onBeforeRouteUpdate: typeof import('vue-router')['onBeforeRouteUpdate']
+  const onBeforeUnmount: typeof import('vue')['onBeforeUnmount']
+  const onBeforeUpdate: typeof import('vue')['onBeforeUpdate']
+  const onDeactivated: typeof import('vue')['onDeactivated']
+  const onErrorCaptured: typeof import('vue')['onErrorCaptured']
+  const onMounted: typeof import('vue')['onMounted']
+  const onRenderTracked: typeof import('vue')['onRenderTracked']
+  const onRenderTriggered: typeof import('vue')['onRenderTriggered']
+  const onScopeDispose: typeof import('vue')['onScopeDispose']
+  const onServerPrefetch: typeof import('vue')['onServerPrefetch']
+  const onUnmounted: typeof import('vue')['onUnmounted']
+  const onUpdated: typeof import('vue')['onUpdated']
+  const provide: typeof import('vue')['provide']
+  const reactive: typeof import('vue')['reactive']
+  const readonly: typeof import('vue')['readonly']
+  const ref: typeof import('vue')['ref']
+  const resolveComponent: typeof import('vue')['resolveComponent']
+  const setActivePinia: typeof import('pinia')['setActivePinia']
+  const setMapStoreSuffix: typeof import('pinia')['setMapStoreSuffix']
+  const shallowReactive: typeof import('vue')['shallowReactive']
+  const shallowReadonly: typeof import('vue')['shallowReadonly']
+  const shallowRef: typeof import('vue')['shallowRef']
+  const storeToRefs: typeof import('pinia')['storeToRefs']
+  const toRaw: typeof import('vue')['toRaw']
+  const toRef: typeof import('vue')['toRef']
+  const toRefs: typeof import('vue')['toRefs']
+  const triggerRef: typeof import('vue')['triggerRef']
+  const unref: typeof import('vue')['unref']
+  const useAttrs: typeof import('vue')['useAttrs']
+  const useAuth: typeof import('../utils/composables/useAuth')['default']
+  const useCssModule: typeof import('vue')['useCssModule']
+  const useCssVars: typeof import('vue')['useCssVars']
+  const useGlobalProperties: typeof import('../utils/composables/useGlobalProperties')['default']
+  const useLink: typeof import('vue-router')['useLink']
+  const useMainPage: typeof import('../utils/composables/useMainPage')['default']
+  const useMenu: typeof import('../utils/composables/useMenu')['default']
+  const useRoute: typeof import('vue-router')['useRoute']
+  const useRouter: typeof import('vue-router')['useRouter']
+  const useSlots: typeof import('vue')['useSlots']
+  const watch: typeof import('vue')['watch']
+  const watchEffect: typeof import('vue')['watchEffect']
+  const watchPostEffect: typeof import('vue')['watchPostEffect']
+  const watchSyncEffect: typeof import('vue')['watchSyncEffect']
+}
+// for type re-export
+declare global {
+  // @ts-ignore
+  export type { Component, ComponentPublicInstance, ComputedRef, InjectionKey, PropType, Ref, VNode } from 'vue'
+}

package/dist/types/components.d.ts

@@ -0,0 +1,55 @@
+
+
+export {}
+
+declare module '@vue/runtime-core' {
+  export interface GlobalComponents {
+    CForm: typeof import('./../components/CForm/index.vue')['default']
+    ColSetting: typeof import('./../components/proTable/components/ColSetting.vue')['default']
+    proTable: typeof import('./../components/proTable/index.vue')['default']
+    Dialog: typeof import('./../components/Dialog/index.vue')['default']
+    ElBacktop: typeof import('element-plus/es')['ElBacktop']
+    ElBreadcrumb: typeof import('element-plus/es')['ElBreadcrumb']
+    ElBreadcrumbItem: typeof import('element-plus/es')['ElBreadcrumbItem']
+    ElButton: typeof import('element-plus/es')['ElButton']
+    ElConfigProvider: typeof import('element-plus/es')['ElConfigProvider']
+    ElDescriptions: typeof import('element-plus/es')['ElDescriptions']
+    ElDescriptionsItem: typeof import('element-plus/es')['ElDescriptionsItem']
+    ElDialog: typeof import('element-plus/es')['ElDialog']
+    ElDrawer: typeof import('element-plus/es')['ElDrawer']
+    ElDropdown: typeof import('element-plus/es')['ElDropdown']
+    ElDropdownItem: typeof import('element-plus/es')['ElDropdownItem']
+    ElDropdownMenu: typeof import('element-plus/es')['ElDropdownMenu']
+    ElEmpty: typeof import('element-plus/es')['ElEmpty']
+    ElForm: typeof import('element-plus/es')['ElForm']
+    ElFormItem: typeof import('element-plus/es')['ElFormItem']
+    ElIcon: typeof import('element-plus/es')['ElIcon']
+    ElImage: typeof import('element-plus/es')['ElImage']
+    ElInput: typeof import('element-plus/es')['ElInput']
+    ElMenu: typeof import('element-plus/es')['ElMenu']
+    ElMenuItem: typeof import('element-plus/es')['ElMenuItem']
+    ElPagination: typeof import('element-plus/es')['ElPagination']
+    ElSubMenu: typeof import('element-plus/es')['ElSubMenu']
+    ElSwitch: typeof import('element-plus/es')['ElSwitch']
+    ElTable: typeof import('element-plus/es')['ElTable']
+    ElTableColumn: typeof import('element-plus/es')['ElTableColumn']
+    ElTag: typeof import('element-plus/es')['ElTag']
+    ElTreeSelect: typeof import('element-plus/es')['ElTreeSelect']
+    ElUpload: typeof import('element-plus/es')['ElUpload']
+    Grid: typeof import('./../components/Grid/index.vue')['default']
+    GridItem: typeof import('./../components/Grid/components/GridItem.vue')['default']
+    NotAllowed: typeof import('./../components/NotAllowed/index.vue')['default']
+    PageHeader: typeof import('./../components/PageHeader/index.vue')['default']
+    PageMain: typeof import('./../components/PageMain/index.vue')['default']
+    Pagination: typeof import('./../components/proTable/components/Pagination.vue')['default']
+    PermissionConfig: typeof import('./../components/permissionConfig/index.vue')['default']
+    RouterLink: typeof import('vue-router')['RouterLink']
+    RouterView: typeof import('vue-router')['RouterView']
+    SearchBar: typeof import('./../components/SearchBar/index.vue')['default']
+    SearchForm: typeof import('./../components/SearchForm/index.vue')['default']
+    SearchFormItem: typeof import('./../components/SearchForm/components/SearchFormItem.vue')['default']
+    SvgIcon: typeof import('./../components/SvgIcon/index.vue')['default']
+    TableColumn: typeof import('./../components/proTable/components/TableColumn.vue')['default']
+    Upload: typeof import('./../components/upload/upload.vue')['default']
+  }
+}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@mc-markets/ui",
   "private": false,
-  "version": "1.0.34",
+  "version": "1.0.37",
   "type": "module",
   "author": "chenyu",
   "description": "Element Plus 完整导出包，提供所有组件、指令和服务",
@@ -50,6 +50,8 @@
   "license": "MIT",
   "scripts": {
     "dev": "vite",
+    "dev:fast": "cross-env NODE_ENV=development vite --force",
+    "dev:inspector": "cross-env VUE_INSPECTOR=true vite",
     "build": "tsc && vite build",
     "preview": "vite preview",
     "type-check": "vue-tsc --noEmit",
@@ -100,6 +102,7 @@
     "@vitejs/plugin-vue-jsx": "^3.0.1",
     "autoprefixer": "^10.4.14",
     "bumpp": "^9.1.0",
+    "cross-env": "^7.0.3",
     "cz-conventional-changelog": "^3.3.0",
     "cz-git": "^1.6.1",
     "eslint": "^8.38.0",
@@ -112,7 +115,7 @@
     "plop": "^3.1.2",
     "postcss-html": "^1.5.0",
     "prettier": "^2.8.8",
-    "sass": "^1.62.0",
+    "sass": "^1.77.0",
     "simple-git-hooks": "^2.8.1",
     "sortablejs": "^1.15.0",
     "stylelint": "^15.4.0",

package/packages/styles/element/form.scss

@@ -0,0 +1,27 @@
+.el-input {
+  --el-input-text-color: var(--text-white);
+  --el-input-border: var(--el-border);
+  --el-input-hover-border: var(--el-border-color-hover);
+  --el-input-focus-border: var(--el-color-primary);
+  --el-input-transparent-border: 0 0 0 1px transparent inset;
+  --el-input-border-color: var(--el-border-color);
+  --el-input-border-radius: var(--el-border-radius-base);
+  --el-input-bg-color: var(--el-fill-color-blank);
+  --el-input-icon-color: var(--el-text-color-placeholder);
+  --el-input-placeholder-color: var(--el-text-color-placeholder);
+  --el-input-hover-border-color: var(--el-border-color-hover);
+  --el-input-clear-hover-color: var(--el-text-color-secondary);
+  --el-input-focus-border-color: var(--el-color-primary);
+}
+
+.el-form-item__label {
+  height: var(--el-component-size);
+  line-height: var(--el-component-size);
+  color: var(--text-primary);
+}
+
+.el-form-item--label-top {
+  .el-form-item__label {
+    line-height: 20px;
+  }
+}

package/packages/styles/index.scss

@@ -8,9 +8,10 @@
  * - 图标字体
  */
 
-// 导入主题变量配置（包含所有CSS变量定义）
+// 导入 Element Plus 主题定制（包含所有 CSS 变量）
 @use './variables.scss';
-
-// 导入自定义组件样式
 @use './element/button.scss';
-@use './font/iconfont.scss';
+@use './element/form.scss';
+
+// 导入 Element Plus 基础样式
+// @import 'element-plus/dist/index.css';

package/packages/styles/theme-config.ts

@@ -115,21 +115,6 @@ export class ThemeConfigManager {
     root.style.setProperty(`--el-color-${type}-light-8`, lightColors[8])
     root.style.setProperty(`--el-color-${type}-light-9`, lightColors[9])
     root.style.setProperty(`--el-color-${type}-dark-2`, darkColors[2])
-    
-    // 同时更新暗色主题变量
-    if (this.currentTheme.dark) {
-      const darkBaseColor = this.darkenColor(baseColor, 0.1)
-      const darkLightColors = this.generateLightColors(darkBaseColor)
-      const darkDarkColors = this.generateDarkColors(darkBaseColor)
-      
-      root.style.setProperty(`--el-color-${type}`, this.rgbToHex(darkBaseColor.r, darkBaseColor.g, darkBaseColor.b))
-      root.style.setProperty(`--el-color-${type}-light-3`, darkLightColors[3])
-      root.style.setProperty(`--el-color-${type}-light-5`, darkLightColors[5])
-      root.style.setProperty(`--el-color-${type}-light-7`, darkLightColors[7])
-      root.style.setProperty(`--el-color-${type}-light-8`, darkLightColors[8])
-      root.style.setProperty(`--el-color-${type}-light-9`, darkLightColors[9])
-      root.style.setProperty(`--el-color-${type}-dark-2`, darkDarkColors[2])
-    }
   }
   
   /** 应用主题 */
@@ -218,15 +203,6 @@ export class ThemeConfigManager {
     return colors
   }
   
-  /** 使颜色变暗 */
-  private darkenColor(rgb: { r: number; g: number; b: number }, factor: number): { r: number; g: number; b: number } {
-    return {
-      r: Math.round(rgb.r * (1 - factor)),
-      g: Math.round(rgb.g * (1 - factor)),
-      b: Math.round(rgb.b * (1 - factor))
-    }
-  }
-  
   /** 重置主题 */
   resetTheme(): void {
     const root = document.documentElement

package/packages/styles/variables.scss

@@ -6,6 +6,66 @@
  */
 
 // 导入所有 Element Plus 样式
+// 自定义 Element Plus 变量
+@forward 'element-plus/theme-chalk/src/common/var.scss' with (
+  // 自定义颜色变量
+  $colors: (
+    'primary': (
+      'base': red,
+    ),
+    'success': (
+      'base': #34A88B ,
+    ),
+    'warning': (
+      'base': #FFA61F,
+    ),
+    'danger': (
+      'base': #f14654,
+    ),
+    'info': (
+      'base': #585660,
+    ),
+  ),
+  // 自定义字体大小
+  $font-size: (
+    'extra-large': 20px,
+    'large': 18px,
+    'medium': 16px,
+    'base': 14px,
+    'small': 12px,
+    'extra-small': 10px,
+  ),
+  // 自定义圆角
+  $border-radius: (
+    'base': 8px,
+    'small': 4px,
+    'round': 20px,
+    'circle': 100%,
+  ),
+  
+  // 自定义阴影
+  $box-shadow: (
+    'base': (
+      0 2px 4px rgba(0, 0, 0, 0.12),
+      0 0 6px rgba(0, 0, 0, 0.04)
+    ),
+    'light': (
+      0 2px 12px 0 rgba(0, 0, 0, 0.1)
+    ),
+    'lighter': (
+      0 2px 12px 0 rgba(0, 0, 0, 0.06)
+    ),
+    'dark': (
+      0 2px 4px rgba(0, 0, 0, 0.12),
+      0 0 6px rgba(0, 0, 0, 0.12)
+    ),
+  ),
+  $common-component-size: (
+    'large': 40px,
+    'default': 48px,
+    'small': 24px,
+  )
+);
 @use "element-plus/theme-chalk/src/index.scss" as *;
 @use 'element-plus/theme-chalk/src/dark/css-vars.scss';
 
@@ -17,148 +77,81 @@
 @use './variables/spacing-mode.css';
 @use './variables/typography-desktop.css';
 
-// 生成CSS变量
-:root {
-  // 主色调
-  --el-color-primary: #FFD905;
-  --el-color-primary-light-3: #FFE855;
-  --el-color-primary-light-5: #FFED7A;
-  --el-color-primary-light-7: #FFF2A0;
-  --el-color-primary-light-8: #FFF5B3;
-  --el-color-primary-light-9: #FFF9D9;
-  --el-color-primary-dark-2: #E6C300;
-  
-  // 成功色
-  --el-color-success: #34A88B;
-  --el-color-success-light-3: #5BB89E;
-  --el-color-success-light-5: #7CC7B1;
-  --el-color-success-light-7: #9DD6C4;
-  --el-color-success-light-8: #B3E0D2;
-  --el-color-success-light-9: #D9F0E8;
-  --el-color-success-dark-2: #2A8A73;
-  
-  // 警告色
-  --el-color-warning: #FFA61F;
-  --el-color-warning-light-3: #FFB84D;
-  --el-color-warning-light-5: #FFC973;
-  --el-color-warning-light-7: #FFD999;
-  --el-color-warning-light-8: #FFE2B3;
-  --el-color-warning-light-9: #FFF0D9;
-  --el-color-warning-dark-2: #E6940C;
+// // 生成CSS变量
+// :root{
+//   --el-component-size-large: 40px;
+//   --el-component-size: 48px;
+//   --el-component-size-small: 24px;
+// }
+// :root.dark {
+//   // 主色调
+//   --el-color-primary: #FFD905;
+//   --el-color-primary-light-3: #FFE855;
+//   --el-color-primary-light-5: #FFED7A;
+//   --el-color-primary-light-7: #FFF2A0;
+//   --el-color-primary-light-8: #FFF5B3;
+//   --el-color-primary-light-9: #FFF9D9;
+//   --el-color-primary-dark-2: #E6C300;
   
-  // 危险色
-  --el-color-danger: #f14654;
-  --el-color-danger-light-3: #F46B77;
-  --el-color-danger-light-5: #F78A94;
-  --el-color-danger-light-7: #FAA9B1;
-  --el-color-danger-light-8: #FBC2C8;
-  --el-color-danger-light-9: #FDE0E3;
-  --el-color-danger-dark-2: #D63A47;
+//   // 成功色
+//   --el-color-success: #34A88B;
+//   --el-color-success-light-3: #5BB89E;
+//   --el-color-success-light-5: #7CC7B1;
+//   --el-color-success-light-7: #9DD6C4;
+//   --el-color-success-light-8: #B3E0D2;
+//   --el-color-success-light-9: #D9F0E8;
+//   --el-color-success-dark-2: #2A8A73;
   
-  // 信息色
-  --el-color-info: #585660;
-  --el-color-info-light-3: #7A7A82;
-  --el-color-info-light-5: #96969C;
-  --el-color-info-light-7: #B2B2B6;
-  --el-color-info-light-8: #C6C6C9;
-  --el-color-info-light-9: #E0E0E2;
-  --el-color-info-dark-2: #46464E;
+//   // 警告色
+//   --el-color-warning: #FFA61F;
+//   --el-color-warning-light-3: #FFB84D;
+//   --el-color-warning-light-5: #FFC973;
+//   --el-color-warning-light-7: #FFD999;
+//   --el-color-warning-light-8: #FFE2B3;
+//   --el-color-warning-light-9: #FFF0D9;
+//   --el-color-warning-dark-2: #E6940C;
   
-  // 字体大小
-  --el-font-size-extra-large: 20px;
-  --el-font-size-large: 18px;
-  --el-font-size-medium: 16px;
-  --el-font-size-base: 14px;
-  --el-font-size-small: 12px;
-  --el-font-size-extra-small: 10px;
+//   // 危险色
+//   --el-color-danger: #f14654;
+//   --el-color-danger-light-3: #F46B77;
+//   --el-color-danger-light-5: #F78A94;
+//   --el-color-danger-light-7: #FAA9B1;
+//   --el-color-danger-light-8: #FBC2C8;
+//   --el-color-danger-light-9: #FDE0E3;
+//   --el-color-danger-dark-2: #D63A47;
   
-  // 圆角
-  --el-border-radius-base: 8px;
-  --el-border-radius-small: 4px;
-  --el-border-radius-round: 20px;
-  --el-border-radius-circle: 100%;
+//   // 信息色
+//   --el-color-info: #585660;
+//   --el-color-info-light-3: #7A7A82;
+//   --el-color-info-light-5: #96969C;
+//   --el-color-info-light-7: #B2B2B6;
+//   --el-color-info-light-8: #C6C6C9;
+//   --el-color-info-light-9: #E0E0E2;
+//   --el-color-info-dark-2: #46464E;
   
-  // 间距
-  --el-spacing-base: 16px;
-  --el-spacing-small: 8px;
-  --el-spacing-large: 24px;
+//   // 字体大小
+//   --el-font-size-extra-large: 20px;
+//   --el-font-size-large: 18px;
+//   --el-font-size-medium: 16px;
+//   --el-font-size-base: 14px;
+//   --el-font-size-small: 12px;
+//   --el-font-size-extra-small: 10px;
   
-  // 阴影
-  --el-box-shadow-base: 0 2px 4px rgba(0, 0, 0, 0.12), 0 0 6px rgba(0, 0, 0, 0.04);
-  --el-box-shadow-light: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
-  --el-box-shadow-dark: 0 2px 12px 0 rgba(0, 0, 0, 0.2);
+//   // 圆角
+//   --el-border-radius-base: 8px;
+//   --el-border-radius-small: 4px;
+//   --el-border-radius-round: 20px;
+//   --el-border-radius-circle: 100%;
   
-  // 过渡动画
-  --el-transition-base: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
-  --el-transition-fade: opacity 0.3s cubic-bezier(0.23, 1, 0.32, 1);
-  --el-transition-md-fade: transform 0.3s cubic-bezier(0.23, 1, 0.32, 1), opacity 0.3s cubic-bezier(0.23, 1, 0.32, 1);
-  --el-transition-fade-linear: opacity 0.2s linear;
-  --el-transition-border: border-color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
-  --el-transition-box-shadow: box-shadow 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
-  --el-transition-color: color 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
-}
+//   // 间距
+//   --el-spacing-base: 16px;
+//   --el-spacing-small: 8px;
+//   --el-spacing-large: 24px;
 
-// 暗色主题
-.dark {
-  // 在暗色主题中重新定义颜色变量（手动定义避免SCSS函数问题）
-  --el-color-primary: #E6C300;
-  --el-color-primary-light-3: #D9B300;
-  --el-color-primary-light-5: #CCA300;
-  --el-color-primary-light-7: #BF9300;
-  --el-color-primary-light-8: #B28300;
-  --el-color-primary-light-9: #A57300;
-  --el-color-primary-dark-2: #CCB300;
-  
-  --el-color-success: #2A8A73;
-  --el-color-success-light-3: #267A66;
-  --el-color-success-light-5: #226A59;
-  --el-color-success-light-7: #1E5A4C;
-  --el-color-success-light-8: #1A4A3F;
-  --el-color-success-light-9: #163A32;
-  --el-color-success-dark-2: #247A66;
-  
-  --el-color-warning: #E6940C;
-  --el-color-warning-light-3: #D1840B;
-  --el-color-warning-light-5: #BC740A;
-  --el-color-warning-light-7: #A76409;
-  --el-color-warning-light-8: #925408;
-  --el-color-warning-light-9: #7D4407;
-  --el-color-warning-dark-2: #D1840B;
-  
-  --el-color-danger: #D63A47;
-  --el-color-danger-light-3: #C1333F;
-  --el-color-danger-light-5: #AC2C37;
-  --el-color-danger-light-7: #97252F;
-  --el-color-danger-light-8: #821E27;
-  --el-color-danger-light-9: #6D171F;
-  --el-color-danger-dark-2: #C1333F;
-  
-  --el-color-info: #46464E;
-  --el-color-info-light-3: #3F3F46;
-  --el-color-info-light-5: #38383E;
-  --el-color-info-light-7: #313136;
-  --el-color-info-light-8: #2A2A2E;
-  --el-color-info-light-9: #232326;
-  --el-color-info-dark-2: #3F3F46;
-  
-  // 暗色主题特殊变量
-  --el-bg-color: #141414;
-  --el-bg-color-page: #0a0a0a;
-  --el-text-color-primary: #e5eaf3;
-  --el-text-color-regular: #cfd3dc;
-  --el-text-color-secondary: #a3a6ad;
-  --el-text-color-placeholder: #8d9095;
-  --el-text-color-disabled: #6c6e72;
-  --el-border-color: #4c4d4f;
-  --el-border-color-light: #414243;
-  --el-border-color-lighter: #363637;
-  --el-border-color-extra-light: #2b2b2c;
-  --el-fill-color: #f0f2f5;
-  --el-fill-color-light: #f5f7fa;
-  --el-fill-color-lighter: #fafafa;
-  --el-fill-color-extra-light: #fafcff;
-  --el-fill-color-blank: #ffffff;
-  --el-fill-color-dark: #ebedf0;
-  --el-fill-color-darker: #e6e8eb;
-  --el-fill-color-darkest: #b1b3b8;
-}
+//   // 边框
+
+//   // 
+//   --el-component-size-large: 40px;
+//   --el-component-size: 48px;
+//   --el-component-size-small: 24px;
+// }