@yomologic/react-ui 0.6.6 → 0.6.7

package/dist/styles.css

@@ -2706,6 +2706,12 @@
       position: absolute;
     }
   }
+  .after\:right-0 {
+    &::after {
+      content: var(--tw-content);
+      right: calc(var(--spacing) * 0);
+    }
+  }
   .after\:bottom-0 {
     &::after {
       content: var(--tw-content);
@@ -2724,16 +2730,24 @@
       height: calc(var(--spacing) * 0.5);
     }
   }
-  .after\:w-0 {
+  .after\:origin-center {
+    &::after {
+      content: var(--tw-content);
+      transform-origin: center;
+    }
+  }
+  .after\:scale-x-0 {
     &::after {
       content: var(--tw-content);
-      width: calc(var(--spacing) * 0);
+      --tw-scale-x: 0%;
+      scale: var(--tw-scale-x) var(--tw-scale-y);
     }
   }
-  .after\:w-full {
+  .after\:scale-x-100 {
     &::after {
       content: var(--tw-content);
-      width: 100%;
+      --tw-scale-x: 100%;
+      scale: var(--tw-scale-x) var(--tw-scale-y);
     }
   }
   .after\:bg-\(--color-primary\) {
@@ -2742,10 +2756,14 @@
       background-color: var(--color-primary);
     }
   }
-  .after\:transition-all {
+  .after\:transition-transform {
     &::after {
       content: var(--tw-content);
-      transition-property: all;
+      transition-property:
+        transform,
+        translate,
+        scale,
+        rotate;
       transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
       transition-duration: var(--tw-duration, var(--default-transition-duration));
     }
@@ -2847,16 +2865,6 @@
       }
     }
   }
-  .hover\:bg-\(--color-primary\)\/5 {
-    &:hover {
-      @media (hover: hover) {
-        background-color: var(--color-primary);
-        @supports (color: color-mix(in lab, red, red)) {
-          background-color: color-mix(in oklab, var(--color-primary) 5%, transparent);
-        }
-      }
-    }
-  }
   .hover\:bg-\(--color-primary\)\/10 {
     &:hover {
       @media (hover: hover) {
@@ -2997,12 +3005,13 @@
       }
     }
   }
-  .hover\:after\:w-full {
+  .hover\:after\:scale-x-100 {
     &:hover {
       @media (hover: hover) {
         &::after {
           content: var(--tw-content);
-          width: 100%;
+          --tw-scale-x: 100%;
+          scale: var(--tw-scale-x) var(--tw-scale-y);
         }
       }
     }
@@ -3134,6 +3143,35 @@
       background-color: var(--color-muted);
     }
   }
+  .active\:bg-\(--color-muted\)\/80 {
+    &:active {
+      background-color: var(--color-muted);
+      @supports (color: color-mix(in lab, red, red)) {
+        background-color: color-mix(in oklab, var(--color-muted) 80%, transparent);
+      }
+    }
+  }
+  .active\:bg-\(--color-primary\)\/20 {
+    &:active {
+      background-color: var(--color-primary);
+      @supports (color: color-mix(in lab, red, red)) {
+        background-color: color-mix(in oklab, var(--color-primary) 20%, transparent);
+      }
+    }
+  }
+  .active\:bg-\(--color-primary\)\/90 {
+    &:active {
+      background-color: var(--color-primary);
+      @supports (color: color-mix(in lab, red, red)) {
+        background-color: color-mix(in oklab, var(--color-primary) 90%, transparent);
+      }
+    }
+  }
+  .active\:text-\(--color-primary\) {
+    &:active {
+      color: var(--color-primary);
+    }
+  }
   .active\:brightness-75 {
     &:active {
       --tw-brightness: brightness(75%);
@@ -3146,6 +3184,15 @@
       filter: var(--tw-blur,) var(--tw-brightness,) var(--tw-contrast,) var(--tw-grayscale,) var(--tw-hue-rotate,) var(--tw-invert,) var(--tw-saturate,) var(--tw-sepia,) var(--tw-drop-shadow,);
     }
   }
+  .active\:after\:scale-x-100 {
+    &:active {
+      &::after {
+        content: var(--tw-content);
+        --tw-scale-x: 100%;
+        scale: var(--tw-scale-x) var(--tw-scale-y);
+      }
+    }
+  }
   .disabled\:cursor-not-allowed {
     &:disabled {
       cursor: not-allowed;