@neatui/css 3.17.0 → 4.0.1

package/core/trim.scss

@@ -1,5 +1,87 @@
 @use "./media.scss" as *;
 
+$dimension-base: (
+  xs: 0.5,
+  ss: 1,
+  sm: 1.5,
+  sl: 2,
+  ms: 2.5,
+  mm: 3,
+  ml: 3.5,
+  ls: 4,
+  lm: 4.5,
+  ll: 5,
+  xl: 5.5,
+);
+
+$dimension-s: (
+  xs: 6,
+  ss: 7,
+  sm: 8,
+  sl: 9,
+  ms: 10,
+  mm: 11,
+  ml: 12,
+  ls: 13,
+  lm: 14,
+  ll: 15,
+  xl: 16,
+);
+
+$dimension-m: (
+  xs: 18,
+  ss: 20,
+  sm: 22,
+  sl: 24,
+  ms: 26,
+  mm: 28,
+  ml: 30,
+  ls: 32,
+  lm: 34,
+  ll: 36,
+  xl: 38,
+);
+
+$dimension-l: (
+  xs: 42,
+  ss: 46,
+  sm: 50,
+  sl: 54,
+  ms: 58,
+  mm: 62,
+  ml: 66,
+  ls: 70,
+  lm: 74,
+  ll: 78,
+  xl: 82,
+);
+
+@mixin dimension-scale($media, $prefix, $property) {
+  .#{$media}#{$prefix}-no {
+    #{$property}: 0;
+  }
+  @each $sz, $value in $dimension-base {
+    .#{$media}#{$prefix}-#{$sz} {
+      #{$property}: #{$value}em;
+    }
+  }
+  @each $sz, $value in $dimension-s {
+    .#{$media}#{$prefix}-#{$sz}\*s {
+      #{$property}: #{$value}em;
+    }
+  }
+  @each $sz, $value in $dimension-m {
+    .#{$media}#{$prefix}-#{$sz}\*m {
+      #{$property}: #{$value}em;
+    }
+  }
+  @each $sz, $value in $dimension-l {
+    .#{$media}#{$prefix}-#{$sz}\*l {
+      #{$property}: #{$value}em;
+    }
+  }
+}
+
 @mixin trim($media: "") {
   $size: (no, xs, ss, sm, sl, ms, mm, ml, ls, lm, ll, xl);
 
@@ -369,106 +451,14 @@
   }
 
   // 宽度
-  $w_base: 0;
-  @each $sz in $size {
-    .#{$media}w-#{$sz} {
-      width: #{$w_base}em;
-      &\+ {
-        width: #{$w_base + 1}em;
-      }
-      &\*s {
-        width: #{$w_base * 2}em;
-      }
-      &\*m {
-        width: #{$w_base * 3}em;
-      }
-      &\*l {
-        width: #{$w_base * 4}em;
-      }
-    }
-    .#{$media}min-w-#{$sz} {
-      min-width: #{$w_base}em;
-      &\+ {
-        min-width: #{$w_base + 1}em;
-      }
-      &\*s {
-        min-width: #{$w_base * 2}em;
-      }
-      &\*m {
-        min-width: #{$w_base * 3}em;
-      }
-      &\*l {
-        min-width: #{$w_base * 4}em;
-      }
-    }
-    .#{$media}max-w-#{$sz} {
-      max-width: #{$w_base}em;
-      &\+ {
-        max-width: #{$w_base + 1}em;
-      }
-      &\*s {
-        max-width: #{$w_base * 2}em;
-      }
-      &\*m {
-        max-width: #{$w_base * 3}em;
-      }
-      &\*l {
-        max-width: #{$w_base * 4}em;
-      }
-    }
-    $w_base: $w_base + 2;
-  }
+  @include dimension-scale($media, "w", width);
+  @include dimension-scale($media, "min-w", min-width);
+  @include dimension-scale($media, "max-w", max-width);
 
   // 高度
-  $h_base: 0;
-  @each $sz in $size {
-    .#{$media}h-#{$sz} {
-      height: #{$h_base}em;
-      &\+ {
-        height: #{$h_base + 1}em;
-      }
-      &\*s {
-        height: #{$h_base * 2}em;
-      }
-      &\*m {
-        height: #{$h_base * 3}em;
-      }
-      &\*l {
-        height: #{$h_base * 4}em;
-      }
-    }
-    .#{$media}min-h-#{$sz} {
-      min-height: #{$h_base}em;
-      &\+ {
-        min-height: #{$h_base + 1}em;
-      }
-      &\*s {
-        min-height: #{$h_base * 2}em;
-      }
-      &\*m {
-        min-height: #{$h_base * 3}em;
-      }
-      &\*l {
-        min-height: #{$h_base * 4}em;
-      }
-    }
-    .#{$media}max-h-#{$sz} {
-      max-height: #{$h_base}em;
-      &\+ {
-        max-height: #{$h_base + 1}em;
-      }
-      &\*s {
-        max-height: #{$h_base * 2}em;
-      }
-      &\*m {
-        max-height: #{$h_base * 3}em;
-      }
-      &\*l {
-        max-height: #{$h_base * 4}em;
-      }
-    }
-    $h_base: $h_base + 2;
-  }
+  @include dimension-scale($media, "h", height);
+  @include dimension-scale($media, "min-h", min-height);
+  @include dimension-scale($media, "max-h", max-height);
 
   // 缩小
   .#{$media}s-no {

package/index.scss

@@ -0,0 +1 @@
+@forward './neatui.scss';

package/package.json

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