styles: 云舍样式对齐 (#6030)

* styles: 修复number样式

* styles: yunshe样式对齐

packages/amis-ui/scss/_components.scss

@@ -44,16 +44,16 @@
   --button-default-active-shadow: var(--shadows-shadow-none);
   --button-default-active-bg-color: transparent;
   --button-default-active-font-color: var(--colors-brand-4);
-  --button-default-disabled-top-border-color: var(--colors-neutral-line-8);
+  --button-default-disabled-top-border-color: var(--colors-neutral-line-10);
   --button-default-disabled-top-border-style: var(--borders-style-2);
   --button-default-disabled-top-border-width: var(--borders-width-2);
-  --button-default-disabled-left-border-color: var(--colors-neutral-line-8);
+  --button-default-disabled-left-border-color: var(--colors-neutral-line-10);
   --button-default-disabled-left-border-style: var(--borders-style-2);
   --button-default-disabled-left-border-width: var(--borders-width-2);
-  --button-default-disabled-right-border-color: var(--colors-neutral-line-8);
+  --button-default-disabled-right-border-color: var(--colors-neutral-line-10);
   --button-default-disabled-right-border-style: var(--borders-style-2);
   --button-default-disabled-right-border-width: var(--borders-width-2);
-  --button-default-disabled-bottom-border-color: var(--colors-neutral-line-8);
+  --button-default-disabled-bottom-border-color: var(--colors-neutral-line-10);
   --button-default-disabled-bottom-border-style: var(--borders-style-2);
   --button-default-disabled-bottom-border-width: var(--borders-width-2);
   --button-default-disabled-shadow: var(--shadows-shadow-none);
@@ -104,16 +104,16 @@
   --button-primary-active-shadow: var(--shadows-shadow-none);
   --button-primary-active-bg-color: var(--colors-brand-4);
   --button-primary-active-font-color: var(--colors-neutral-text-11);
-  --button-primary-disabled-top-border-color: var(--colors-neutral-line-8);
+  --button-primary-disabled-top-border-color: var(--colors-neutral-line-10);
   --button-primary-disabled-top-border-style: var(--borders-style-2);
   --button-primary-disabled-top-border-width: var(--borders-width-2);
-  --button-primary-disabled-left-border-color: var(--colors-neutral-line-8);
+  --button-primary-disabled-left-border-color: var(--colors-neutral-line-10);
   --button-primary-disabled-left-border-style: var(--borders-style-2);
   --button-primary-disabled-left-border-width: var(--borders-width-2);
-  --button-primary-disabled-right-border-color: var(--colors-neutral-line-8);
+  --button-primary-disabled-right-border-color: var(--colors-neutral-line-10);
   --button-primary-disabled-right-border-style: var(--borders-style-2);
   --button-primary-disabled-right-border-width: var(--borders-width-2);
-  --button-primary-disabled-bottom-border-color: var(--colors-neutral-line-8);
+  --button-primary-disabled-bottom-border-color: var(--colors-neutral-line-10);
   --button-primary-disabled-bottom-border-style: var(--borders-style-2);
   --button-primary-disabled-bottom-border-width: var(--borders-width-2);
   --button-primary-disabled-shadow: var(--shadows-shadow-none);
@@ -164,16 +164,18 @@
   --button-secondary-active-shadow: var(--shadows-shadow-none);
   --button-secondary-active-bg-color: var(--colors-neutral-fill-4);
   --button-secondary-active-font-color: var(--colors-neutral-text-11);
-  --button-secondary-disabled-top-border-color: var(--colors-neutral-line-8);
+  --button-secondary-disabled-top-border-color: var(--colors-neutral-line-10);
   --button-secondary-disabled-top-border-style: var(--borders-style-2);
   --button-secondary-disabled-top-border-width: var(--borders-width-2);
-  --button-secondary-disabled-left-border-color: var(--colors-neutral-line-8);
+  --button-secondary-disabled-left-border-color: var(--colors-neutral-line-10);
   --button-secondary-disabled-left-border-style: var(--borders-style-2);
   --button-secondary-disabled-left-border-width: var(--borders-width-2);
-  --button-secondary-disabled-right-border-color: var(--colors-neutral-line-8);
+  --button-secondary-disabled-right-border-color: var(--colors-neutral-line-10);
   --button-secondary-disabled-right-border-style: var(--borders-style-2);
   --button-secondary-disabled-right-border-width: var(--borders-width-2);
-  --button-secondary-disabled-bottom-border-color: var(--colors-neutral-line-8);
+  --button-secondary-disabled-bottom-border-color: var(
+    --colors-neutral-line-10
+  );
   --button-secondary-disabled-bottom-border-style: var(--borders-style-2);
   --button-secondary-disabled-bottom-border-width: var(--borders-width-2);
   --button-secondary-disabled-shadow: var(--shadows-shadow-none);
@@ -224,16 +226,16 @@
   --button-enhance-active-shadow: var(--shadows-shadow-none);
   --button-enhance-active-bg-color: transparent;
   --button-enhance-active-font-color: var(--colors-brand-4);
-  --button-enhance-disabled-top-border-color: var(--colors-neutral-line-8);
+  --button-enhance-disabled-top-border-color: var(--colors-neutral-line-10);
   --button-enhance-disabled-top-border-style: var(--borders-style-2);
   --button-enhance-disabled-top-border-width: var(--borders-width-2);
-  --button-enhance-disabled-left-border-color: var(--colors-neutral-line-8);
+  --button-enhance-disabled-left-border-color: var(--colors-neutral-line-10);
   --button-enhance-disabled-left-border-style: var(--borders-style-2);
   --button-enhance-disabled-left-border-width: var(--borders-width-2);
-  --button-enhance-disabled-right-border-color: var(--colors-neutral-line-8);
+  --button-enhance-disabled-right-border-color: var(--colors-neutral-line-10);
   --button-enhance-disabled-right-border-style: var(--borders-style-2);
   --button-enhance-disabled-right-border-width: var(--borders-width-2);
-  --button-enhance-disabled-bottom-border-color: var(--colors-neutral-line-8);
+  --button-enhance-disabled-bottom-border-color: var(--colors-neutral-line-10);
   --button-enhance-disabled-bottom-border-style: var(--borders-style-2);
   --button-enhance-disabled-bottom-border-width: var(--borders-width-2);
   --button-enhance-disabled-shadow: var(--shadows-shadow-none);
@@ -284,16 +286,16 @@
   --button-info-active-shadow: var(--shadows-shadow-none);
   --button-info-active-bg-color: var(--colors-info-4);
   --button-info-active-font-color: var(--colors-neutral-text-11);
-  --button-info-disabled-top-border-color: var(--colors-neutral-line-8);
+  --button-info-disabled-top-border-color: var(--colors-neutral-line-10);
   --button-info-disabled-top-border-style: var(--borders-style-2);
   --button-info-disabled-top-border-width: var(--borders-width-2);
-  --button-info-disabled-left-border-color: var(--colors-neutral-line-8);
+  --button-info-disabled-left-border-color: var(--colors-neutral-line-10);
   --button-info-disabled-left-border-style: var(--borders-style-2);
   --button-info-disabled-left-border-width: var(--borders-width-2);
-  --button-info-disabled-right-border-color: var(--colors-neutral-line-8);
+  --button-info-disabled-right-border-color: var(--colors-neutral-line-10);
   --button-info-disabled-right-border-style: var(--borders-style-2);
   --button-info-disabled-right-border-width: var(--borders-width-2);
-  --button-info-disabled-bottom-border-color: var(--colors-neutral-line-8);
+  --button-info-disabled-bottom-border-color: var(--colors-neutral-line-10);
   --button-info-disabled-bottom-border-style: var(--borders-style-2);
   --button-info-disabled-bottom-border-width: var(--borders-width-2);
   --button-info-disabled-shadow: var(--shadows-shadow-none);
@@ -344,16 +346,16 @@
   --button-success-active-shadow: var(--shadows-shadow-none);
   --button-success-active-bg-color: var(--colors-success-4);
   --button-success-active-font-color: var(--colors-neutral-text-11);
-  --button-success-disabled-top-border-color: var(--colors-neutral-line-8);
+  --button-success-disabled-top-border-color: var(--colors-neutral-line-10);
   --button-success-disabled-top-border-style: var(--borders-style-2);
   --button-success-disabled-top-border-width: var(--borders-width-2);
-  --button-success-disabled-left-border-color: var(--colors-neutral-line-8);
+  --button-success-disabled-left-border-color: var(--colors-neutral-line-10);
   --button-success-disabled-left-border-style: var(--borders-style-2);
   --button-success-disabled-left-border-width: var(--borders-width-2);
-  --button-success-disabled-right-border-color: var(--colors-neutral-line-8);
+  --button-success-disabled-right-border-color: var(--colors-neutral-line-10);
   --button-success-disabled-right-border-style: var(--borders-style-2);
   --button-success-disabled-right-border-width: var(--borders-width-2);
-  --button-success-disabled-bottom-border-color: var(--colors-neutral-line-8);
+  --button-success-disabled-bottom-border-color: var(--colors-neutral-line-10);
   --button-success-disabled-bottom-border-style: var(--borders-style-2);
   --button-success-disabled-bottom-border-width: var(--borders-width-2);
   --button-success-disabled-shadow: var(--shadows-shadow-none);
@@ -404,16 +406,16 @@
   --button-warning-active-shadow: var(--shadows-shadow-none);
   --button-warning-active-bg-color: var(--colors-warning-4);
   --button-warning-active-font-color: var(--colors-neutral-text-11);
-  --button-warning-disabled-top-border-color: var(--colors-neutral-line-8);
+  --button-warning-disabled-top-border-color: var(--colors-neutral-line-10);
   --button-warning-disabled-top-border-style: var(--borders-style-2);
   --button-warning-disabled-top-border-width: var(--borders-width-2);
-  --button-warning-disabled-left-border-color: var(--colors-neutral-line-8);
+  --button-warning-disabled-left-border-color: var(--colors-neutral-line-10);
   --button-warning-disabled-left-border-style: var(--borders-style-2);
   --button-warning-disabled-left-border-width: var(--borders-width-2);
-  --button-warning-disabled-right-border-color: var(--colors-neutral-line-8);
+  --button-warning-disabled-right-border-color: var(--colors-neutral-line-10);
   --button-warning-disabled-right-border-style: var(--borders-style-2);
   --button-warning-disabled-right-border-width: var(--borders-width-2);
-  --button-warning-disabled-bottom-border-color: var(--colors-neutral-line-8);
+  --button-warning-disabled-bottom-border-color: var(--colors-neutral-line-10);
   --button-warning-disabled-bottom-border-style: var(--borders-style-2);
   --button-warning-disabled-bottom-border-width: var(--borders-width-2);
   --button-warning-disabled-shadow: var(--shadows-shadow-none);
@@ -464,16 +466,16 @@
   --button-danger-active-shadow: var(--shadows-shadow-none);
   --button-danger-active-bg-color: var(--colors-error-4);
   --button-danger-active-font-color: var(--colors-neutral-text-11);
-  --button-danger-disabled-top-border-color: var(--colors-neutral-line-8);
+  --button-danger-disabled-top-border-color: var(--colors-neutral-line-10);
   --button-danger-disabled-top-border-style: var(--borders-style-2);
   --button-danger-disabled-top-border-width: var(--borders-width-2);
-  --button-danger-disabled-left-border-color: var(--colors-neutral-line-8);
+  --button-danger-disabled-left-border-color: var(--colors-neutral-line-10);
   --button-danger-disabled-left-border-style: var(--borders-style-2);
   --button-danger-disabled-left-border-width: var(--borders-width-2);
-  --button-danger-disabled-right-border-color: var(--colors-neutral-line-8);
+  --button-danger-disabled-right-border-color: var(--colors-neutral-line-10);
   --button-danger-disabled-right-border-style: var(--borders-style-2);
   --button-danger-disabled-right-border-width: var(--borders-width-2);
-  --button-danger-disabled-bottom-border-color: var(--colors-neutral-line-8);
+  --button-danger-disabled-bottom-border-color: var(--colors-neutral-line-10);
   --button-danger-disabled-bottom-border-style: var(--borders-style-2);
   --button-danger-disabled-bottom-border-width: var(--borders-width-2);
   --button-danger-disabled-shadow: var(--shadows-shadow-none);
@@ -524,16 +526,16 @@
   --button-light-active-shadow: var(--shadows-shadow-none);
   --button-light-active-bg-color: var(--colors-brand-7);
   --button-light-active-font-color: var(--colors-neutral-text-2);
-  --button-light-disabled-top-border-color: var(--colors-neutral-line-8);
+  --button-light-disabled-top-border-color: var(--colors-neutral-line-10);
   --button-light-disabled-top-border-style: var(--borders-style-2);
   --button-light-disabled-top-border-width: var(--borders-width-2);
-  --button-light-disabled-left-border-color: var(--colors-neutral-line-8);
+  --button-light-disabled-left-border-color: var(--colors-neutral-line-10);
   --button-light-disabled-left-border-style: var(--borders-style-2);
   --button-light-disabled-left-border-width: var(--borders-width-2);
-  --button-light-disabled-right-border-color: var(--colors-neutral-line-8);
+  --button-light-disabled-right-border-color: var(--colors-neutral-line-10);
   --button-light-disabled-right-border-style: var(--borders-style-2);
   --button-light-disabled-right-border-width: var(--borders-width-2);
-  --button-light-disabled-bottom-border-color: var(--colors-neutral-line-8);
+  --button-light-disabled-bottom-border-color: var(--colors-neutral-line-10);
   --button-light-disabled-bottom-border-style: var(--borders-style-2);
   --button-light-disabled-bottom-border-width: var(--borders-width-2);
   --button-light-disabled-shadow: var(--shadows-shadow-none);
@@ -584,16 +586,16 @@
   --button-dark-active-shadow: var(--shadows-shadow-none);
   --button-dark-active-bg-color: var(--colors-neutral-fill-5);
   --button-dark-active-font-color: var(--colors-neutral-text-11);
-  --button-dark-disabled-top-border-color: var(--colors-neutral-line-8);
+  --button-dark-disabled-top-border-color: var(--colors-neutral-line-10);
   --button-dark-disabled-top-border-style: var(--borders-style-2);
   --button-dark-disabled-top-border-width: var(--borders-width-2);
-  --button-dark-disabled-left-border-color: var(--colors-neutral-line-8);
+  --button-dark-disabled-left-border-color: var(--colors-neutral-line-10);
   --button-dark-disabled-left-border-style: var(--borders-style-2);
   --button-dark-disabled-left-border-width: var(--borders-width-2);
-  --button-dark-disabled-right-border-color: var(--colors-neutral-line-8);
+  --button-dark-disabled-right-border-color: var(--colors-neutral-line-10);
   --button-dark-disabled-right-border-style: var(--borders-style-2);
   --button-dark-disabled-right-border-width: var(--borders-width-2);
-  --button-dark-disabled-bottom-border-color: var(--colors-neutral-line-8);
+  --button-dark-disabled-bottom-border-color: var(--colors-neutral-line-10);
   --button-dark-disabled-bottom-border-style: var(--borders-style-2);
   --button-dark-disabled-bottom-border-width: var(--borders-width-2);
   --button-dark-disabled-shadow: var(--shadows-shadow-none);
@@ -1122,6 +1124,7 @@
   --inputNumber-base-default-step-bg: var(--colors-neutral-fill-11);
   --inputNumber-base-hover-step-bg: var(--colors-neutral-fill-11);
   --inputNumber-base-active-step-bg: var(--colors-neutral-fill-11);
+  --inputNumber-base-default-unit-width: var(--sizes-base-28);
   --inputNumber-base-default-unit-paddingTop: calc(
     (
         var(--Form-selectOption-height) - var(--Form-input-lineHeight) *

packages/amis-ui/scss/components/form/_number.scss

@@ -288,6 +288,7 @@
   }
 
   .#{$ns}Select {
+    min-width: var(--inputNumber-base-default-unit-width);
     padding: var(--inputNumber-base-default-unit-paddingTop)
       var(--inputNumber-base-default-unit-paddingRight)
       var(--inputNumber-base-default-unit-paddingBottom)
@@ -437,8 +438,8 @@
       content: var(--inputNumber-enhance-leftIcon-default-icon);
     }
     svg {
-      width: var(--inputNumber-enhance-leftIcon-default-height);
+      width: var(--inputNumber-enhance-leftIcon-default-width);
-      height: var(--inputNumber-enhance-leftIcon-default-width);
+      height: var(--inputNumber-enhance-leftIcon-default-height);
       color: var(--inputNumber-enhance-leftIcon-default-color);
       &:hover {
         color: var(--inputNumber-enhance-leftIcon-hover-color);