@neatui/css 3.0.13 → 3.2.0

package/components/btns/base.scss

@@ -2,6 +2,7 @@
 @use './../../core/media.scss' as *;
 
 $size: 'xs', 's', 'm', 'l', 'xl';
+$type: none, main, vice, text, link, read, note, case, line, weak, back, info, well, warn, risk, w, b;
 
 [ui-btn] {
   & {
@@ -15,7 +16,6 @@ $size: 'xs', 's', 'm', 'l', 'xl';
 
     height: 2.5em;
     padding: 0 1em;
-    border-radius: 0.25em;
     cursor: pointer;
     transition: all 50ms;
     text-align: center;
@@ -24,7 +24,6 @@ $size: 'xs', 's', 'm', 'l', 'xl';
     user-select: none;
     white-space: nowrap;
     color: inherit;
-    border: 1px solid currentColor;
     background: var(--co-weak);
   }
   &.disabled {
@@ -117,6 +116,7 @@ $size: 'xs', 's', 'm', 'l', 'xl';
   & > * {
     &:active {
       filter: brightness(0.85);
+      z-index: 1;
     }
     &[ui-btn~='am:s']:active {
       transform: scale(0.98, 0.95);

package/components/btns/btns@a.scss

@@ -1,11 +1,9 @@
 @use 'sass:math';
-@forward './base.scss';
+@use './base.scss' as *;
 @use './../../core/media.scss' as *;
-$size: xs, s, m, l, xl;
-$type: none, main, vice, text, link, read, note, case, line, weak, back, info, well, warn, risk, w, b;
 
 // 基础
-%btnBase {
+%btnBaseA {
   & {
     position: relative;
     display: inline-flex;
@@ -24,7 +22,7 @@ $type: none, main, vice, text, link, read, note, case, line, weak, back, info, w
     user-select: none;
     white-space: nowrap;
     color: inherit;
-    box-shadow: inset 0 0 0 1px currentColor;
+    border: 1px solid var(--co-line);
     background: var(--co-weak);
   }
 
@@ -41,7 +39,7 @@ $type: none, main, vice, text, link, read, note, case, line, weak, back, info, w
 // 按钮
 body [ui-btn~='@a'] {
   // 基础样式
-  @extend %btnBase;
+  @extend %btnBaseA;
 
   // 绝对尺寸
   &[ui-btn~=':abs'] {
@@ -58,16 +56,9 @@ body [ui-btn~='@a'] {
   // 移入状态
   &:hover,
   &.active {
-    box-shadow:
-      inset 0 0 0 1px var(--co-line),
-      inset 0 0 0 100em var(--co-text-xs);
+    border: 1px solid var(--co-line);
   }
 
-  // 按下状态
-  // &:active {
-  //   transform: scale(0.98);
-  // }
-
   // 正方形按钮
   &[ui-btn~=':square'] {
     width: 2.5em;
@@ -85,9 +76,8 @@ body [ui-btn~='@a'] {
     &,
     &:hover {
       opacity: 0.65;
-      box-shadow:
-        inset 0 0 0 1px transparent,
-        inset 0 0 0 100em rgba(0, 0, 0, 0);
+      border: 1px solid transparent;
+      box-shadow: inset 0 0 0 100em rgba(0, 0, 0, 0);
       cursor: not-allowed;
     }
     &:active {
@@ -150,7 +140,6 @@ body [ui-btn~='@a'] {
 
         &[ui-btn~=':abs'] {
           height: #{$base}rem;
-          // line-height: #{$base}rem;
           padding: 0 #{calc(($base - 0.5) / 2)}rem;
         }
       }
@@ -162,25 +151,19 @@ body [ui-btn~='@a'] {
   // 按钮颜色
   @each $name in $type {
     &[ui-btn~='#{$name}'] {
-      @if ($name == 'none' or $name == 'var(--co-weak)' or $name == 'back') {
-        // @include theme {
+      @if ($name == 'none' or $name == 'weak' or $name == 'back') {
         background: var(--co-#{$name});
-        // }
         color: inherit;
       } @else {
-        // @include theme {
         // 背景色
         background: var(--co-#{$name});
         color: var(--co-fore);
-        // }
       }
-      box-shadow: inset 0 0 0 1px transparent;
+      border: 1px solid transparent;
 
       &:hover,
       &.active {
-        box-shadow:
-          inset 0 0 0 1px transparent,
-          inset 0 0 0 100em var(--co-text-xs);
+        box-shadow: inset 0 0 0 100em var(--co-text-xs);
       }
 
       // 边框式
@@ -191,13 +174,12 @@ body [ui-btn~='@a'] {
         } @else {
           color: var(--co-#{$name});
         }
-        box-shadow: inset 0 0 0 1px var(--co-#{$name});
+        border: 1px solid var(--co-#{$name});
 
         &:hover,
         &.active {
-          box-shadow:
-            inset 0 0 0 1px var(--co-#{$name}),
-            inset 0 0 0 100em var(--co-#{$name}-xs);
+          border: 1px solid var(--co-#{$name});
+          box-shadow: inset 0 0 0 100em var(--co-#{$name}-xs);
         }
       }
 
@@ -205,10 +187,10 @@ body [ui-btn~='@a'] {
       &[ui-btn~=':underline'] {
         color: var(--co-#{$name});
         background: transparent;
-        box-shadow: inset 0 0 0 1px transparent;
+        border: 1px solid transparent;
 
         &:hover {
-          box-shadow: inset 0 0 0 1px transparent;
+          border: 1px solid transparent;
           text-decoration: underline;
         }
       }
@@ -252,7 +234,7 @@ body [ui-btn~='@a'] {
 
   // 基础样式
   & > * {
-    @extend %btnBase;
+    @extend %btnBaseA;
   }
 
   &[ui-btns~=':flex'] > * {
@@ -275,16 +257,10 @@ body [ui-btn~='@a'] {
   // 移入状态
   & > *:hover,
   & > *.active {
-    box-shadow:
-      inset 0 0 0 1px var(--co-line),
-      inset 0 0 0 100em var(--co-text-xs);
+    border: 1px solid var(--co-line);
+    box-shadow: inset 0 0 0 100em var(--co-text-xs);
   }
 
-  // 按下状态
-  // & > *:active {
-  //   transform: scale(0.98, 0.95);
-  // }
-
   // 正方形按钮
   &[ui-btns~=':square'] > * {
     width: 2.5em;
@@ -302,9 +278,8 @@ body [ui-btn~='@a'] {
     &:hover,
     &.active {
       opacity: 0.65;
-      box-shadow:
-        inset 0 0 0 1px transparent,
-        inset 0 0 0 100em rgba(0, 0, 0, 0);
+      border: 1px solid transparent;
+      box-shadow: inset 0 0 0 100em rgba(0, 0, 0, 0);
       cursor: not-allowed;
     }
     &:active {
@@ -388,14 +363,11 @@ body [ui-btn~='@a'] {
           background: var(--co-#{$name});
           color: var(--co-fore);
         }
-
-        box-shadow: inset 0 0 0 1px transparent;
+        border: 1px solid transparent;
 
         &:hover,
         &.active {
-          box-shadow:
-            inset 0 0 0 1px transparent,
-            inset 0 0 0 100em var(--co-text-xs);
+          box-shadow: inset 0 0 0 100em var(--co-text-xs);
         }
       }
 
@@ -407,13 +379,11 @@ body [ui-btn~='@a'] {
         } @else {
           color: var(--co-#{$name});
         }
-        box-shadow: inset 0 0 0 1px var(--co-#{$name});
+        border: 1px solid var(--co-#{$name});
 
         &:hover,
         &.active {
-          box-shadow:
-            inset 0 0 0 1px var(--co-#{$name}),
-            inset 0 0 0 100em var(--co-#{$name}-xs);
+          box-shadow: inset 0 0 0 100em var(--co-#{$name}-xs);
         }
       }
 
@@ -421,11 +391,11 @@ body [ui-btn~='@a'] {
       &[ui-btns~=':underline'] > * {
         color: var(--co-#{$name});
         background: transparent;
-        box-shadow: inset 0 0 0 1px transparent;
+        border: 1px solid transparent;
 
         &:hover,
         &.active {
-          box-shadow: inset 0 0 0 1px transparent;
+          border: 1px solid transparent;
           text-decoration: underline;
         }
       }

package/components/btns/btns@b.scss

@@ -0,0 +1,393 @@
+@use 'sass:math';
+@use './base.scss' as *;
+@use './../../core/media.scss' as *;
+
+// 基础
+%btnBaseB {
+  & {
+    position: relative;
+    display: inline-flex;
+    flex-direction: row;
+    justify-content: center;
+    align-items: center;
+    align-content: center;
+    height: 2.5em;
+    padding: 0 1em;
+    cursor: pointer;
+    transition: all 50ms;
+    text-align: center;
+    vertical-align: middle;
+    border: 0;
+    user-select: none;
+    white-space: nowrap;
+    color: inherit;
+    border: 1px solid var(--co-line);
+    background: var(--co-weak);
+  }
+
+  & > * {
+    &.icon {
+      display: inline-block;
+      & + * {
+        margin-left: 0.2em;
+      }
+    }
+  }
+}
+
+// 按钮
+body [ui-btn~='@b'] {
+  // 基础样式
+  @extend %btnBaseB;
+
+  // 绝对尺寸
+  &[ui-btn~=':abs'] {
+    height: 2.5rem;
+    line-height: 2.5rem;
+    padding: 0 1rem;
+  }
+  // 圆弧按钮
+  &[ui-btn~=':round'] {
+    border-radius: 100em;
+  }
+
+  // 移入状态
+  &:hover,
+  &.active {
+    border: 1px solid var(--co-line);
+  }
+
+  // 正方形按钮
+  &[ui-btn~=':square'] {
+    width: 2.5em;
+    padding: 0;
+  }
+
+  // 块状按钮
+  &[ui-btn~=':block'] {
+    width: 100%;
+  }
+
+  // 禁用按钮
+  &[ui-btn~=':disabled'] {
+    pointer-events: none;
+    &,
+    &:hover {
+      opacity: 0.65;
+      border: 1px solid transparent;
+      box-shadow: inset 0 0 0 100em rgba(0, 0, 0, 0);
+      cursor: not-allowed;
+    }
+    &:active {
+      transform: scale(1, 1);
+      cursor: not-allowed;
+    }
+  }
+
+  // 按钮尺寸
+  $base: 1.5;
+  @each $i in $size {
+    &[ui-btn~='#{$i}'] {
+      height: #{$base}em;
+      // line-height: #{$base}em;
+      padding: 0 #{calc(($base - 0.5) / 2)}em;
+
+      // 方形按钮
+      &[ui-btn~=':square'] {
+        width: #{$base}em;
+        padding: 0;
+      }
+
+      &[ui-btn~=':abs'] {
+        height: #{$base}rem;
+        // line-height: #{$base}rem;
+        padding: 0 #{calc(($base - 0.5) / 2)}rem;
+      }
+    }
+
+    @include med('=mob') {
+      &[ui-btn~='mob-#{$i}'] {
+        height: #{$base}em;
+        // line-height: #{$base}em;
+        padding: 0 #{calc(($base - 0.5) / 2)}em;
+
+        // 方形按钮
+        &[ui-btn~=':square'] {
+          width: #{$base}em;
+          padding: 0;
+        }
+
+        &[ui-btn~=':abs'] {
+          height: #{$base}rem;
+          // line-height: #{$base}rem;
+          padding: 0 #{calc(($base - 0.5) / 2)}rem;
+        }
+      }
+    }
+    @include med('=pad') {
+      &[ui-btn~='pad-#{$i}'] {
+        height: #{$base}em;
+        // line-height: #{$base}em;
+        padding: 0 #{calc(($base - 0.5) / 2)}em;
+
+        // 方形按钮
+        &[ui-btn~=':square'] {
+          width: #{$base}em;
+          padding: 0;
+        }
+
+        &[ui-btn~=':abs'] {
+          height: #{$base}rem;
+          padding: 0 #{calc(($base - 0.5) / 2)}rem;
+        }
+      }
+    }
+
+    $base: $base + 0.5;
+  }
+
+  // 按钮颜色
+  @each $name in $type {
+    &[ui-btn~='#{$name}'] {
+      @if ($name == 'none' or $name == 'weak' or $name == 'back') {
+        background: var(--co-#{$name});
+        color: inherit;
+      } @else {
+        // 背景色
+        background: var(--co-#{$name});
+        color: var(--co-fore);
+      }
+      border: 1px solid transparent;
+
+      &:hover,
+      &.active {
+        box-shadow: inset 0 0 0 100em var(--co-text-xs);
+      }
+
+      // 边框式
+      &[ui-btn~=':border'] {
+        background: transparent;
+        @if ($name == 'line' or $name == 'case') {
+          color: var(--co-read);
+        } @else {
+          color: var(--co-#{$name});
+        }
+        border: 1px solid var(--co-#{$name});
+
+        &:hover,
+        &.active {
+          border: 1px solid var(--co-#{$name});
+          box-shadow: inset 0 0 0 100em var(--co-#{$name}-xs);
+        }
+      }
+
+      // 下划线
+      &[ui-btn~=':underline'] {
+        color: var(--co-#{$name});
+        background: transparent;
+        border: 1px solid transparent;
+
+        &:hover {
+          border: 1px solid transparent;
+          text-decoration: underline;
+        }
+      }
+    }
+  }
+}
+
+// 群组
+[ui-btns~='@b'] {
+  // 群组模式
+  &[ui-btns~=':group'] {
+    & > * {
+      border-radius: 0;
+      margin-right: -1px;
+    }
+    // 圆弧倒角
+    &[ui-btns~=':round'] > * {
+      border-radius: 0;
+
+      // 普通倒角
+      &:first-child {
+        border-radius: 100em 0 0 100em;
+      }
+      &:last-child {
+        border-radius: 0 100em 100em 0;
+      }
+    }
+
+    & {
+      display: inline-flex;
+    }
+  }
+
+  // 基础样式
+  & > * {
+    @extend %btnBaseB;
+  }
+
+  &[ui-btns~=':flex'] > * {
+    display: inline-flex;
+    justify-content: center;
+    align-items: center;
+  }
+
+  // 绝对尺寸
+  &[ui-btns~=':abs'] > * {
+    height: 2.5rem;
+    padding: 0 1rem;
+  }
+  // 圆弧按钮
+  &[ui-btns~=':round'] > * {
+    border-radius: 100em;
+  }
+
+  // 移入状态
+  & > *:hover,
+  & > *.active {
+    border: 1px solid var(--co-line);
+    box-shadow: inset 0 0 0 100em var(--co-text-xs);
+  }
+
+  // 正方形按钮
+  &[ui-btns~=':square'] > * {
+    width: 2.5em;
+    padding: 0;
+  }
+
+  // 块状按钮
+  &[ui-btns~=':block'] > * {
+    width: 100%;
+  }
+
+  // 禁用按钮
+  &[ui-btns~=':disabled'] > * {
+    &,
+    &:hover,
+    &.active {
+      opacity: 0.65;
+      border: 1px solid transparent;
+      box-shadow: inset 0 0 0 100em rgba(0, 0, 0, 0);
+      cursor: not-allowed;
+    }
+    &:active {
+      transform: scale(1, 1);
+      cursor: not-allowed;
+    }
+  }
+
+  // 按钮尺寸
+  $base: 1.5;
+  @each $i in $size {
+    &[ui-btns~='#{$i}'] {
+      & > * {
+        height: #{$base}em;
+        padding: 0 #{calc(($base - 0.5) / 2)}em;
+      }
+
+      // 方形按钮
+      &[ui-btns~=':square'] > * {
+        width: #{$base}em;
+        padding: 0;
+      }
+
+      &[ui-btns~=':abs'] > * {
+        height: #{$base}rem;
+        padding: 0 #{calc(($base - 0.5) / 2)}rem;
+      }
+    }
+
+    @include med('=mob') {
+      &[ui-btns~='mob-#{$i}'] {
+        & > * {
+          height: #{$base}em;
+          padding: 0 #{calc(($base - 0.5) / 2)}em;
+        }
+
+        // 方形按钮
+        &[ui-btns~=':square'] > * {
+          width: #{$base}em;
+          padding: 0;
+        }
+
+        &[ui-btns~=':abs'] > * {
+          height: #{$base}rem;
+          padding: 0 #{calc(($base - 0.5) / 2)}rem;
+        }
+      }
+    }
+    @include med('=pad') {
+      &[ui-btns~='pad-#{$i}'] {
+        & > * {
+          height: #{$base}em;
+          padding: 0 #{calc(($base - 0.5) / 2)}em;
+        }
+
+        // 方形按钮
+        &[ui-btns~=':square'] > * {
+          width: #{$base}em;
+          padding: 0;
+        }
+
+        &[ui-btns~=':abs'] > * {
+          height: #{$base}rem;
+          padding: 0 #{calc(($base - 0.5) / 2)}rem;
+        }
+      }
+    }
+
+    $base: $base + 0.5;
+  }
+
+  // 按钮颜色
+  @each $name in $type {
+    &[ui-btns~='#{$name}'] {
+      & > * {
+        @if ($name == 'none' or $name == 'weak' or $name == 'back') {
+          background: var(--co-#{$name});
+          color: inherit;
+        } @else {
+          // 背景色
+          background: var(--co-#{$name});
+          color: var(--co-fore);
+        }
+        border: 1px solid transparent;
+
+        &:hover,
+        &.active {
+          box-shadow: inset 0 0 0 100em var(--co-text-xs);
+        }
+      }
+
+      // 边框式
+      &[ui-btns~=':border'] > * {
+        background: transparent;
+        @if ($name == 'line') {
+          color: var(--co-read);
+        } @else {
+          color: var(--co-#{$name});
+        }
+        border: 1px solid var(--co-#{$name});
+
+        &:hover,
+        &.active {
+          box-shadow: inset 0 0 0 100em var(--co-#{$name}-xs);
+        }
+      }
+
+      // 下划线
+      &[ui-btns~=':underline'] > * {
+        color: var(--co-#{$name});
+        background: transparent;
+        border: 1px solid transparent;
+
+        &:hover,
+        &.active {
+          border: 1px solid transparent;
+          text-decoration: underline;
+        }
+      }
+    }
+  }
+}

package/components/btns/index.scss

@@ -1 +1,2 @@
 @forward './btns@a.scss';
+@forward './btns@b.scss';

package/components/form/form@a/checkbox.scss

@@ -41,14 +41,14 @@ value	       规定输入字段的默认值。
       margin: 0;
       padding: 0;
       background: transparent;
-      box-shadow: inset 0 0 0 1px currentColor;
+      border: 1px solid currentColor;
       border-radius: 0.2em;
       flex-shrink: 0;
       transform: scale3d(0.95, 0.95, 1);
 
       // &.part-selected {
       //   @include theme {
-      //     box-shadow: inset 0 0 0 1px var(--co-main);
+      //     border: 1px solid var(--co-main);
       //   }
       //   &::before {
       //     width: 50%;
@@ -132,7 +132,7 @@ value	       规定输入字段的默认值。
       &.part-checked,
       &[part-checked] {
         background-color: var(--co-main);
-        box-shadow: inset 0 0 0 1px var(--co-main);
+        border: 1px solid var(--co-main);
 
         &::before {
           width: 50%;

package/components/form/form@a/switch.scss

@@ -46,7 +46,7 @@ value	       规定输入字段的默认值。
       margin: 0;
       padding: 0;
       background: transparent;
-      box-shadow: inset 0 0 0 1px currentColor;
+      border: 1px solid currentColor;
       border-radius: 10em;
       flex-shrink: 0;
       position: relative;

package/components/form/form@a/textarea.scss

@@ -24,13 +24,13 @@ value	       规定输入字段的默认值。
     transition: all 0.5s;
 
     // @include theme {
-    box-shadow: inset 0 0 0 1px var(--co-case);
+    border: 1px solid var(--co-case);
     background-color: var(--co-fore);
     // }
 
     &:hover {
       // @include theme {
-      box-shadow: inset 0 0 0 1px var(--co-main-mm);
+      border: 1px solid var(--co-main-mm);
       // }
     }
 

package/components/form/form@b/checkbox.scss

@@ -53,7 +53,7 @@ value	       规定输入字段的默认值。
       margin: 0;
       padding: 0;
       background: transparent;
-      box-shadow: inset 0 0 0 1px currentColor;
+      border: 1px solid currentColor;
       border-radius: 0.2em;
       flex-shrink: 0;
 

package/components/form/form@b/radio.scss

@@ -56,7 +56,7 @@ value	       规定输入字段的默认值。
       margin: 0;
       padding: 0;
       background: transparent;
-      box-shadow: inset 0 0 0 1px currentColor;
+      border: 1px solid currentColor;
       border-radius: 50%;
       flex-shrink: 0;
 
@@ -71,7 +71,7 @@ value	       规定输入字段的默认值。
           radial-gradient(circle at 66.8% 37%, currentColor 5%, transparent 6%), radial-gradient(circle at 70% 32.5%, currentColor 4.5%, transparent 5.5%),
           radial-gradient(circle at 73.8% 28%, currentColor 3.9%, transparent 4.9%), radial-gradient(circle at 77.5% 23.7%, currentColor 3.4%, transparent 4.4%),
           radial-gradient(circle at 81% 19.5%, currentColor 3%, transparent 4%), radial-gradient(circle at 85% 15.2%, currentColor 2.5%, transparent 3.5%);
-        box-shadow: inset 0 0 0 1px currentColor;
+        border: 1px solid currentColor;
         animation: am-b-radio 0.3s;
         &,
         & + * {

package/components/form/form@b/switch.scss

@@ -46,7 +46,7 @@ value	       规定输入字段的默认值。
       margin: 0;
       padding: 0;
       background: transparent;
-      box-shadow: inset 0 0 0 1px currentColor;
+      border: 1px solid currentColor;
       border-radius: 10em;
       flex-shrink: 0;
       position: relative;

package/components/form/form@b/textarea.scss

@@ -23,11 +23,11 @@ value	       规定输入字段的默认值。
     border-radius: 0.25em;
     transition: all 0.5s;
 
-    box-shadow: inset 0 0 0 1px var(--co-case);
+    border: 1px solid var(--co-case);
     background-color: var(--co-fore);
 
     &:hover {
-      box-shadow: inset 0 0 0 1px var(--co-main-mm);
+      border: 1px solid var(--co-main-mm);
     }
 
     &.form-focus,

package/components/form/form@c/checkbox.scss

@@ -55,7 +55,7 @@ value	       规定输入字段的默认值。
       margin: 0;
       padding: 0;
       background: transparent;
-      box-shadow: inset 0 0 0 1px currentColor;
+      border: 1px solid currentColor;
       border-radius: 25%;
       transform: scale3d(0.9, 0.9, 1);
       flex-shrink: 0;

package/components/form/form@c/input.scss

@@ -25,7 +25,7 @@ value	       规定输入字段的默认值。
     border-radius: 0.25em;
     transition: all 0.5s;
 
-    // box-shadow: inset 0 0 0 1px var(--co-case);
+    // border: 1px solid var(--co-case);
     background-color: var(--bg-weak);
 
     display: inline-flex;
@@ -37,7 +37,7 @@ value	       规定输入字段的默认值。
     }
 
     &:hover {
-      box-shadow: inset 0 0 0 1px var(--co-main-mm);
+      border: 1px solid var(--co-main-mm);
     }
 
     &.form-focus,

package/components/form/form@c/radio.scss

@@ -56,7 +56,7 @@ value	       规定输入字段的默认值。
       margin: 0;
       padding: 0;
       background: transparent;
-      box-shadow: inset 0 0 0 1px currentColor;
+      border: 1px solid currentColor;
       border-radius: 50%;
       flex-shrink: 0;
 
@@ -64,7 +64,7 @@ value	       规定输入字段的默认值。
 
       &:checked {
         background-image: radial-gradient(circle at 50% 50%, currentColor 38%, transparent 40%);
-        box-shadow: inset 0 0 0 1px currentColor;
+        border: 1px solid currentColor;
         animation: am-radio 0.3s;
         &,
         & + * {

package/components/form/form@c/switch.scss

@@ -46,7 +46,7 @@ value	       规定输入字段的默认值。
       margin: 0;
       padding: 0;
       background: transparent;
-      box-shadow: inset 0 0 0 1px currentColor;
+      border: 1px solid currentColor;
       border-radius: 10em;
       flex-shrink: 0;
       position: relative;

package/components/form/form@c/textarea.scss

@@ -24,11 +24,11 @@ value	       规定输入字段的默认值。
     transition: all 0.5s;
     background-color: transparent;
 
-    box-shadow: inset 0 0 0 1px var(--co-case);
+    border: 1px solid var(--co-case);
     background-color: var(--bg-weak);
 
     &:hover {
-      box-shadow: inset 0 0 0 1px var(--co-main-mm);
+      border: 1px solid var(--co-main-mm);
     }
 
     &.form-focus,

package/components/form/form@d/checkbox.scss

@@ -42,7 +42,7 @@ value	       规定输入字段的默认值。
       margin: 0;
       padding: 0;
       background: transparent;
-      // box-shadow: inset 0 0 0 1px currentColor;
+      // border: 1px solid currentColor;
       border-radius: 0.2em;
       flex-shrink: 0;
       transform: scale3d(0.95, 0.95, 1);
@@ -116,7 +116,7 @@ value	       规定输入字段的默认值。
       // 半选
       &.part-checked,
       &[part-checked] {
-        box-shadow: inset 0 0 0 1px var(--co-main);
+        border: 1px solid var(--co-main);
 
         &::before {
           width: 50%;

package/components/form/form@d/switch.scss

@@ -46,7 +46,7 @@ value	       规定输入字段的默认值。
       margin: 0;
       padding: 0;
       background: transparent;
-      box-shadow: inset 0 0 0 1px currentColor;
+      border: 1px solid currentColor;
       border-radius: 10em;
       flex-shrink: 0;
       position: relative;

package/components/form/form@d/textarea.scss

@@ -24,13 +24,13 @@ value	       规定输入字段的默认值。
     transition: all 0.5s;
 
     // @include theme {
-    box-shadow: inset 0 0 0 1px var(--co-case);
+    border: 1px solid var(--co-case);
     background-color: var(--co-fore);
     // }
 
     &:hover {
       // @include theme {
-      box-shadow: inset 0 0 0 1px var(--co-main-mm);
+      border: 1px solid var(--co-main-mm);
       // }
     }
 

package/core/ux.scss

@@ -49,8 +49,6 @@
     cursor: pointer;
     text-decoration: underline;
   }
-  &:hover {
-  }
 }
 
 // 点击缩小

package/core/vars.scss

@@ -1,3 +1 @@
-// $co: 'none', 'main', 'text', 'read', 'note', 'line', 'case', 'weak', 'fore', 'back', 'info', 'well', 'warn', 'risk';
-// $sz: 'xs', 's', 'm', 'l', 'xl';
 $sz: no, xs, ss, sm, ms, mm, ml, ls, lm, ll, xl;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@neatui/css",
-  "version": "3.0.13",
+  "version": "3.2.0",
   "description": "neatui",
   "main": "./neatui.scss",
   "license": "MIT",