Move from size scale to numerical scale. For #33

heybokeh · Oct 15, 2021 · 97c9d5b · 97c9d5b
1 parent e7da246
commit 97c9d5b
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 19 deletions.
diff --git a/src/core/layout.css b/src/core/layout.css
@@ -48,15 +48,16 @@
    * Widths
    * Applied as max-width
    */
-  --width-xs: 320px;
-  --width-sm: 384px;
-  --width-md: 448px;
-  --width-lg: 512px;
-  --width-xl: 576px;
-  --width-2xl: 672px;
-  --width-3xl: 768px;
-  --width-4xl: 896px;
-  --width-5xl: 1024px;
-  --width-6xl: 1152px;
-  --width-7xl: 1280px;
+  --width-1: 320px;
+  --width-2: 384px;
+  --width-3: 448px;
+  --width-4: 512px;
+  --width-5: 576px;
+  --width-6: 672px;
+  --width-7: 768px;
+  --width-8: 896px;
+  --width-9: 1024px;
+  --width-10: 1152px;
+  --width-11: 1280px;
+  --width-12: 1440px;
 }
diff --git a/src/core/ui.css b/src/core/ui.css
@@ -30,20 +30,21 @@
    * Radiuses
    * Applied as border-radius
    */
-  --radius-none: 0px;
-  --radius-sm: 2px;
-  --radius: 4px;
-  --radius-md: 6px;
-  --radius-lg: 8px;
-  --radius-xl: 12px;
-  --radius-2xl: 16px;
-  --radius-3xl: 24px;
+  --radius-0: 0px;
+  --radius-1: 2px;
+  --radius-2: 4px;
+  --radius-3: 6px;
+  --radius-4: 8px;
+  --radius-5: 12px;
+  --radius-6: 16px;
   --radius-full: 9999px;
 
   /**
    * Layers
    * Applied as z-index
    */
+  --layer-below: -1;
+  --layer-0: 0;
   --layer-1: 10;
   --layer-2: 20;
   --layer-3: 30;