@acorex/styles 21.0.1-next.87 → 21.0.1-next.89

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@acorex/styles",
-  "version": "21.0.1-next.87",
+  "version": "21.0.1-next.89",
   "main": "index.css",
   "author": "Ali Safari",
   "license": "ISC",

package/themes/default.css

@@ -3,6 +3,16 @@
 
 @custom-variant dark (&:where(.ax-dark, .ax-dark *));
 
+input:-webkit-autofill,
+input:-webkit-autofill:hover,
+input:-webkit-autofill:focus,
+textarea:-webkit-autofill,
+select:-webkit-autofill {
+  -webkit-box-shadow: 0 0 0 1000px transparent inset !important;
+  -webkit-text-fill-color: inherit !important;
+  transition: background-color 9999s ease-in-out 0s;
+}
+
 @layer base {
   * {
     border-color: var(--color-border-default);
@@ -3073,7 +3083,7 @@ html.ax-dark {
     }
   }
   &:not(.ax-state-disabled, .ax-state-loading, .ax-state-selected):active {
-    @apply bg-(--ax-comp-bg-darker,var(--color-light)) text-(--ax-comp-text-darker,var(--color-on-light)) ring-2 ring-(--ax-comp-bg-dark) ring-offset-2 dark:bg-(--ax-comp-bg-darker,var(--color-dark)) dark:text-(--ax-comp-text-darker,var(--color-on-dark));
+    @apply bg-(--ax-comp-bg-darker,var(--color-light)) text-(--ax-comp-text-darker,var(--color-on-light)) ring-1 ring-(--ax-comp-bg-dark) ring-offset-2 dark:bg-(--ax-comp-bg-darker,var(--color-dark)) dark:text-(--ax-comp-text-darker,var(--color-on-dark));
   }
 }
 
@@ -3238,18 +3248,93 @@ html.ax-dark {
 @utility tabs-fit {
   width: 100%;
 }
+
 @utility ax-xs {
-  --ax-sys-xs-size: var(--ax-sys-size-xs);
+  /* Spacing */
+  --spacing: 0.125rem;
+
+  /* Typography */
+  --text-xs: 0.625rem;
+  --text-sm: 0.6875rem;
+  --text-base: 0.75rem;
+  --text-lg: 0.875rem;
+  --text-xl: 1rem;
+
+  /* Line Heights */
+  --leading-3: 0.75rem;
+  --leading-4: 0.875rem;
+  --leading-5: 1rem;
+  --leading-6: 1.25rem;
 }
+
 @utility ax-sm {
-  --ax-sys-sm-size: var(--ax-sys-size-sm);
+  /* Spacing */
+  --spacing: 0.1875rem;
+
+  /* Typography */
+  --text-xs: 0.6875rem;
+  --text-sm: 0.75rem;
+  --text-base: 0.875rem;
+  --text-lg: 1rem;
+  --text-xl: 1.125rem;
+
+  /* Line Heights */
+  --leading-3: 0.875rem;
+  --leading-4: 1rem;
+  --leading-5: 1.125rem;
+  --leading-6: 1.375rem;
 }
+
 @utility ax-md {
-  --ax-sys-md-size: var(--ax-sys-size-md);
+  /* Tailwind Default Scale */
+  --spacing: 0.25rem;
+
+  /* Typography */
+  --text-xs: 0.75rem;
+  --text-sm: 0.875rem;
+  --text-base: 1rem;
+  --text-lg: 1.125rem;
+  --text-xl: 1.25rem;
+
+  /* Line Heights */
+  --leading-3: 0.75rem;
+  --leading-4: 1rem;
+  --leading-5: 1.25rem;
+  --leading-6: 1.5rem;
 }
+
 @utility ax-lg {
-  --ax-sys-lg-size: var(--ax-sys-size-lg);
+  /* Spacing */
+  --spacing: 0.3125rem;
+
+  /* Typography */
+  --text-xs: 0.8125rem;
+  --text-sm: 0.9375rem;
+  --text-base: 1.0625rem;
+  --text-lg: 1.25rem;
+  --text-xl: 1.375rem;
+
+  /* Line Heights */
+  --leading-3: 1rem;
+  --leading-4: 1.125rem;
+  --leading-5: 1.375rem;
+  --leading-6: 1.625rem;
 }
+
 @utility ax-xl {
-  --ax-sys-xl-size: var(--ax-sys-size-xl);
+  /* Spacing */
+  --spacing: 0.375rem;
+
+  /* Typography */
+  --text-xs: 0.875rem;
+  --text-sm: 1rem;
+  --text-base: 1.125rem;
+  --text-lg: 1.375rem;
+  --text-xl: 1.5rem;
+
+  /* Line Heights */
+  --leading-3: 1.125rem;
+  --leading-4: 1.25rem;
+  --leading-5: 1.5rem;
+  --leading-6: 1.75rem;
 }