@yomologic/react-ui 0.5.11 → 0.6.2

package/dist/styles.css

@@ -1263,6 +1263,9 @@
   .border-\(--color-border\) {
     border-color: var(--color-border);
   }
+  .border-\(--color-error\) {
+    border-color: var(--color-error);
+  }
   .border-\[\#1f2937\] {
     border-color: #1f2937;
   }
@@ -2082,6 +2085,9 @@
   .text-\(--color-accent-foreground\) {
     color: var(--color-accent-foreground);
   }
+  .text-\(--color-error\) {
+    color: var(--color-error);
+  }
   .text-\(--color-foreground\) {
     color: var(--color-foreground);
   }
@@ -2928,6 +2934,11 @@
       }
     }
   }
+  .focus\:border-\(--color-error\) {
+    &:focus {
+      border-color: var(--color-error);
+    }
+  }
   .focus\:border-\(--color-primary\) {
     &:focus {
       border-color: var(--color-primary);
@@ -2944,6 +2955,11 @@
         var(--tw-shadow);
     }
   }
+  .focus\:ring-\(--color-error\) {
+    &:focus {
+      --tw-ring-color: var(--color-error);
+    }
+  }
   .focus\:ring-\(--color-primary\)\/30 {
     &:focus {
       --tw-ring-color: var(--color-primary);
@@ -2969,6 +2985,11 @@
       outline-style: none;
     }
   }
+  .focus-visible\:border-\(--color-error\) {
+    &:focus-visible {
+      border-color: var(--color-error);
+    }
+  }
   .focus-visible\:border-\(--color-primary\) {
     &:focus-visible {
       border-color: var(--color-primary);
@@ -2995,6 +3016,11 @@
         var(--tw-shadow);
     }
   }
+  .focus-visible\:ring-\(--color-error\) {
+    &:focus-visible {
+      --tw-ring-color: var(--color-error);
+    }
+  }
   .focus-visible\:ring-\(--color-primary\)\/30 {
     &:focus-visible {
       --tw-ring-color: var(--color-primary);
@@ -3020,6 +3046,11 @@
       outline-style: none;
     }
   }
+  .active\:border-\(--color-error\) {
+    &:active {
+      border-color: var(--color-error);
+    }
+  }
   .active\:border-\(--color-primary\) {
     &:active {
       border-color: var(--color-primary);
@@ -3310,6 +3341,19 @@
   --font-medium: 500;
   --font-semibold: 600;
   --font-bold: 700;
+  --font-family-base:
+    -apple-system,
+    BlinkMacSystemFont,
+    "Segoe UI",
+    "Roboto",
+    "Oxygen",
+    "Ubuntu",
+    "Cantarell",
+    "Fira Sans",
+    "Droid Sans",
+    "Helvetica Neue",
+    sans-serif;
+  --font-family-input: var(--font-family-base);
   --button-padding-xs-x: 0.5rem;
   --button-padding-xs-y: 0.375rem;
   --button-padding-sm-x: 0.75rem;
@@ -3481,6 +3525,29 @@
   --dropdown-option-font-size-xl: 1.25rem;
   --star-size: 1.5rem;
 }
+input,
+textarea,
+select {
+  font-family: var(--font-family-input);
+}
+textarea::-webkit-scrollbar {
+  width: 8px;
+}
+textarea::-webkit-scrollbar-track {
+  background: var(--color-surface);
+  border-radius: 4px;
+}
+textarea::-webkit-scrollbar-thumb {
+  background: var(--color-primary);
+  border-radius: 4px;
+}
+textarea::-webkit-scrollbar-thumb:hover {
+  background: var(--color-primary-hover);
+}
+textarea {
+  scrollbar-width: thin;
+  scrollbar-color: var(--color-primary) var(--color-surface);
+}
 @media (min-width: 1024px) {
   :root {
     --checkbox-label-font-size-xs: var(--typography-caption, 0.6875rem);