vxe-pc-ui 4.15.13 → 4.15.15

package/styles/components/radio.scss

@@ -1,5 +1,23 @@
 @use '../helpers/baseMixin.scss';
 
+// 局部变量
+.vxe-radio {
+  --vxe-ui-radio-current-font-size: var(--vxe-ui-font-size-default);
+  --vxe-ui-radio-current-margin-right: var(--vxe-ui-base-margin-gap-default);
+  &.size--medium {
+    --vxe-ui-radio-current-font-size: var(--vxe-ui-font-size-medium);
+    --vxe-ui-radio-current-margin-right: var(--vxe-ui-base-margin-gap-medium);
+  }
+  &.size--small {
+    --vxe-ui-radio-current-font-size: var(--vxe-ui-font-size-small);
+    --vxe-ui-radio-current-margin-right: var(--vxe-ui-base-margin-gap-small);
+  }
+  &.size--mini {
+    --vxe-ui-radio-current-font-size: var(--vxe-ui-font-size-mini);
+    --vxe-ui-radio-current-margin-right: var(--vxe-ui-base-margin-gap-mini);
+  }
+}
+
 /*radio-group*/
 .vxe-radio-group {
   display: inline-flex;
@@ -16,9 +34,12 @@
 /*radio*/
 .vxe-radio {
   display: inline-flex;
+  flex-direction: row;
+  align-items: center;
   vertical-align: middle;
   white-space: nowrap;
   line-height: 1;
+  font-size: var(--vxe-ui-radio-current-font-size);
   @include baseMixin.createRadioIcon();
   > input {
     &[type="radio"] {
@@ -47,16 +68,6 @@
 }
 
 .vxe-radio {
-  font-size: var(--vxe-ui-font-size-default);
-  &.size--medium {
-    font-size: var(--vxe-ui-font-size-medium);
-  }
-  &.size--small {
-    font-size: var(--vxe-ui-font-size-small);
-  }
-  &.size--mini {
-    font-size: var(--vxe-ui-font-size-mini);
-  }
   &:last-of-type {
     margin-right: 0;
   }
@@ -64,17 +75,5 @@
 
 .vxe-radio--default,
 .vxe-radio-group {
-  margin-right: var(--vxe-ui-base-margin-gap-default);
-  &.size--medium {
-    margin-right: var(--vxe-ui-base-margin-gap-medium);
-  }
-  &.size--small {
-    margin-right: var(--vxe-ui-base-margin-gap-small);
-  }
-  &.size--mini {
-    margin-right: var(--vxe-ui-base-margin-gap-mini);
-  }
-  &:last-of-type {
-    margin-right: 0;
-  }
+  margin-right: var(--vxe-ui-radio-current-margin-right);
 }

package/styles/components/select.scss

@@ -1,10 +1,38 @@
 @use '../helpers/baseMixin.scss';
 @use '../helpers/placement.scss';
 
+// 局部变量
+.vxe-select,
+.vxe-select--panel {
+  --vxe-ui-select-current-font-size: var(--vxe-ui-font-size-default);
+  --vxe-ui-select-current-option-height: var(--vxe-ui-select-option-height-default);
+  &.size--medium {
+    --vxe-ui-select-current-font-size: var(--vxe-ui-font-size-medium);
+    --vxe-ui-select-current-option-height: var(--vxe-ui-select-option-height-medium);
+  }
+  &.size--small {
+    --vxe-ui-select-current-font-size: var(--vxe-ui-font-size-small);
+    --vxe-ui-select-current-option-height: var(--vxe-ui-select-option-height-small);
+  }
+  &.size--mini {
+    --vxe-ui-select-current-font-size: var(--vxe-ui-font-size-mini);
+    --vxe-ui-select-current-option-height: var(--vxe-ui-select-option-height-mini);
+  }
+}
+.vxe-select,
+.vxe-select--panel {
+  --vxe-ui-select-current-padding: var(--vxe-ui-layout-padding-default);
+  &.size--small,
+  &.size--mini {
+    --vxe-ui-select-current-padding: var(--vxe-ui-layout-padding-half);
+  }
+}
+
 .vxe-select {
   position: relative;
   display: inline-block;
   width: 180px;
+  font-size: var(--vxe-ui-select-current-font-size);
   color: var(--vxe-ui-font-color);
   text-align: left;
   & > .vxe-input {
@@ -51,6 +79,7 @@
 }
 
 .vxe-select--panel {
+  font-size: var(--vxe-ui-select-current-font-size);
   @include placement.createPlacementPanel();
 }
 
@@ -95,7 +124,7 @@
   min-height: 2em;
 }
 .vxe-select--total-btns {
-  padding-left: var(--vxe-ui-current-padding);
+  padding-left: var(--vxe-ui-select-current-padding);
   flex-grow: 1;
 }
 .vxe-select--total-btns,
@@ -214,66 +243,11 @@
   color: var(--vxe-ui-select-empty-color);
 }
 
-.vxe-select,
-.vxe-select--panel {
-  font-size: var(--vxe-ui-font-size-default);
-  &.size--medium {
-    font-size: var(--vxe-ui-font-size-medium);
-  }
-  &.size--small {
-    font-size: var(--vxe-ui-font-size-small);
-  }
-  &.size--mini {
-    font-size: var(--vxe-ui-font-size-mini);
-  }
-}
-
-.vxe-select,
-.vxe-select--panel {
-  --vxe-ui-current-padding: var(--vxe-ui-layout-padding-default);
-  &.size--small,
-  &.size--mini {
-    --vxe-ui-current-padding: var(--vxe-ui-layout-padding-half);
-  }
+.vxe-select-option {
+  height: var(--vxe-ui-select-current-option-height);
 }
-
-.vxe-select--panel {
-  .vxe-select-option {
-    height: var(--vxe-ui-select-option-height-default);
-  }
-  .vxe-select-option,
-  .vxe-select--search-loading,
-  .vxe-select--empty-placeholder {
-    line-height: var(--vxe-ui-select-option-height-default);
-  }
-  &.size--medium {
-    .vxe-select-option {
-      height: var(--vxe-ui-select-option-height-medium);
-    }
-    .vxe-select-option,
-    .vxe-select--search-loading,
-    .vxe-select--empty-placeholder {
-      line-height: var(--vxe-ui-select-option-height-medium);
-    }
-  }
-  &.size--small {
-    .vxe-select-option {
-      height: var(--vxe-ui-select-option-height-small);
-    }
-    .vxe-select-option,
-    .vxe-select--search-loading,
-    .vxe-select--empty-placeholder {
-      line-height: var(--vxe-ui-select-option-height-small);
-    }
-  }
-  &.size--mini {
-    .vxe-select-option {
-      height: var(--vxe-ui-select-option-height-mini);
-    }
-    .vxe-select-option,
-    .vxe-select--search-loading,
-    .vxe-select--empty-placeholder {
-      line-height: var(--vxe-ui-select-option-height-mini);
-    }
-  }
+.vxe-select-option,
+.vxe-select--search-loading,
+.vxe-select--empty-placeholder {
+  line-height: var(--vxe-ui-select-current-option-height);
 }

package/styles/components/tree-select.scss

@@ -1,10 +1,31 @@
 @use '../helpers/baseMixin.scss';
 @use '../helpers/placement.scss';
 
+
+// 局部变量
+.vxe-tree-select,
+.vxe-tree-select--panel {
+  --vxe-ui-tree-select-current-font-size: var(--vxe-ui-font-size-default);
+  --vxe-ui-tree-select-current-padding: var(--vxe-ui-layout-padding-default);
+  &.size--medium {
+    --vxe-ui-tree-select-current-font-size: var(--vxe-ui-font-size-medium);
+    --vxe-ui-tree-select-current-padding: var(--vxe-ui-layout-padding-medium);
+  }
+  &.size--small {
+    --vxe-ui-tree-select-current-font-size: var(--vxe-ui-font-size-small);
+    --vxe-ui-tree-select-current-padding: var(--vxe-ui-layout-padding-small);
+  }
+  &.size--mini {
+    --vxe-ui-tree-select-current-font-size: var(--vxe-ui-font-size-mini);
+    --vxe-ui-tree-select-current-padding: var(--vxe-ui-layout-padding-mini);
+  }
+}
+
 .vxe-tree-select {
   position: relative;
   display: inline-block;
   width: 180px;
+  font-size: var(--vxe-ui-tree-select-current-font-size);
   color: var(--vxe-ui-font-color);
   text-align: left;
   & > .vxe-input {
@@ -55,13 +76,14 @@
 }
 
 .vxe-tree-select--panel {
+  font-size: var(--vxe-ui-tree-select-current-font-size);
   pointer-events: none;
   @include placement.createPlacementPanel();
 }
 
 .vxe-tree-select--panel-search {
   display: block;
-  padding: var(--vxe-ui-current-padding);
+  padding: var(--vxe-ui-tree-select-current-padding);
   .vxe-tree-select-search--input {
     width: 100%;
   }
@@ -76,7 +98,7 @@
   min-height: 2em;
 }
 .vxe-tree-select--total-btns {
-  padding-left: var(--vxe-ui-current-padding);
+  padding-left: var(--vxe-ui-tree-select-current-padding);
   flex-grow: 1;
 }
 .vxe-tree-select--total-btns,
@@ -128,10 +150,11 @@
 .vxe-tree-select-tree--wrapper {
   position: relative;
   overflow: auto;
-  padding: var(--vxe-ui-current-padding) 0;
+  padding: var(--vxe-ui-tree-select-current-padding) 0;
   outline: 0;
 }
 .vxe-tree-select--tree {
+  --vxe-ui-tree-node-padding: var(--vxe-ui-tree-select-current-padding);
   width: 100%;
   .vxe-tree--node-item {
     &.is-radio--checked,
@@ -145,27 +168,3 @@
     cursor: pointer;
   }
 }
-
-.vxe-tree-select,
-.vxe-tree-select--panel {
-  --vxe-ui-current-padding: var(--vxe-ui-layout-padding-default);
-  --vxe-ui-tree-node-root-indent: var(--vxe-ui-current-padding);
-  &.size--small,
-  &.size--mini {
-    --vxe-ui-current-padding: var(--vxe-ui-layout-padding-half);
-  }
-}
-
-.vxe-tree-select,
-.vxe-tree-select--panel {
-  font-size: var(--vxe-ui-font-size-default);
-  &.size--medium {
-    font-size: var(--vxe-ui-font-size-medium);
-  }
-  &.size--small {
-    font-size: var(--vxe-ui-font-size-small);
-  }
-  &.size--mini {
-    font-size: var(--vxe-ui-font-size-mini);
-  }
-}

package/styles/components/tree.scss

@@ -1,7 +1,22 @@
 @use '../helpers/baseMixin.scss';
 
+// 局部变量
+.vxe-tree {
+  --vxe-ui-tree-current-font-size: var(--vxe-ui-font-size-default);
+  &.size--medium {
+    --vxe-ui-tree-current-font-size: var(--vxe-ui-font-size-medium);
+  }
+  &.size--small {
+    --vxe-ui-tree-current-font-size: var(--vxe-ui-font-size-small);
+  }
+  &.size--mini {
+    --vxe-ui-tree-current-font-size: var(--vxe-ui-font-size-mini);
+  }
+}
+
 .vxe-tree {
   position: relative;
+  font-size: var(--vxe-ui-tree-current-font-size);
   color: var(--vxe-ui-font-color);
   font-family: var(--vxe-ui-font-family);
   &.node--trigger {
@@ -100,7 +115,7 @@
   @for $i from 0 to 10 {
     &.node--level-#{$i} {
       & > .vxe-tree--node-item {
-        padding-left: calc(var(--vxe-ui-tree-node-indent) * $i + var(--vxe-ui-tree-node-root-indent));
+        padding-left: calc(var(--vxe-ui-tree-node-indent) * $i + var(--vxe-ui-tree-node-root-indent) + var(--vxe-ui-tree-node-padding));
       }
     }
   }
@@ -291,16 +306,3 @@
   width: 0;
   float: left;
 }
-
-.vxe-tree {
-  font-size: var(--vxe-ui-font-size-default);
-  &.size--medium {
-    font-size: var(--vxe-ui-font-size-medium);
-  }
-  &.size--small {
-    font-size: var(--vxe-ui-font-size-small);
-  }
-  &.size--mini {
-    font-size: var(--vxe-ui-font-size-mini);
-  }
-}

package/styles/components/upload.scss

@@ -1,3 +1,23 @@
+
+// 局部变量
+.vxe-upload,
+.vxe-upload--more-popup {
+  --vxe-ui-upload-current-font-size: var(--vxe-ui-font-size-default);
+  --vxe-ui-upload-current-image-wh: var(--vxe-ui-upload-image-wh-default);
+  &.size--medium {
+    --vxe-ui-upload-current-font-size: var(--vxe-ui-font-size-medium);
+    --vxe-ui-upload-current-image-wh: var(--vxe-ui-upload-image-wh-medium);
+  }
+  &.size--small {
+    --vxe-ui-upload-current-font-size: var(--vxe-ui-font-size-small);
+    --vxe-ui-upload-current-image-wh: var(--vxe-ui-upload-image-wh-small);
+  }
+  &.size--mini {
+    --vxe-ui-upload-current-font-size: var(--vxe-ui-font-size-mini);
+    --vxe-ui-upload-current-image-wh: var(--vxe-ui-upload-image-wh-mini);
+  }
+}
+
 .vxe-upload {
   position: relative;
   color: var(--vxe-ui-font-color);
@@ -21,6 +41,7 @@
 
 .vxe-upload,
 .vxe-upload--more-popup {
+  font-size: var(--vxe-ui-upload-current-font-size);
   &.is--active {
     .vxe-upload--image-action-box {
       border-color: var(--vxe-ui-font-primary-color);
@@ -446,6 +467,7 @@
 
 .vxe-upload--more-popup {
   position: relative;
+  font-size: var(--vxe-ui-upload-current-font-size);
   .vxe-upload--file-list {
     max-height: none;
   }
@@ -457,42 +479,18 @@
     }
   }
 }
+
 .vxe-upload,
 .vxe-upload--more-popup {
-  font-size: var(--vxe-ui-font-size-default);
   .vxe-upload--image-item-box,
   .vxe-upload--image-action-box {
-    width: var(--vxe-ui-upload-image-wh-default);
-    height: var(--vxe-ui-upload-image-wh-default);
-  }
-  &.size--medium {
-    font-size: var(--vxe-ui-font-size-medium);
-    .vxe-upload--image-item-box,
-    .vxe-upload--image-action-box {
-      width: var(--vxe-ui-upload-image-wh-medium);
-      height: var(--vxe-ui-upload-image-wh-medium);
-    }
-  }
-  &.size--small {
-    font-size: var(--vxe-ui-font-size-small);
-    .vxe-upload--image-item-box,
-    .vxe-upload--image-action-box {
-      width: var(--vxe-ui-upload-image-wh-small);
-      height: var(--vxe-ui-upload-image-wh-small);
-    }
-  }
-  &.size--mini {
-    font-size: var(--vxe-ui-font-size-mini);
-    .vxe-upload--image-item-box,
-    .vxe-upload--image-action-box {
-      width: var(--vxe-ui-upload-image-wh-mini);
-      height: var(--vxe-ui-upload-image-wh-mini);
-    }
+    width: var(--vxe-ui-upload-current-image-wh);
+    height: var(--vxe-ui-upload-current-image-wh);
   }
 }
 .vxe-upload--image-more-list {
   .vxe-upload--image-item-box {
-    width: var(--vxe-ui-upload-image-wh-default);
-    height: var(--vxe-ui-upload-image-wh-default);
+    width: var(--vxe-ui-upload-current-image-wh);
+    height: var(--vxe-ui-upload-current-image-wh);
   }
-}
+}

package/styles/helpers/baseMixin.scss

@@ -43,7 +43,7 @@
     }
   }
   .vxe-checkbox--label {
-    padding-left: 0.5em;
+    padding-left: 0.4em;
     vertical-align: middle;
   }
 }
@@ -86,7 +86,7 @@
     }
   }
   .vxe-radio--label {
-    padding-left: 0.5em;
+    padding-left: 0.4em;
     vertical-align: middle;
   }
 }

package/styles/helpers/themeStatus.scss

@@ -0,0 +1,58 @@
+$btnThemeList: (
+  (
+    name: "primary",
+    textColor: var(--vxe-ui-font-primary-color),
+    btnColor: #fff,
+    btnLightenColor: var(--vxe-ui-font-primary-lighten-color),
+    btnDarkenColor: var(--vxe-ui-font-primary-darken-color),
+    btnDisabledColor: var(--vxe-ui-font-primary-disabled-color)
+  ),
+  (
+    name: "success",
+    textColor: var(--vxe-ui-status-success-color),
+    btnColor: #fff,
+    btnLightenColor: var(--vxe-ui-status-success-lighten-color),
+    btnDarkenColor: var(--vxe-ui-status-success-darken-color),
+    btnDisabledColor: var(--vxe-ui-status-success-disabled-color)
+  ),
+  (
+    name: "info",
+    textColor: var(--vxe-ui-status-info-color),
+    btnColor: #fff,
+    btnLightenColor: var(--vxe-ui-status-info-lighten-color),
+    btnDarkenColor: var(--vxe-ui-status-info-darken-color),
+    btnDisabledColor: var(--vxe-ui-status-info-disabled-color)
+  ),
+  (
+    name: "warning",
+    textColor: var(--vxe-ui-status-warning-color),
+    btnColor: #fff,
+    btnLightenColor: var(--vxe-ui-status-warning-lighten-color),
+    btnDarkenColor: var(--vxe-ui-status-warning-darken-color),
+    btnDisabledColor: var(--vxe-ui-status-warning-disabled-color)
+  ),
+  (
+    name: "danger",
+    textColor: var(--vxe-ui-status-danger-color),
+    btnColor: #fff,
+    btnLightenColor: var(--vxe-ui-status-danger-lighten-color),
+    btnDarkenColor: var(--vxe-ui-status-danger-darken-color),
+    btnDisabledColor: var(--vxe-ui-status-danger-disabled-color)
+  ),
+  (
+    name: "error",
+    textColor: var(--vxe-ui-status-error-color),
+    btnColor: #fff,
+    btnLightenColor: var(--vxe-ui-status-error-lighten-color),
+    btnDarkenColor: var(--vxe-ui-status-error-darken-color),
+    btnDisabledColor: var(--vxe-ui-status-error-disabled-color)
+  ),
+  (
+    name: "perfect",
+    textColor: var(--vxe-ui-table-header-background-color),
+    btnColor: var(--vxe-ui-font-color),
+    btnLightenColor: var(--vxe-ui-table-header-background-color),
+    btnDarkenColor: var(--vxe-ui-table-header-background-color),
+    btnDisabledColor: var(--vxe-ui-table-header-background-color)
+  )
+)

package/styles/theme/base.scss

@@ -3,10 +3,10 @@
   --vxe-ui-font-family: -apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Hiragino Sans GB,Microsoft YaHei,Helvetica Neue,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol;
   
   /*font size*/
-  --vxe-ui-font-size-large: 15px;
+  --vxe-ui-font-size-large: 16px;
   --vxe-ui-font-size-default: 14px;
   --vxe-ui-font-size-medium: 14px;
-  --vxe-ui-font-size-small: 13px;
+  --vxe-ui-font-size-small: 12px;
   --vxe-ui-font-size-mini: 12px;
 
   /*font color*/
@@ -23,12 +23,16 @@
   /*layout*/
   --vxe-ui-layout-padding-qtr: 2px;
   --vxe-ui-layout-padding-half: 4px;
-  --vxe-ui-layout-padding-default: 8px;
   --vxe-ui-layout-padding-double: 16px;
   --vxe-ui-layout-padding-threefold: 24px;
   --vxe-ui-layout-aside-default-width: 300px;
   --vxe-ui-layout-aside-collapse-width: 60px;
 
+  --vxe-ui-layout-padding-default: 8px;
+  --vxe-ui-layout-padding-medium: 7px;
+  --vxe-ui-layout-padding-small: 6px;
+  --vxe-ui-layout-padding-mini: 5px;
+
   /*menu*/
   --vxe-ui-menu-item-height-default: 44px;
   --vxe-ui-menu-item-height-medium: 40px;
@@ -178,6 +182,7 @@
   /*tree*/
   --vxe-ui-tree-node-height: 2em;
   --vxe-ui-tree-node-indent: 20px;
+  --vxe-ui-tree-node-padding: 0;
   --vxe-ui-tree-node-root-indent: 0px;
   --vxe-ui-tree-node-line-color:#909399;
   --vxe-ui-tree-node-line-style: dotted;
@@ -231,4 +236,7 @@
 
   /*list*/
   --vxe-ui-list-row-height: 2em;
+
+  /*icon-picker*/
+  --vxe-ui-icon-picker-panel-icon-font-size: 1.4em;
 }