@medyll/cssfabric 0.2.0 → 0.2.1-beta.2

package/{styles → dist/css}/text/text.responsive.css

@@ -1,194 +1,215 @@
-@media only screen and (max-width: 1300px) {
-  .text-xxl-ellipsis {
+
+/**---------------------text.responsive.css---------------------*/
+@media only screen and (min-width: 640px) {
+  .text-sm-ellipsis {
     text-overflow: ellipsis;
     overflow: hidden;
     white-space: nowrap;
   }
-
   .h1,
-h1 {
+  h1 {
     font-size: var(--font-size-h1);
     line-height: 1.2;
     font-weight: 400;
   }
-
   .h2,
-h2 {
+  h2 {
     font-size: var(--font-size-h2);
     line-height: 1.2;
     font-weight: 400;
   }
-
   .h3,
-h3 {
+  h3 {
     font-size: var(--font-size-h3);
     line-height: 1.2;
     font-weight: 400;
   }
-
   .h4,
-h4 {
+  h4 {
     font-size: var(--font-size-h4);
     line-height: 1.2;
     font-weight: 400;
   }
-
   .h5,
-h5 {
+  h5 {
     font-size: var(--font-size-h5);
     line-height: 1.2;
     font-weight: 400;
   }
-
   .h6,
-h6 {
+  h6 {
     font-size: var(--font-size-h6);
     line-height: 1.2;
     font-weight: 400;
   }
 }
-@media only screen and (max-width: 1200px) {
-  .text-xl-ellipsis {
+@media only screen and (min-width: 768px) {
+  .text-md-ellipsis {
     text-overflow: ellipsis;
     overflow: hidden;
     white-space: nowrap;
   }
-
   .h1,
-h1 {
+  h1 {
     font-size: var(--font-size-h1);
     line-height: 1.2;
     font-weight: 400;
   }
-
   .h2,
-h2 {
+  h2 {
     font-size: var(--font-size-h2);
     line-height: 1.2;
     font-weight: 400;
   }
-
   .h3,
-h3 {
+  h3 {
     font-size: var(--font-size-h3);
     line-height: 1.2;
     font-weight: 400;
   }
-
   .h4,
-h4 {
+  h4 {
     font-size: var(--font-size-h4);
     line-height: 1.2;
     font-weight: 400;
   }
-
   .h5,
-h5 {
+  h5 {
     font-size: var(--font-size-h5);
     line-height: 1.2;
     font-weight: 400;
   }
-
   .h6,
-h6 {
+  h6 {
     font-size: var(--font-size-h6);
     line-height: 1.2;
     font-weight: 400;
   }
 }
-@media only screen and (max-width: 960px) {
+@media only screen and (min-width: 1024px) {
   .text-lg-ellipsis {
     text-overflow: ellipsis;
     overflow: hidden;
     white-space: nowrap;
   }
-
   .h1,
-h1 {
+  h1 {
     font-size: var(--font-size-h1);
     line-height: 1.2;
     font-weight: 400;
   }
-
   .h2,
-h2 {
+  h2 {
     font-size: var(--font-size-h2);
     line-height: 1.2;
     font-weight: 400;
   }
-
   .h3,
-h3 {
+  h3 {
     font-size: var(--font-size-h3);
     line-height: 1.2;
     font-weight: 400;
   }
-
   .h4,
-h4 {
+  h4 {
     font-size: var(--font-size-h4);
     line-height: 1.2;
     font-weight: 400;
   }
-
   .h5,
-h5 {
+  h5 {
     font-size: var(--font-size-h5);
     line-height: 1.2;
     font-weight: 400;
   }
-
   .h6,
-h6 {
+  h6 {
     font-size: var(--font-size-h6);
     line-height: 1.2;
     font-weight: 400;
   }
 }
-@media only screen and (max-width: 760px) {
-  .text-md-ellipsis {
+@media only screen and (min-width: 1280px) {
+  .text-xl-ellipsis {
+    text-overflow: ellipsis;
+    overflow: hidden;
+    white-space: nowrap;
+  }
+  .h1,
+  h1 {
+    font-size: var(--font-size-h1);
+    line-height: 1.2;
+    font-weight: 400;
+  }
+  .h2,
+  h2 {
+    font-size: var(--font-size-h2);
+    line-height: 1.2;
+    font-weight: 400;
+  }
+  .h3,
+  h3 {
+    font-size: var(--font-size-h3);
+    line-height: 1.2;
+    font-weight: 400;
+  }
+  .h4,
+  h4 {
+    font-size: var(--font-size-h4);
+    line-height: 1.2;
+    font-weight: 400;
+  }
+  .h5,
+  h5 {
+    font-size: var(--font-size-h5);
+    line-height: 1.2;
+    font-weight: 400;
+  }
+  .h6,
+  h6 {
+    font-size: var(--font-size-h6);
+    line-height: 1.2;
+    font-weight: 400;
+  }
+}
+@media only screen and (min-width: 1540px) {
+  .text-xxl-ellipsis {
     text-overflow: ellipsis;
     overflow: hidden;
     white-space: nowrap;
   }
-
   .h1,
-h1 {
+  h1 {
     font-size: var(--font-size-h1);
     line-height: 1.2;
     font-weight: 400;
   }
-
   .h2,
-h2 {
+  h2 {
     font-size: var(--font-size-h2);
     line-height: 1.2;
     font-weight: 400;
   }
-
   .h3,
-h3 {
+  h3 {
     font-size: var(--font-size-h3);
     line-height: 1.2;
     font-weight: 400;
   }
-
   .h4,
-h4 {
+  h4 {
     font-size: var(--font-size-h4);
     line-height: 1.2;
     font-weight: 400;
   }
-
   .h5,
-h5 {
+  h5 {
     font-size: var(--font-size-h5);
     line-height: 1.2;
     font-weight: 400;
   }
-
   .h6,
-h6 {
+  h6 {
     font-size: var(--font-size-h6);
     line-height: 1.2;
     font-weight: 400;

package/dist/css/text/text.responsive.min.css

@@ -0,0 +1 @@
+@media only screen and (min-width: 640px){.text-sm-ellipsis{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.h1,h1{font-size:var(--font-size-h1);line-height:1.2;font-weight:400}.h2,h2{font-size:var(--font-size-h2);line-height:1.2;font-weight:400}.h3,h3{font-size:var(--font-size-h3);line-height:1.2;font-weight:400}.h4,h4{font-size:var(--font-size-h4);line-height:1.2;font-weight:400}.h5,h5{font-size:var(--font-size-h5);line-height:1.2;font-weight:400}.h6,h6{font-size:var(--font-size-h6);line-height:1.2;font-weight:400}}@media only screen and (min-width: 768px){.text-md-ellipsis{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.h1,h1{font-size:var(--font-size-h1);line-height:1.2;font-weight:400}.h2,h2{font-size:var(--font-size-h2);line-height:1.2;font-weight:400}.h3,h3{font-size:var(--font-size-h3);line-height:1.2;font-weight:400}.h4,h4{font-size:var(--font-size-h4);line-height:1.2;font-weight:400}.h5,h5{font-size:var(--font-size-h5);line-height:1.2;font-weight:400}.h6,h6{font-size:var(--font-size-h6);line-height:1.2;font-weight:400}}@media only screen and (min-width: 1024px){.text-lg-ellipsis{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.h1,h1{font-size:var(--font-size-h1);line-height:1.2;font-weight:400}.h2,h2{font-size:var(--font-size-h2);line-height:1.2;font-weight:400}.h3,h3{font-size:var(--font-size-h3);line-height:1.2;font-weight:400}.h4,h4{font-size:var(--font-size-h4);line-height:1.2;font-weight:400}.h5,h5{font-size:var(--font-size-h5);line-height:1.2;font-weight:400}.h6,h6{font-size:var(--font-size-h6);line-height:1.2;font-weight:400}}@media only screen and (min-width: 1280px){.text-xl-ellipsis{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.h1,h1{font-size:var(--font-size-h1);line-height:1.2;font-weight:400}.h2,h2{font-size:var(--font-size-h2);line-height:1.2;font-weight:400}.h3,h3{font-size:var(--font-size-h3);line-height:1.2;font-weight:400}.h4,h4{font-size:var(--font-size-h4);line-height:1.2;font-weight:400}.h5,h5{font-size:var(--font-size-h5);line-height:1.2;font-weight:400}.h6,h6{font-size:var(--font-size-h6);line-height:1.2;font-weight:400}}@media only screen and (min-width: 1540px){.text-xxl-ellipsis{text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.h1,h1{font-size:var(--font-size-h1);line-height:1.2;font-weight:400}.h2,h2{font-size:var(--font-size-h2);line-height:1.2;font-weight:400}.h3,h3{font-size:var(--font-size-h3);line-height:1.2;font-weight:400}.h4,h4{font-size:var(--font-size-h4);line-height:1.2;font-weight:400}.h5,h5{font-size:var(--font-size-h5);line-height:1.2;font-weight:400}.h6,h6{font-size:var(--font-size-h6);line-height:1.2;font-weight:400}}

package/{styles → dist/css}/theme/theme.css

@@ -1,3 +1,6 @@
+
+/**---------------------theme.css---------------------*/
+/* primary,secondary with alphas */
 .theme-text-primary {
   color: var(--theme-color-primary);
 }
@@ -194,4 +197,52 @@
 }
 .theme-border-tertiary-invert {
   border-color: var(--theme-color-tertiary-invert);
+}
+
+.theme-text-color, .theme-foreground-color {
+  color: var(--theme-color-text);
+}
+
+.theme-foreground-color-alpha {
+  color: var(--theme-color-foreground-alpha);
+}
+
+.theme-foreground-color-alpha-low {
+  color: var(--theme-color-foreground-alpha-low);
+}
+
+.theme-foreground-color-alpha-high {
+  color: var(--theme-color-foreground-alpha-high);
+}
+
+.theme-bg {
+  background-color: var(--theme-color-background);
+}
+
+.theme-bg-alpha {
+  background-color: var(--theme-color-background-alpha);
+}
+
+.theme-bg-alpha-low {
+  background-color: var(--theme-color-background-alpha-low);
+}
+
+.theme-bg-alpha-high {
+  background-color: var(--theme-color-background-alpha-high);
+}
+
+.theme-bg-paper {
+  background-color: var(--theme-color-paper);
+}
+
+.theme-bg-paper-alpha {
+  background-color: var(--theme-color-paper-alpha);
+}
+
+.theme-bg-paper-alpha-low {
+  background-color: var(--theme-color-paper-alpha-low);
+}
+
+.theme-bg-paper-alpha-high {
+  background-color: var(--theme-color-paper-alpha-high);
 }

package/{styles → dist/css}/theme/theme.min.css

@@ -1 +1 @@
-.theme-text-primary{color:var(--theme-color-primary)}.theme-text-primary-light{color:var(--theme-color-primary-light)}.theme-text-primary-lighter{color:var(--theme-color-primary-lighter)}.theme-text-primary-dark{color:var(--theme-color-primary-dark)}.theme-text-primary-darker{color:var(--theme-color-primary-darker)}.theme-text-primary-complement{color:var(--theme-color-primary-complement)}.theme-text-primary-invert{color:var(--theme-color-primary-invert)}.theme-bg-primary{background-color:var(--theme-color-primary)}.theme-bg-primary-light{background-color:var(--theme-color-primary-light)}.theme-bg-primary-lighter{background-color:var(--theme-color-primary-lighter)}.theme-bg-primary-dark{background-color:var(--theme-color-primary-dark)}.theme-bg-primary-darker{background-color:var(--theme-color-primary-darker)}.theme-bg-primary-complement{background-color:var(--theme-color-primary-complement)}.theme-bg-primary-invert{background-color:var(--theme-color-primary-invert)}.theme-border-primary{border-color:var(--theme-color-primary)}.theme-border-primary-light{border-color:var(--theme-color-primary-light)}.theme-border-primary-lighter{border-color:var(--theme-color-primary-lighter)}.theme-border-primary-dark{border-color:var(--theme-color-primary-dark)}.theme-border-primary-darker{border-color:var(--theme-color-primary-darker)}.theme-border-primary-complement{border-color:var(--theme-color-primary-complement)}.theme-border-primary-invert{border-color:var(--theme-color-primary-invert)}.theme-text-secondary{color:var(--theme-color-secondary)}.theme-text-secondary-light{color:var(--theme-color-secondary-light)}.theme-text-secondary-lighter{color:var(--theme-color-secondary-lighter)}.theme-text-secondary-dark{color:var(--theme-color-secondary-dark)}.theme-text-secondary-darker{color:var(--theme-color-secondary-darker)}.theme-text-secondary-complement{color:var(--theme-color-secondary-complement)}.theme-text-secondary-invert{color:var(--theme-color-secondary-invert)}.theme-bg-secondary{background-color:var(--theme-color-secondary)}.theme-bg-secondary-light{background-color:var(--theme-color-secondary-light)}.theme-bg-secondary-lighter{background-color:var(--theme-color-secondary-lighter)}.theme-bg-secondary-dark{background-color:var(--theme-color-secondary-dark)}.theme-bg-secondary-darker{background-color:var(--theme-color-secondary-darker)}.theme-bg-secondary-complement{background-color:var(--theme-color-secondary-complement)}.theme-bg-secondary-invert{background-color:var(--theme-color-secondary-invert)}.theme-border-secondary{border-color:var(--theme-color-secondary)}.theme-border-secondary-light{border-color:var(--theme-color-secondary-light)}.theme-border-secondary-lighter{border-color:var(--theme-color-secondary-lighter)}.theme-border-secondary-dark{border-color:var(--theme-color-secondary-dark)}.theme-border-secondary-darker{border-color:var(--theme-color-secondary-darker)}.theme-border-secondary-complement{border-color:var(--theme-color-secondary-complement)}.theme-border-secondary-invert{border-color:var(--theme-color-secondary-invert)}.theme-text-tertiary{color:var(--theme-color-tertiary)}.theme-text-tertiary-light{color:var(--theme-color-tertiary-light)}.theme-text-tertiary-lighter{color:var(--theme-color-tertiary-lighter)}.theme-text-tertiary-dark{color:var(--theme-color-tertiary-dark)}.theme-text-tertiary-darker{color:var(--theme-color-tertiary-darker)}.theme-text-tertiary-complement{color:var(--theme-color-tertiary-complement)}.theme-text-tertiary-invert{color:var(--theme-color-tertiary-invert)}.theme-bg-tertiary{background-color:var(--theme-color-tertiary)}.theme-bg-tertiary-light{background-color:var(--theme-color-tertiary-light)}.theme-bg-tertiary-lighter{background-color:var(--theme-color-tertiary-lighter)}.theme-bg-tertiary-dark{background-color:var(--theme-color-tertiary-dark)}.theme-bg-tertiary-darker{background-color:var(--theme-color-tertiary-darker)}.theme-bg-tertiary-complement{background-color:var(--theme-color-tertiary-complement)}.theme-bg-tertiary-invert{background-color:var(--theme-color-tertiary-invert)}.theme-border-tertiary{border-color:var(--theme-color-tertiary)}.theme-border-tertiary-light{border-color:var(--theme-color-tertiary-light)}.theme-border-tertiary-lighter{border-color:var(--theme-color-tertiary-lighter)}.theme-border-tertiary-dark{border-color:var(--theme-color-tertiary-dark)}.theme-border-tertiary-darker{border-color:var(--theme-color-tertiary-darker)}.theme-border-tertiary-complement{border-color:var(--theme-color-tertiary-complement)}.theme-border-tertiary-invert{border-color:var(--theme-color-tertiary-invert)}
+.theme-text-primary{color:var(--theme-color-primary)}.theme-text-primary-light{color:var(--theme-color-primary-light)}.theme-text-primary-lighter{color:var(--theme-color-primary-lighter)}.theme-text-primary-dark{color:var(--theme-color-primary-dark)}.theme-text-primary-darker{color:var(--theme-color-primary-darker)}.theme-text-primary-complement{color:var(--theme-color-primary-complement)}.theme-text-primary-invert{color:var(--theme-color-primary-invert)}.theme-bg-primary{background-color:var(--theme-color-primary)}.theme-bg-primary-light{background-color:var(--theme-color-primary-light)}.theme-bg-primary-lighter{background-color:var(--theme-color-primary-lighter)}.theme-bg-primary-dark{background-color:var(--theme-color-primary-dark)}.theme-bg-primary-darker{background-color:var(--theme-color-primary-darker)}.theme-bg-primary-complement{background-color:var(--theme-color-primary-complement)}.theme-bg-primary-invert{background-color:var(--theme-color-primary-invert)}.theme-border-primary{border-color:var(--theme-color-primary)}.theme-border-primary-light{border-color:var(--theme-color-primary-light)}.theme-border-primary-lighter{border-color:var(--theme-color-primary-lighter)}.theme-border-primary-dark{border-color:var(--theme-color-primary-dark)}.theme-border-primary-darker{border-color:var(--theme-color-primary-darker)}.theme-border-primary-complement{border-color:var(--theme-color-primary-complement)}.theme-border-primary-invert{border-color:var(--theme-color-primary-invert)}.theme-text-secondary{color:var(--theme-color-secondary)}.theme-text-secondary-light{color:var(--theme-color-secondary-light)}.theme-text-secondary-lighter{color:var(--theme-color-secondary-lighter)}.theme-text-secondary-dark{color:var(--theme-color-secondary-dark)}.theme-text-secondary-darker{color:var(--theme-color-secondary-darker)}.theme-text-secondary-complement{color:var(--theme-color-secondary-complement)}.theme-text-secondary-invert{color:var(--theme-color-secondary-invert)}.theme-bg-secondary{background-color:var(--theme-color-secondary)}.theme-bg-secondary-light{background-color:var(--theme-color-secondary-light)}.theme-bg-secondary-lighter{background-color:var(--theme-color-secondary-lighter)}.theme-bg-secondary-dark{background-color:var(--theme-color-secondary-dark)}.theme-bg-secondary-darker{background-color:var(--theme-color-secondary-darker)}.theme-bg-secondary-complement{background-color:var(--theme-color-secondary-complement)}.theme-bg-secondary-invert{background-color:var(--theme-color-secondary-invert)}.theme-border-secondary{border-color:var(--theme-color-secondary)}.theme-border-secondary-light{border-color:var(--theme-color-secondary-light)}.theme-border-secondary-lighter{border-color:var(--theme-color-secondary-lighter)}.theme-border-secondary-dark{border-color:var(--theme-color-secondary-dark)}.theme-border-secondary-darker{border-color:var(--theme-color-secondary-darker)}.theme-border-secondary-complement{border-color:var(--theme-color-secondary-complement)}.theme-border-secondary-invert{border-color:var(--theme-color-secondary-invert)}.theme-text-tertiary{color:var(--theme-color-tertiary)}.theme-text-tertiary-light{color:var(--theme-color-tertiary-light)}.theme-text-tertiary-lighter{color:var(--theme-color-tertiary-lighter)}.theme-text-tertiary-dark{color:var(--theme-color-tertiary-dark)}.theme-text-tertiary-darker{color:var(--theme-color-tertiary-darker)}.theme-text-tertiary-complement{color:var(--theme-color-tertiary-complement)}.theme-text-tertiary-invert{color:var(--theme-color-tertiary-invert)}.theme-bg-tertiary{background-color:var(--theme-color-tertiary)}.theme-bg-tertiary-light{background-color:var(--theme-color-tertiary-light)}.theme-bg-tertiary-lighter{background-color:var(--theme-color-tertiary-lighter)}.theme-bg-tertiary-dark{background-color:var(--theme-color-tertiary-dark)}.theme-bg-tertiary-darker{background-color:var(--theme-color-tertiary-darker)}.theme-bg-tertiary-complement{background-color:var(--theme-color-tertiary-complement)}.theme-bg-tertiary-invert{background-color:var(--theme-color-tertiary-invert)}.theme-border-tertiary{border-color:var(--theme-color-tertiary)}.theme-border-tertiary-light{border-color:var(--theme-color-tertiary-light)}.theme-border-tertiary-lighter{border-color:var(--theme-color-tertiary-lighter)}.theme-border-tertiary-dark{border-color:var(--theme-color-tertiary-dark)}.theme-border-tertiary-darker{border-color:var(--theme-color-tertiary-darker)}.theme-border-tertiary-complement{border-color:var(--theme-color-tertiary-complement)}.theme-border-tertiary-invert{border-color:var(--theme-color-tertiary-invert)}.theme-text-color,.theme-foreground-color{color:var(--theme-color-text)}.theme-foreground-color-alpha{color:var(--theme-color-foreground-alpha)}.theme-foreground-color-alpha-low{color:var(--theme-color-foreground-alpha-low)}.theme-foreground-color-alpha-high{color:var(--theme-color-foreground-alpha-high)}.theme-bg{background-color:var(--theme-color-background)}.theme-bg-alpha{background-color:var(--theme-color-background-alpha)}.theme-bg-alpha-low{background-color:var(--theme-color-background-alpha-low)}.theme-bg-alpha-high{background-color:var(--theme-color-background-alpha-high)}.theme-bg-paper{background-color:var(--theme-color-paper)}.theme-bg-paper-alpha{background-color:var(--theme-color-paper-alpha)}.theme-bg-paper-alpha-low{background-color:var(--theme-color-paper-alpha-low)}.theme-bg-paper-alpha-high{background-color:var(--theme-color-paper-alpha-high)}

package/{styles → dist/css}/vars.css

@@ -1,7 +1,13 @@
-/* cssFabric vars yes */
+
+/**---------------------vars.css---------------------*/
+/* primary,secondary with alphas */
+/* 
+cssFabric vars
+*/
 :root {
+  /* --theme-color-primary|*-alpha-|*  */
   /* theme primary colors*/
-  --theme-color-primary: #201700;
+  --theme-color-primary: rgb(32, 23, 0);
   --theme-color-primary-light: #6d4e00;
   --theme-color-primary-lighter: #b98500;
   --theme-color-primary-dark: black;
@@ -46,19 +52,19 @@
   --color-scheme-success-alpha: rgba(0, 128, 0, 0.3);
   --color-scheme-success-alpha-low: rgba(0, 128, 0, 0.8);
   --color-scheme-success-alpha-high: rgba(0, 128, 0, 0.1);
-  --color-scheme-info: #FFDD57FF;
+  --color-scheme-info: #ffdd57;
   --color-scheme-info-light: #ffeca4;
   --color-scheme-info-dark: #ffd324;
   --color-scheme-info-alpha: rgba(255, 221, 87, 0.3);
   --color-scheme-info-alpha-low: rgba(255, 221, 87, 0.8);
   --color-scheme-info-alpha-high: rgba(255, 221, 87, 0.1);
-  --color-scheme-warning: #e6b905;
+  --color-scheme-warning: hsl(48, 96%, 46%);
   --color-scheme-warning-light: #fbd53c;
   --color-scheme-warning-dark: #b49104;
   --color-scheme-warning-alpha: rgba(230, 185, 5, 0.3);
   --color-scheme-warning-alpha-low: rgba(230, 185, 5, 0.8);
   --color-scheme-warning-alpha-high: rgba(230, 185, 5, 0.1);
-  --color-scheme-alert: #ff7300;
+  --color-scheme-alert: hsl(27, 100%, 50%);
   --color-scheme-alert-light: #ff9d4d;
   --color-scheme-alert-dark: #cc5c00;
   --color-scheme-alert-alpha: rgba(255, 115, 0, 0.3);
@@ -240,27 +246,6 @@
   --color-gray-600-alpha: rgba(153, 153, 153, 0.3);
   --color-gray-600-alpha-low: rgba(153, 153, 153, 0.8);
   --color-gray-600-alpha-high: rgba(153, 153, 153, 0.1);
-  /* boxes */
-  --box-density-0: 0rem;
-  --box-density-1: 0.5rem;
-  --box-density-2: 1rem;
-  --box-density-3: 1.5rem;
-  --box-density-4: 2rem;
-  --box-density-5: 2.5rem;
-  --box-density-6: 3rem;
-  --box-density-7: 3.5rem;
-  --box-density-8: 4rem;
-  --box-density-9: 4.5rem;
-  --box-density-10: 5rem;
-  --box-density-11: 5.5rem;
-  --box-density-12: 6rem;
-  --box-density-preset-tiny: 0.25rem;
-  --box-density-preset-small: 0.5rem;
-  --box-density-preset-medium: 1.5rem;
-  --box-density-preset-large: 2rem;
-  --radius-tiny: 4px;
-  --radius-small: 8px;
-  --radius-medium: 16px;
   /* text */
   /*Hs*/
   --font-size-h1: 3.1rem;
@@ -282,9 +267,9 @@
   /*text shadows color_schemes*/
   --text-shadow-discrete: 0 0 0.125em #ccc;
   --text-shadow-success: 0 0 0.125em green;
-  --text-shadow-info: 0 0 0.125em #FFDD57FF;
-  --text-shadow-warning: 0 0 0.125em #e6b905;
-  --text-shadow-alert: 0 0 0.125em #ff7300;
+  --text-shadow-info: 0 0 0.125em #ffdd57;
+  --text-shadow-warning: 0 0 0.125em hsl(48, 96%, 46%);
+  --text-shadow-alert: 0 0 0.125em hsl(27, 100%, 50%);
   --text-shadow-error: 0 0 0.125em red;
   /*text-shadows color_palette */
   --text-shadow-yellow: 0 0 0.125em #ffb900;
@@ -296,28 +281,35 @@
   --text-shadow-teal: 0 0 0.125em #008272;
   --text-shadow-blue: 0 0 0.125em #0078d4;
   --text-shadow-dark: 0 0 0.125em #323232;
+  /* boxes */
+  --box-density-0: 0rem;
+  --box-density-1: 0.5rem;
+  --box-density-2: 1rem;
+  --box-density-3: 1.5rem;
+  --box-density-4: 2rem;
+  --box-density-5: 2.5rem;
+  --box-density-6: 3rem;
+  --box-density-7: 3.5rem;
+  --box-density-8: 4rem;
+  --box-density-9: 4.5rem;
+  --box-density-10: 5rem;
+  --box-density-11: 5.5rem;
+  --box-density-12: 6rem;
+  --box-density-preset-tight: 0.25rem;
+  --box-density-preset-tiny: 0.25rem;
+  --box-density-preset-small: 0.5rem;
+  --box-density-preset-default: 1rem;
+  --box-density-preset-medium: 1.5rem;
+  --box-density-preset-large: 3rem;
+  --radius-tiny: 4px;
+  --radius-small: 8px;
+  --radius-medium: 16px;
   /* shadows */
   --box-shad-1: 0 0.8333333333px 1.724137931px 0 rgba(0, 0, 0, 0.15), 0 0.1526717557px 0.4651162791px 0 rgba(0, 0, 0, 0.1);
   --box-shad-2: 0 1.6666666667px 3.4482758621px 0 rgba(0, 0, 0, 0.15), 0 0.3053435115px 0.9302325581px 0 rgba(0, 0, 0, 0.1);
   --box-shad-3: 0 2.5px 5.1724137931px 0 rgba(0, 0, 0, 0.15), 0 0.4580152672px 1.3953488372px 0 rgba(0, 0, 0, 0.1);
   --box-shad-4: 0 3.3333333333px 6.8965517241px 0 rgba(0, 0, 0, 0.15), 0 0.6106870229px 1.8604651163px 0 rgba(0, 0, 0, 0.1);
   --box-shad-5: 0 4.1666666667px 8.6206896552px 0 rgba(0, 0, 0, 0.15), 0 0.7633587786px 2.3255813953px 0 rgba(0, 0, 0, 0.1);
-  /* themes */
-  /* theme base colors*/
-  --theme-color-text: #282230;
-  --theme-color-foreground: #282230;
-  --theme-color-foreground-alpha: rgba(40, 34, 48, 0.3);
-  --theme-color-foreground-alpha-low: rgba(40, 34, 48, 0.8);
-  --theme-color-foreground-alpha-high: rgba(40, 34, 48, 0.1);
-  --theme-color-background: #ffffff;
-  --theme-color-background-alpha: rgba(40, 34, 48, 0.3);
-  --theme-color-background-alpha-low: rgba(40, 34, 48, 0.8);
-  --theme-color-background-alpha-high: rgba(40, 34, 48, 0.1);
-  --theme-color-paper: #f1f1f1;
-  --theme-color-paper-alpha: rgba(241, 241, 241, 0.3);
-  --theme-color-paper-alpha-low: rgba(241, 241, 241, 0.8);
-  --theme-color-paper-alpha-high: rgba(241, 241, 241, 0.1);
-  --theme-color-border: rgba(40, 34, 48, 0.2);
 }
 :root [density=small] {
   --box-density-0: 0rem;
@@ -333,10 +325,12 @@
   --box-density-10: 2.5rem;
   --box-density-11: 2.75rem;
   --box-density-12: 3rem;
-  --box-density-preset-tiny: 0.125rem;
-  --box-density-preset-small: 0.25rem;
-  --box-density-preset-medium: 0.75rem;
-  --box-density-preset-large: 1rem;
+  --box-density-preset-tight: 0.0625rem;
+  --box-density-preset-tiny: 0.0625rem;
+  --box-density-preset-small: 0.125rem;
+  --box-density-preset-default: 0.25rem;
+  --box-density-preset-medium: 0.375rem;
+  --box-density-preset-large: 0.75rem;
 }
 :root [density=default] {
   --box-density-0: 0rem;
@@ -352,10 +346,12 @@
   --box-density-10: 5rem;
   --box-density-11: 5.5rem;
   --box-density-12: 6rem;
-  --box-density-preset-tiny: 0.25rem;
-  --box-density-preset-small: 0.5rem;
-  --box-density-preset-medium: 1.5rem;
-  --box-density-preset-large: 2rem;
+  --box-density-preset-tight: 0.125rem;
+  --box-density-preset-tiny: 0.125rem;
+  --box-density-preset-small: 0.25rem;
+  --box-density-preset-default: 0.5rem;
+  --box-density-preset-medium: 0.75rem;
+  --box-density-preset-large: 1.5rem;
 }
 :root [density=large] {
   --box-density-0: 0rem;
@@ -371,12 +367,15 @@
   --box-density-10: 8.75rem;
   --box-density-11: 9.625rem;
   --box-density-12: 10.5rem;
-  --box-density-preset-tiny: 0.4375rem;
-  --box-density-preset-small: 0.875rem;
-  --box-density-preset-medium: 2.625rem;
-  --box-density-preset-large: 3.5rem;
+  --box-density-preset-tight: 0.21875rem;
+  --box-density-preset-tiny: 0.21875rem;
+  --box-density-preset-small: 0.4375rem;
+  --box-density-preset-default: 0.875rem;
+  --box-density-preset-medium: 1.3125rem;
+  --box-density-preset-large: 2.625rem;
 }
-:root, :root [data-theme=light] {
+:root,
+:root [data-theme=light] {
   /* theme base colors*/
   --theme-color-text: #282230;
   --theme-color-foreground: #282230;
@@ -384,15 +383,15 @@
   --theme-color-foreground-alpha-low: rgba(40, 34, 48, 0.8);
   --theme-color-foreground-alpha-high: rgba(40, 34, 48, 0.1);
   --theme-color-background: #ffffff;
-  --theme-color-background-alpha: rgba(40, 34, 48, 0.3);
-  --theme-color-background-alpha-low: rgba(40, 34, 48, 0.8);
-  --theme-color-background-alpha-high: rgba(40, 34, 48, 0.1);
+  --theme-color-background-alpha: rgba(255, 255, 255, 0.3);
+  --theme-color-background-alpha-low: rgba(255, 255, 255, 0.8);
+  --theme-color-background-alpha-high: rgba(255, 255, 255, 0.1);
   --theme-color-paper: #f1f1f1;
   --theme-color-paper-alpha: rgba(241, 241, 241, 0.3);
   --theme-color-paper-alpha-low: rgba(241, 241, 241, 0.8);
   --theme-color-paper-alpha-high: rgba(241, 241, 241, 0.1);
   --theme-color-border: rgba(40, 34, 48, 0.2);
-  --theme-color-overlay: rgba(208, 191, 151, 0.2);
+  --theme-color-overlay: rgba($theme-color-foreground, 0.4);
 }
 :root [data-theme=dark] {
   /* theme base colors*/
@@ -402,13 +401,13 @@
   --theme-color-foreground-alpha-low: rgba(241, 241, 241, 0.8);
   --theme-color-foreground-alpha-high: rgba(241, 241, 241, 0.1);
   --theme-color-background: #27323a;
-  --theme-color-background-alpha: rgba(241, 241, 241, 0.3);
-  --theme-color-background-alpha-low: rgba(241, 241, 241, 0.8);
-  --theme-color-background-alpha-high: rgba(241, 241, 241, 0.1);
-  --theme-color-paper: #f1f1f1;
+  --theme-color-background-alpha: rgba(39, 50, 58, 0.3);
+  --theme-color-background-alpha-low: rgba(39, 50, 58, 0.8);
+  --theme-color-background-alpha-high: rgba(39, 50, 58, 0.1);
+  --theme-color-paper: #3a3b3b;
   --theme-color-paper-alpha: rgba(58, 59, 59, 0.3);
   --theme-color-paper-alpha-low: rgba(58, 59, 59, 0.8);
   --theme-color-paper-alpha-high: rgba(58, 59, 59, 0.1);
   --theme-color-border: rgba(241, 241, 241, 0.3);
-  --theme-color-overlay: rgba(255, 255, 255, 0.1);
+  --theme-color-overlay: rgba($theme-dark-color-background, 0.4);
 }

package/dist/css/vars.min.css

@@ -0,0 +1 @@
+:root{--theme-color-primary: rgb(32, 23, 0);--theme-color-primary-light: #6d4e00;--theme-color-primary-lighter: #b98500;--theme-color-primary-dark: black;--theme-color-primary-darker: black;--theme-color-primary-complement: #000920;--theme-color-primary-invert: #dfe8ff;--theme-color-primary-alpha-low: rgba(32, 23, 0, 0.8);--theme-color-primary-alpha: rgba(32, 23, 0, 0.3);--theme-color-primary-alpha-high: rgba(32, 23, 0, 0.1);--theme-color-secondary: #D14B02;--theme-color-secondary-light: #fd7023;--theme-color-secondary-lighter: #fea16e;--theme-color-secondary-dark: #9e3902;--theme-color-secondary-darker: #6c2701;--theme-color-secondary-complement: #0288d1;--theme-color-secondary-invert: #2eb4fd;--theme-color-secondary-alpha-low: rgba(209, 75, 2, 0.8);--theme-color-secondary-alpha: rgba(209, 75, 2, 0.3);--theme-color-secondary-alpha-high: rgba(209, 75, 2, 0.1);--theme-color-tertiary: #88D102;--theme-color-tertiary-light: #b0fd23;--theme-color-tertiary-lighter: #cbfe6e;--theme-color-tertiary-dark: #679e02;--theme-color-tertiary-darker: #466c01;--theme-color-tertiary-complement: #4b02d1;--theme-color-tertiary-invert: #772efd;--theme-color-tertiary-alpha-low: rgba(136, 209, 2, 0.8);--theme-color-tertiary-alpha: rgba(136, 209, 2, 0.3);--theme-color-tertiary-alpha-high: rgba(136, 209, 2, 0.1);--color-scheme-discrete: #ccc;--color-scheme-discrete-light: #f2f2f2;--color-scheme-discrete-dark: #b3b3b3;--color-scheme-discrete-alpha:rgba(204,204,204,.3);--color-scheme-discrete-alpha-low:rgba(204,204,204,.8);--color-scheme-discrete-alpha-high:rgba(204,204,204,.1);--color-scheme-success: green;--color-scheme-success-light: #00cd00;--color-scheme-success-dark: #004d00;--color-scheme-success-alpha:rgba(0,128,0,.3);--color-scheme-success-alpha-low:rgba(0,128,0,.8);--color-scheme-success-alpha-high:rgba(0,128,0,.1);--color-scheme-info: #ffdd57;--color-scheme-info-light: #ffeca4;--color-scheme-info-dark: #ffd324;--color-scheme-info-alpha:rgba(255,221,87,.3);--color-scheme-info-alpha-low:rgba(255,221,87,.8);--color-scheme-info-alpha-high:rgba(255,221,87,.1);--color-scheme-warning: hsl(48, 96%, 46%);--color-scheme-warning-light: #fbd53c;--color-scheme-warning-dark: #b49104;--color-scheme-warning-alpha:rgba(230,185,5,.3);--color-scheme-warning-alpha-low:rgba(230,185,5,.8);--color-scheme-warning-alpha-high:rgba(230,185,5,.1);--color-scheme-alert: hsl(27, 100%, 50%);--color-scheme-alert-light: #ff9d4d;--color-scheme-alert-dark: #cc5c00;--color-scheme-alert-alpha:rgba(255,115,0,.3);--color-scheme-alert-alpha-low:rgba(255,115,0,.8);--color-scheme-alert-alpha-high:rgba(255,115,0,.1);--color-scheme-error: red;--color-scheme-error-light: #ff4d4d;--color-scheme-error-dark: #cc0000;--color-scheme-error-alpha:rgba(255,0,0,.3);--color-scheme-error-alpha-low:rgba(255,0,0,.8);--color-scheme-error-alpha-high:rgba(255,0,0,.1);--color-palette-yellow: #ffb900;--color-palette-yellow-alpha:rgba(255,185,0,.3);--color-palette-yellow-alpha-low:rgba(255,185,0,.8);--color-palette-yellow-alpha-high:rgba(255,185,0,.1);--color-palette-yellow-lighter: #ffe399;--color-palette-yellow-light: #ffce4d;--color-palette-yellow-dark: #cc9400;--color-palette-yellow-darker: #996f00;--color-palette-yellow-complement: #0046ff;--color-palette-yellow-complement-alpha:rgba(0,70,255,.3);--color-palette-yellow-complement-alpha-low:rgba(0,70,255,.8);--color-palette-yellow-complement-alpha-high:rgba(0,70,255,.1);--color-palette-yellow-invert: #0046ff;--color-palette-yellow-invert-alpha:rgba(0,70,255,.3);--color-palette-yellow-invert-alpha-low:rgba(0,70,255,.8);--color-palette-yellow-invert-alpha-high:rgba(0,70,255,.1);--color-palette-orange: #d83b01;--color-palette-orange-alpha:rgba(216,59,1,.3);--color-palette-orange-alpha-low:rgba(216,59,1,.8);--color-palette-orange-alpha-high:rgba(216,59,1,.1);--color-palette-orange-lighter: #fe9974;--color-palette-orange-light: #fe6127;--color-palette-orange-dark: #a52d01;--color-palette-orange-darker: #721f01;--color-palette-orange-complement: #019ed8;--color-palette-orange-complement-alpha:rgba(1,158,216,.3);--color-palette-orange-complement-alpha-low:rgba(1,158,216,.8);--color-palette-orange-complement-alpha-high:rgba(1,158,216,.1);--color-palette-orange-invert: #27c4fe;--color-palette-orange-invert-alpha:rgba(39,196,254,.3);--color-palette-orange-invert-alpha-low:rgba(39,196,254,.8);--color-palette-orange-invert-alpha-high:rgba(39,196,254,.1);--color-palette-red: #d13438;--color-palette-red-alpha:rgba(209,52,56,.3);--color-palette-red-alpha-low:rgba(209,52,56,.8);--color-palette-red-alpha-high:rgba(209,52,56,.1);--color-palette-red-lighter: #edb1b2;--color-palette-red-light: #df7275;--color-palette-red-dark: #ab272a;--color-palette-red-darker: #821d20;--color-palette-red-complement: #34d1cd;--color-palette-red-complement-alpha:rgba(52,209,205,.3);--color-palette-red-complement-alpha-low:rgba(52,209,205,.8);--color-palette-red-complement-alpha-high:rgba(52,209,205,.1);--color-palette-red-invert: #2ecbc7;--color-palette-red-invert-alpha:rgba(46,203,199,.3);--color-palette-red-invert-alpha-low:rgba(46,203,199,.8);--color-palette-red-invert-alpha-high:rgba(46,203,199,.1);--color-palette-magenta: #b4009e;--color-palette-magenta-alpha:rgba(180,0,158,.3);--color-palette-magenta-alpha-low:rgba(180,0,158,.8);--color-palette-magenta-alpha-high:rgba(180,0,158,.1);--color-palette-magenta-lighter: #ff4ee9;--color-palette-magenta-light: #ff02e0;--color-palette-magenta-dark: #810071;--color-palette-magenta-darker: #4e0044;--color-palette-magenta-complement: #00b416;--color-palette-magenta-complement-alpha:rgba(0,180,22,.3);--color-palette-magenta-complement-alpha-low:rgba(0,180,22,.8);--color-palette-magenta-complement-alpha-high:rgba(0,180,22,.1);--color-palette-magenta-invert: #4bff61;--color-palette-magenta-invert-alpha:rgba(75,255,97,.3);--color-palette-magenta-invert-alpha-low:rgba(75,255,97,.8);--color-palette-magenta-invert-alpha-high:rgba(75,255,97,.1);--color-palette-purple: #5c2d91;--color-palette-purple-alpha:rgba(92,45,145,.3);--color-palette-purple-alpha-low:rgba(92,45,145,.8);--color-palette-purple-alpha-high:rgba(92,45,145,.1);--color-palette-purple-lighter: #a980d7;--color-palette-purple-light: #8145c5;--color-palette-purple-dark: #43216a;--color-palette-purple-darker: #2b1543;--color-palette-purple-complement: #62912d;--color-palette-purple-complement-alpha:rgba(98,145,45,.3);--color-palette-purple-complement-alpha-low:rgba(98,145,45,.8);--color-palette-purple-complement-alpha-high:rgba(98,145,45,.1);--color-palette-purple-invert: #a3d26e;--color-palette-purple-invert-alpha:rgba(163,210,110,.3);--color-palette-purple-invert-alpha-low:rgba(163,210,110,.8);--color-palette-purple-invert-alpha-high:rgba(163,210,110,.1);--color-palette-green: #107c10;--color-palette-green-alpha:rgba(16,124,16,.3);--color-palette-green-alpha-low:rgba(16,124,16,.8);--color-palette-green-alpha-high:rgba(16,124,16,.1);--color-palette-green-lighter: #3fe63f;--color-palette-green-light: #19c019;--color-palette-green-dark: #0a4f0a;--color-palette-green-darker: #042204;--color-palette-green-complement: #7c107c;--color-palette-green-complement-alpha:rgba(124,16,124,.3);--color-palette-green-complement-alpha-low:rgba(124,16,124,.8);--color-palette-green-complement-alpha-high:rgba(124,16,124,.1);--color-palette-green-invert: #ef83ef;--color-palette-green-invert-alpha:rgba(239,131,239,.3);--color-palette-green-invert-alpha-low:rgba(239,131,239,.8);--color-palette-green-invert-alpha-high:rgba(239,131,239,.1);--color-palette-teal: #008272;--color-palette-teal-alpha:rgba(0,130,114,.3);--color-palette-teal-alpha-low:rgba(0,130,114,.8);--color-palette-teal-alpha-high:rgba(0,130,114,.1);--color-palette-teal-lighter: #1cffe3;--color-palette-teal-light: #00cfb5;--color-palette-teal-dark: #004f45;--color-palette-teal-darker: #001c19;--color-palette-teal-complement: #820010;--color-palette-teal-complement-alpha:rgba(130,0,16,.3);--color-palette-teal-complement-alpha-low:rgba(130,0,16,.8);--color-palette-teal-complement-alpha-high:rgba(130,0,16,.1);--color-palette-teal-invert: #ff7d8d;--color-palette-teal-invert-alpha:rgba(255,125,141,.3);--color-palette-teal-invert-alpha-low:rgba(255,125,141,.8);--color-palette-teal-invert-alpha-high:rgba(255,125,141,.1);--color-palette-blue: #0078d4;--color-palette-blue-alpha:rgba(0,120,212,.3);--color-palette-blue-alpha-low:rgba(0,120,212,.8);--color-palette-blue-alpha-high:rgba(0,120,212,.1);--color-palette-blue-lighter: #6ec0ff;--color-palette-blue-light: #229fff;--color-palette-blue-dark: #005ba1;--color-palette-blue-darker: #003e6e;--color-palette-blue-complement: #d45c00;--color-palette-blue-complement-alpha:rgba(212,92,0,.3);--color-palette-blue-complement-alpha-low:rgba(212,92,0,.8);--color-palette-blue-complement-alpha-high:rgba(212,92,0,.1);--color-palette-blue-invert: #ff872b;--color-palette-blue-invert-alpha:rgba(255,135,43,.3);--color-palette-blue-invert-alpha-low:rgba(255,135,43,.8);--color-palette-blue-invert-alpha-high:rgba(255,135,43,.1);--color-palette-dark: #323232;--color-palette-dark-alpha:rgba(50,50,50,.3);--color-palette-dark-alpha-low:rgba(50,50,50,.8);--color-palette-dark-alpha-high:rgba(50,50,50,.1);--color-palette-dark-lighter: #7f7f7f;--color-palette-dark-light: #585858;--color-palette-dark-dark: #191919;--color-palette-dark-darker: black;--color-palette-dark-complement: #323232;--color-palette-dark-complement-alpha:rgba(50,50,50,.3);--color-palette-dark-complement-alpha-low:rgba(50,50,50,.8);--color-palette-dark-complement-alpha-high:rgba(50,50,50,.1);--color-palette-dark-invert: #cdcdcd;--color-palette-dark-invert-alpha:rgba(205,205,205,.3);--color-palette-dark-invert-alpha-low:rgba(205,205,205,.8);--color-palette-dark-invert-alpha-high:rgba(205,205,205,.1);--color-gray-100: #f4f4f4;--color-gray-100-alpha:rgba(244,244,244,.3);--color-gray-100-alpha-low:rgba(244,244,244,.8);--color-gray-100-alpha-high:rgba(244,244,244,.1);--color-gray-200: #e2e2e2;--color-gray-200-alpha:rgba(226,226,226,.3);--color-gray-200-alpha-low:rgba(226,226,226,.8);--color-gray-200-alpha-high:rgba(226,226,226,.1);--color-gray-300: #d0d0d0;--color-gray-300-alpha:rgba(208,208,208,.3);--color-gray-300-alpha-low:rgba(208,208,208,.8);--color-gray-300-alpha-high:rgba(208,208,208,.1);--color-gray-400: #bdbdbd;--color-gray-400-alpha:rgba(189,189,189,.3);--color-gray-400-alpha-low:rgba(189,189,189,.8);--color-gray-400-alpha-high:rgba(189,189,189,.1);--color-gray-500: #ababab;--color-gray-500-alpha:rgba(171,171,171,.3);--color-gray-500-alpha-low:rgba(171,171,171,.8);--color-gray-500-alpha-high:rgba(171,171,171,.1);--color-gray-600: #999999;--color-gray-600-alpha:rgba(153,153,153,.3);--color-gray-600-alpha-low:rgba(153,153,153,.8);--color-gray-600-alpha-high:rgba(153,153,153,.1);--font-size-h1: 3.1rem;--font-size-h2: 2.68rem;--font-size-h3: 2.26rem;--font-size-h4: 1.84rem;--font-size-h5: 1.42rem;--font-size-h6: 1rem;--font-weight-50: 50;--font-weight-100: 100;--font-weight-300: 400;--font-weight-500: 500;--font-weight-900: 900;--font-weight-light: lighter;--font-weight-cap: normal;--font-weight-bold: bold;--font-weight-bolder: bolder;--text-shadow-discrete: 0 0 0.125em #ccc;--text-shadow-success: 0 0 0.125em green;--text-shadow-info: 0 0 0.125em #ffdd57;--text-shadow-warning: 0 0 0.125em hsl(48, 96%, 46%);--text-shadow-alert: 0 0 0.125em hsl(27, 100%, 50%);--text-shadow-error: 0 0 0.125em red;--text-shadow-yellow: 0 0 0.125em #ffb900;--text-shadow-orange: 0 0 0.125em #d83b01;--text-shadow-red: 0 0 0.125em #d13438;--text-shadow-magenta: 0 0 0.125em #b4009e;--text-shadow-purple: 0 0 0.125em #5c2d91;--text-shadow-green: 0 0 0.125em #107c10;--text-shadow-teal: 0 0 0.125em #008272;--text-shadow-blue: 0 0 0.125em #0078d4;--text-shadow-dark: 0 0 0.125em #323232;--box-density-0: 0rem;--box-density-1: 0.5rem;--box-density-2: 1rem;--box-density-3: 1.5rem;--box-density-4: 2rem;--box-density-5: 2.5rem;--box-density-6: 3rem;--box-density-7: 3.5rem;--box-density-8: 4rem;--box-density-9: 4.5rem;--box-density-10: 5rem;--box-density-11: 5.5rem;--box-density-12: 6rem;--box-density-preset-tight: 0.25rem;--box-density-preset-tiny: 0.25rem;--box-density-preset-small: 0.5rem;--box-density-preset-default: 1rem;--box-density-preset-medium: 1.5rem;--box-density-preset-large: 3rem;--radius-tiny: 4px;--radius-small: 8px;--radius-medium: 16px;--box-shad-1: 0 0.8333333333px 1.724137931px 0 rgba(0, 0, 0, 0.15), 0 0.1526717557px 0.4651162791px 0 rgba(0, 0, 0, 0.1);--box-shad-2: 0 1.6666666667px 3.4482758621px 0 rgba(0, 0, 0, 0.15), 0 0.3053435115px 0.9302325581px 0 rgba(0, 0, 0, 0.1);--box-shad-3: 0 2.5px 5.1724137931px 0 rgba(0, 0, 0, 0.15), 0 0.4580152672px 1.3953488372px 0 rgba(0, 0, 0, 0.1);--box-shad-4: 0 3.3333333333px 6.8965517241px 0 rgba(0, 0, 0, 0.15), 0 0.6106870229px 1.8604651163px 0 rgba(0, 0, 0, 0.1);--box-shad-5: 0 4.1666666667px 8.6206896552px 0 rgba(0, 0, 0, 0.15), 0 0.7633587786px 2.3255813953px 0 rgba(0, 0, 0, 0.1)}:root [density=small]{--box-density-0: 0rem;--box-density-1: 0.25rem;--box-density-2: 0.5rem;--box-density-3: 0.75rem;--box-density-4: 1rem;--box-density-5: 1.25rem;--box-density-6: 1.5rem;--box-density-7: 1.75rem;--box-density-8: 2rem;--box-density-9: 2.25rem;--box-density-10: 2.5rem;--box-density-11: 2.75rem;--box-density-12: 3rem;--box-density-preset-tight: 0.0625rem;--box-density-preset-tiny: 0.0625rem;--box-density-preset-small: 0.125rem;--box-density-preset-default: 0.25rem;--box-density-preset-medium: 0.375rem;--box-density-preset-large: 0.75rem}:root [density=default]{--box-density-0: 0rem;--box-density-1: 0.5rem;--box-density-2: 1rem;--box-density-3: 1.5rem;--box-density-4: 2rem;--box-density-5: 2.5rem;--box-density-6: 3rem;--box-density-7: 3.5rem;--box-density-8: 4rem;--box-density-9: 4.5rem;--box-density-10: 5rem;--box-density-11: 5.5rem;--box-density-12: 6rem;--box-density-preset-tight: 0.125rem;--box-density-preset-tiny: 0.125rem;--box-density-preset-small: 0.25rem;--box-density-preset-default: 0.5rem;--box-density-preset-medium: 0.75rem;--box-density-preset-large: 1.5rem}:root [density=large]{--box-density-0: 0rem;--box-density-1: 0.875rem;--box-density-2: 1.75rem;--box-density-3: 2.625rem;--box-density-4: 3.5rem;--box-density-5: 4.375rem;--box-density-6: 5.25rem;--box-density-7: 6.125rem;--box-density-8: 7rem;--box-density-9: 7.875rem;--box-density-10: 8.75rem;--box-density-11: 9.625rem;--box-density-12: 10.5rem;--box-density-preset-tight: 0.21875rem;--box-density-preset-tiny: 0.21875rem;--box-density-preset-small: 0.4375rem;--box-density-preset-default: 0.875rem;--box-density-preset-medium: 1.3125rem;--box-density-preset-large: 2.625rem}:root,:root [data-theme=light]{--theme-color-text: #282230;--theme-color-foreground: #282230;--theme-color-foreground-alpha:rgba(40,34,48,.3);--theme-color-foreground-alpha-low:rgba(40,34,48,.8);--theme-color-foreground-alpha-high:rgba(40,34,48,.1);--theme-color-background: #ffffff;--theme-color-background-alpha:rgba(255,255,255,.3);--theme-color-background-alpha-low:rgba(255,255,255,.8);--theme-color-background-alpha-high:rgba(255,255,255,.1);--theme-color-paper: #f1f1f1;--theme-color-paper-alpha:rgba(241,241,241,.3);--theme-color-paper-alpha-low:rgba(241,241,241,.8);--theme-color-paper-alpha-high:rgba(241,241,241,.1);--theme-color-border: rgba(40, 34, 48, 0.2);--theme-color-overlay: rgba($theme-color-foreground, 0.4)}:root [data-theme=dark]{--theme-color-text: #f1f1f1;--theme-color-foreground: #f1f1f1;--theme-color-foreground-alpha:rgba(241,241,241,.3);--theme-color-foreground-alpha-low:rgba(241,241,241,.8);--theme-color-foreground-alpha-high:rgba(241,241,241,.1);--theme-color-background: #27323a;--theme-color-background-alpha:rgba(39,50,58,.3);--theme-color-background-alpha-low:rgba(39,50,58,.8);--theme-color-background-alpha-high:rgba(39,50,58,.1);--theme-color-paper: #3a3b3b;--theme-color-paper-alpha:rgba(58,59,59,.3);--theme-color-paper-alpha-low:rgba(58,59,59,.8);--theme-color-paper-alpha-high:rgba(58,59,59,.1);--theme-color-border: rgba(241, 241, 241, 0.3);--theme-color-overlay: rgba($theme-dark-color-background, 0.4)}

package/{styles → dist/css}/zindex/zindex.css

@@ -1,3 +1,5 @@
+
+/**---------------------zindex.css---------------------*/
 .zI-0 {
   z-index: 0;
 }

package/dist/cssFabric/config.d.ts

@@ -0,0 +1,29 @@
+export declare const colorConfig: {
+    theme: {
+        primary: string;
+        secondary: string;
+        accent: string;
+        neutral: string;
+        error: string;
+        gray: string;
+    };
+    palette: {
+        yellow: string;
+        orange: string;
+        red: string;
+        magenta: string;
+        purple: string;
+        green: string;
+        teal: string;
+        blue: string;
+        dark: string;
+    };
+    status: {
+        discrete: string;
+        success: string;
+        info: string;
+        warning: string;
+        alert: string;
+        error: string;
+    };
+};