vxe-pc-ui 3.14.6 → 3.14.8

package/styles/components/watermark.scss

@@ -1,27 +1,27 @@
-.vxe-watermark {
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  height: 100%;
-  overflow: hidden;
-  user-select: none;
-  pointer-events: none;
-  background-repeat: repeat;
-  background-position: 0px 0px;
-  background-color: transparent;
-  z-index: 999999;
-}
-
-.vxe-watermark {
-  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-watermark {
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
+  user-select: none;
+  pointer-events: none;
+  background-repeat: repeat;
+  background-position: 0px 0px;
+  background-color: transparent;
+  z-index: 999999;
+}
+
+.vxe-watermark {
+  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/helpers/baseMixin.scss

@@ -1,96 +1,105 @@
-@mixin createAnimationTransition ($property, $duration: .1s, $func: ease-in-out) {
-  transition: $property $duration $func;
-}
-
-@mixin createCheckboxIcon {
-  .vxe-checkbox--icon {
-    font-size: 1.22em;
-  }
-  .vxe-checkbox--icon {
-    color: var(--vxe-ui-input-border-color);
-    vertical-align: middle;
-    font-weight: 700;
-    user-select: none;
-  }
-  &.is--checked,
-  &.is--indeterminate {
-    color: var(--vxe-ui-font-primary-color);
-    .vxe-checkbox--icon {
-      color: var(--vxe-ui-font-primary-color);
-    }
-  }
-  &:not(.is--disabled) {
-    cursor: pointer;
-    &:hover {
-      .vxe-checkbox--icon {
-        color: var(--vxe-ui-font-primary-color);
-      }
-    }
-  }
-  &.is--hidden {
-    cursor: default;
-  }
-  &.is--disabled {
-    color: var(--vxe-ui-font-disabled-color);
-    cursor: not-allowed;
-    .vxe-checkbox--icon {
-      color: var(--vxe-ui-input-disabled-color);
-    }
-  }
-  .vxe-checkbox--label {
-    padding-left: 0.5em;
-    vertical-align: middle;
-  }
-}
-
-@mixin createRadioIcon {
-  cursor: pointer;
-  .vxe-radio--icon {
-    font-size: 1.26em;
-  }
-  .vxe-radio--icon {
-    color: var(--vxe-ui-input-border-color);
-    border-radius: 50%;
-    vertical-align: middle;
-    font-weight: 700;
-    user-select: none;
-  }
-  &.is--checked {
-    color: var(--vxe-ui-font-primary-color);
-    .vxe-radio--icon {
-      color: var(--vxe-ui-font-primary-color);
-    }
-  }
-  &:not(.is--disabled) {
-    cursor: pointer;
-    &:hover {
-      .vxe-radio--icon {
-        color: var(--vxe-ui-font-primary-color);
-      }
-    }
-  }
-  &.is--disabled {
-    color: var(--vxe-ui-font-disabled-color);
-    cursor: not-allowed;
-    .vxe-radio--icon {
-      color: var(--vxe-ui-input-disabled-color);
-    }
-  }
-  .vxe-radio--label {
-    padding-left: 0.5em;
-    vertical-align: middle;
-  }
-}
-
-@mixin createEmptyMask {
-  &::after {
-    content: "";
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: 100%;
-    height: 100%;
-    z-index: 1;
-    user-select: none;
-  }
+@mixin createAnimationTransition ($property, $duration: .1s, $func: ease-in-out) {
+  transition: $property $duration $func;
+}
+
+@mixin createCheckboxIcon {
+  & {
+    cursor: pointer;
+  }
+  .vxe-checkbox--icon {
+    font-size: 1.22em;
+  }
+  .vxe-checkbox--icon {
+    color: var(--vxe-ui-input-border-color);
+    vertical-align: middle;
+    font-weight: 700;
+    user-select: none;
+  }
+  &.is--checked,
+  &.is--indeterminate {
+    color: var(--vxe-ui-font-primary-color);
+    .vxe-checkbox--icon {
+      color: var(--vxe-ui-font-primary-color);
+    }
+  }
+  &:not(.is--disabled) {
+    &:hover {
+      .vxe-checkbox--icon {
+        color: var(--vxe-ui-font-primary-color);
+      }
+    }
+  }
+  &.is--hidden {
+    cursor: default;
+  }
+  &.is--readonly {
+    cursor: auto;
+  }
+  &.is--disabled {
+    color: var(--vxe-ui-font-disabled-color);
+    cursor: not-allowed;
+    .vxe-checkbox--icon {
+      color: var(--vxe-ui-input-disabled-color);
+    }
+  }
+  .vxe-checkbox--label {
+    padding-left: 0.5em;
+    vertical-align: middle;
+  }
+}
+
+@mixin createRadioIcon {
+  & {
+    cursor: pointer;
+  }
+  .vxe-radio--icon {
+    font-size: 1.26em;
+  }
+  .vxe-radio--icon {
+    color: var(--vxe-ui-input-border-color);
+    border-radius: 50%;
+    vertical-align: middle;
+    font-weight: 700;
+    user-select: none;
+  }
+  &.is--checked {
+    color: var(--vxe-ui-font-primary-color);
+    .vxe-radio--icon {
+      color: var(--vxe-ui-font-primary-color);
+    }
+  }
+  &:not(.is--disabled) {
+    &:hover {
+      .vxe-radio--icon {
+        color: var(--vxe-ui-font-primary-color);
+      }
+    }
+  }
+  &.is--readonly {
+    cursor: auto;
+  }
+  &.is--disabled {
+    color: var(--vxe-ui-font-disabled-color);
+    cursor: not-allowed;
+    .vxe-radio--icon {
+      color: var(--vxe-ui-input-disabled-color);
+    }
+  }
+  .vxe-radio--label {
+    padding-left: 0.5em;
+    vertical-align: middle;
+  }
+}
+
+@mixin createEmptyMask {
+  &::after {
+    content: "";
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    z-index: 1;
+    user-select: none;
+  }
 }

package/styles/helpers/baseVar.scss

@@ -1,4 +1,4 @@
-// 24 栅格布局
-$colSpanList: 4.16667%, 8.33333%, 12.5%, 16.66667%, 20.83333%, 25%, 29.16667%, 33.33333%,
-              37.5%, 41.66667%, 45.83333%, 50%, 54.16667%, 58.33333%, 62.5%, 66.66667%,
+// 24 栅格布局
+$colSpanList: 4.16667%, 8.33333%, 12.5%, 16.66667%, 20.83333%, 25%, 29.16667%, 33.33333%,
+              37.5%, 41.66667%, 45.83333%, 50%, 54.16667%, 58.33333%, 62.5%, 66.66667%,
               70.83333%, 75%, 79.16667%, 83.33333%, 87.5%, 91.66667%, 95.83333%, 100%;

package/styles/helpers/placement.scss

@@ -1,39 +1,39 @@
-@use './baseMixin.scss';
-
-@mixin createPlacementPanel {
-  display: none;
-  position: absolute;
-  left: 0;
-  padding: 4px 0;
-  color: var(--vxe-ui-font-color);
-  text-align: left;
-  &:not(.is--transfer) {
-    min-width: 100%;
-  }
-  &.is--transfer {
-    position: fixed;
-  }
-  &.ani--leave {
-    display: block;
-    opacity: 0;
-    transform: scaleY(0.5);
-    transition: transform .3s cubic-bezier(.23,1,.32,1), opacity .3s cubic-bezier(.23,1,.32,1);
-    transform-origin: center top;
-    backface-visibility: hidden;
-    &[placement="top"] {
-      transform-origin: center bottom;
-    }
-  }
-  &.ani--enter {
-    opacity: 1;
-    transform: scaleY(1);
-    & > div {
-      &::after {
-        display: none;
-      }
-    }
-  }
-  & > div {
-    @include baseMixin.createEmptyMask();
-  }
+@use './baseMixin.scss';
+
+@mixin createPlacementPanel {
+  display: none;
+  position: absolute;
+  left: 0;
+  padding: 4px 0;
+  color: var(--vxe-ui-font-color);
+  text-align: left;
+  &:not(.is--transfer) {
+    min-width: 100%;
+  }
+  &.is--transfer {
+    position: fixed;
+  }
+  &.ani--leave {
+    display: block;
+    opacity: 0;
+    transform: scaleY(0.5);
+    transition: transform .3s cubic-bezier(.23,1,.32,1), opacity .3s cubic-bezier(.23,1,.32,1);
+    transform-origin: center top;
+    backface-visibility: hidden;
+    &[placement="top"] {
+      transform-origin: center bottom;
+    }
+  }
+  &.ani--enter {
+    opacity: 1;
+    transform: scaleY(1);
+    & > div {
+      &::after {
+        display: none;
+      }
+    }
+  }
+  & > div {
+    @include baseMixin.createEmptyMask();
+  }
 }