@diwauhris/ui 1.4.4 → 1.6.0

package/lib/assets/ui.css

@@ -290,6 +290,11 @@
   inset: 0px;
 }
 
+.inset-x-0 {
+  left: 0px;
+  right: 0px;
+}
+
 .inset-x-2 {
   left: 0.5rem;
   right: 0.5rem;
@@ -876,6 +881,10 @@
   min-height: 210mm;
 }
 
+.min-h-\[220px\] {
+  min-height: 220px;
+}
+
 .min-h-\[240px\] {
   min-height: 240px;
 }
@@ -884,6 +893,14 @@
   min-height: 24px;
 }
 
+.min-h-\[260px\] {
+  min-height: 260px;
+}
+
+.min-h-\[280px\] {
+  min-height: 280px;
+}
+
 .min-h-\[2rem\] {
   min-height: 2rem;
 }
@@ -892,10 +909,26 @@
   min-height: 300px;
 }
 
+.min-h-\[320px\] {
+  min-height: 320px;
+}
+
 .min-h-\[32px\] {
   min-height: 32px;
 }
 
+.min-h-\[360px\] {
+  min-height: 360px;
+}
+
+.min-h-\[40px\] {
+  min-height: 40px;
+}
+
+.min-h-\[44px\] {
+  min-height: 44px;
+}
+
 .min-h-\[48px\] {
   min-height: 48px;
 }
@@ -1126,6 +1159,10 @@
   min-width: 1.5rem;
 }
 
+.min-w-\[100px\] {
+  min-width: 100px;
+}
+
 .min-w-\[110px\] {
   min-width: 110px;
 }
@@ -1561,10 +1598,6 @@
   justify-content: space-between;
 }
 
-.justify-around {
-  justify-content: space-around;
-}
-
 .gap-0 {
   gap: 0px;
 }
@@ -1779,10 +1812,18 @@
   align-self: stretch;
 }
 
+.overflow-auto {
+  overflow: auto;
+}
+
 .overflow-hidden {
   overflow: hidden;
 }
 
+.overflow-visible {
+  overflow: visible;
+}
+
 .overflow-x-auto {
   overflow-x: auto;
 }
@@ -1872,6 +1913,11 @@
   border-bottom-right-radius: 0.75rem;
 }
 
+.rounded-t-2xl {
+  border-top-left-radius: 1rem;
+  border-top-right-radius: 1rem;
+}
+
 .rounded-t-xl {
   border-top-left-radius: 0.75rem;
   border-top-right-radius: 0.75rem;
@@ -2019,6 +2065,11 @@
   border-color: rgb(251 191 36 / var(--tw-border-opacity, 1));
 }
 
+.border-amber-500 {
+  --tw-border-opacity: 1;
+  border-color: rgb(245 158 11 / var(--tw-border-opacity, 1));
+}
+
 .border-black {
   --tw-border-opacity: 1;
   border-color: rgb(0 0 0 / var(--tw-border-opacity, 1));
@@ -2036,6 +2087,16 @@
   border-color: rgb(0 0 0 / 0.5);
 }
 
+.border-blue-600 {
+  --tw-border-opacity: 1;
+  border-color: rgb(37 99 235 / var(--tw-border-opacity, 1));
+}
+
+.border-blue-700 {
+  --tw-border-opacity: 1;
+  border-color: rgb(29 78 216 / var(--tw-border-opacity, 1));
+}
+
 .border-brand-blue {
   --tw-border-opacity: 1;
   border-color: rgb(3 78 162 / var(--tw-border-opacity, 1));
@@ -2094,6 +2155,11 @@
   border-color: currentColor;
 }
 
+.border-cyan-600 {
+  --tw-border-opacity: 1;
+  border-color: rgb(8 145 178 / var(--tw-border-opacity, 1));
+}
+
 .border-emerald-100 {
   --tw-border-opacity: 1;
   border-color: rgb(209 250 229 / var(--tw-border-opacity, 1));
@@ -2124,6 +2190,11 @@
   border-color: rgb(5 150 105 / var(--tw-border-opacity, 1));
 }
 
+.border-orange-200 {
+  --tw-border-opacity: 1;
+  border-color: rgb(254 215 170 / var(--tw-border-opacity, 1));
+}
+
 .border-rose-100 {
   --tw-border-opacity: 1;
   border-color: rgb(255 228 230 / var(--tw-border-opacity, 1));
@@ -2149,6 +2220,11 @@
   border-color: rgb(244 63 94 / var(--tw-border-opacity, 1));
 }
 
+.border-rose-600 {
+  --tw-border-opacity: 1;
+  border-color: rgb(225 29 72 / var(--tw-border-opacity, 1));
+}
+
 .border-rose-800 {
   --tw-border-opacity: 1;
   border-color: rgb(159 18 57 / var(--tw-border-opacity, 1));
@@ -2212,10 +2288,6 @@
   border-color: rgb(51 65 85 / var(--tw-border-opacity, 1));
 }
 
-.border-slate-700\/30 {
-  border-color: rgb(51 65 85 / 0.3);
-}
-
 .border-slate-700\/60 {
   border-color: rgb(51 65 85 / 0.6);
 }
@@ -2407,6 +2479,16 @@
   background-color: rgb(239 246 255 / 0.6);
 }
 
+.bg-blue-500 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(59 130 246 / var(--tw-bg-opacity, 1));
+}
+
+.bg-blue-600 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(37 99 235 / var(--tw-bg-opacity, 1));
+}
+
 .bg-brand-blue {
   --tw-bg-opacity: 1;
   background-color: rgb(3 78 162 / var(--tw-bg-opacity, 1));
@@ -2420,6 +2502,10 @@
   background-color: rgb(3 78 162 / 0.15);
 }
 
+.bg-brand-blue\/20 {
+  background-color: rgb(3 78 162 / 0.2);
+}
+
 .bg-brand-blue\/50 {
   background-color: rgb(3 78 162 / 0.5);
 }
@@ -2437,14 +2523,6 @@
   background-color: rgb(0 55 123 / var(--tw-bg-opacity, 1));
 }
 
-.bg-brand-navy\/15 {
-  background-color: rgb(0 55 123 / 0.15);
-}
-
-.bg-brand-navy\/35 {
-  background-color: rgb(0 55 123 / 0.35);
-}
-
 .bg-brand-navy\/40 {
   background-color: rgb(0 55 123 / 0.4);
 }
@@ -2453,10 +2531,6 @@
   background-color: rgb(0 55 123 / 0.5);
 }
 
-.bg-brand-navy\/65 {
-  background-color: rgb(0 55 123 / 0.65);
-}
-
 .bg-brand-navy\/\[0\.03\] {
   background-color: rgb(0 55 123 / 0.03);
 }
@@ -2465,10 +2539,6 @@
   background-color: rgb(0 55 123 / 0.06);
 }
 
-.bg-brand-navy\/\[0\.08\] {
-  background-color: rgb(0 55 123 / 0.08);
-}
-
 .bg-brand-sky {
   --tw-bg-opacity: 1;
   background-color: rgb(45 138 202 / var(--tw-bg-opacity, 1));
@@ -2490,10 +2560,6 @@
   background-color: rgb(45 138 202 / 0.3);
 }
 
-.bg-brand-sky\/40 {
-  background-color: rgb(45 138 202 / 0.4);
-}
-
 .bg-brand-sky\/5 {
   background-color: rgb(45 138 202 / 0.05);
 }
@@ -2506,22 +2572,18 @@
   background-color: rgb(45 138 202 / 0.6);
 }
 
-.bg-brand-sky\/70 {
-  background-color: rgb(45 138 202 / 0.7);
-}
-
 .bg-brand-sky\/\[0\.04\] {
   background-color: rgb(45 138 202 / 0.04);
 }
 
-.bg-cyan-100 {
+.bg-cyan-200 {
   --tw-bg-opacity: 1;
-  background-color: rgb(207 250 254 / var(--tw-bg-opacity, 1));
+  background-color: rgb(165 243 252 / var(--tw-bg-opacity, 1));
 }
 
-.bg-cyan-300 {
+.bg-cyan-400 {
   --tw-bg-opacity: 1;
-  background-color: rgb(103 232 249 / var(--tw-bg-opacity, 1));
+  background-color: rgb(34 211 238 / var(--tw-bg-opacity, 1));
 }
 
 .bg-cyan-500 {
@@ -2529,9 +2591,14 @@
   background-color: rgb(6 182 212 / var(--tw-bg-opacity, 1));
 }
 
-.bg-cyan-700 {
+.bg-cyan-600 {
   --tw-bg-opacity: 1;
-  background-color: rgb(14 116 144 / var(--tw-bg-opacity, 1));
+  background-color: rgb(8 145 178 / var(--tw-bg-opacity, 1));
+}
+
+.bg-cyan-800 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(21 94 117 / var(--tw-bg-opacity, 1));
 }
 
 .bg-emerald-100 {
@@ -2586,24 +2653,29 @@
   background-color: rgb(129 140 248 / var(--tw-bg-opacity, 1));
 }
 
-.bg-orange-100 {
+.bg-orange-200 {
   --tw-bg-opacity: 1;
-  background-color: rgb(255 237 213 / var(--tw-bg-opacity, 1));
+  background-color: rgb(254 215 170 / var(--tw-bg-opacity, 1));
 }
 
-.bg-orange-300 {
+.bg-orange-400 {
   --tw-bg-opacity: 1;
-  background-color: rgb(253 186 116 / var(--tw-bg-opacity, 1));
+  background-color: rgb(251 146 60 / var(--tw-bg-opacity, 1));
 }
 
-.bg-orange-400 {
+.bg-orange-50 {
   --tw-bg-opacity: 1;
-  background-color: rgb(251 146 60 / var(--tw-bg-opacity, 1));
+  background-color: rgb(255 247 237 / var(--tw-bg-opacity, 1));
 }
 
-.bg-orange-600 {
+.bg-orange-500 {
   --tw-bg-opacity: 1;
-  background-color: rgb(234 88 12 / var(--tw-bg-opacity, 1));
+  background-color: rgb(249 115 22 / var(--tw-bg-opacity, 1));
+}
+
+.bg-orange-700 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(194 65 12 / var(--tw-bg-opacity, 1));
 }
 
 .bg-rose-100 {
@@ -2657,6 +2729,11 @@
   background-color: rgb(224 242 254 / var(--tw-bg-opacity, 1));
 }
 
+.bg-sky-200 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(186 230 253 / var(--tw-bg-opacity, 1));
+}
+
 .bg-sky-400 {
   --tw-bg-opacity: 1;
   background-color: rgb(56 189 248 / var(--tw-bg-opacity, 1));
@@ -2815,10 +2892,6 @@
   --tw-gradient-to: #034EA2 var(--tw-gradient-to-position);
 }
 
-.fill-slate-500 {
-  fill: #64748b;
-}
-
 .object-contain {
   -o-object-fit: contain;
      object-fit: contain;
@@ -2857,6 +2930,10 @@
   padding: 0.5rem;
 }
 
+.p-2\.5 {
+  padding: 0.625rem;
+}
+
 .p-3 {
   padding: 0.75rem;
 }
@@ -3563,6 +3640,11 @@
   color: rgb(67 56 202 / var(--tw-text-opacity, 1));
 }
 
+.text-orange-600 {
+  --tw-text-opacity: 1;
+  color: rgb(234 88 12 / var(--tw-text-opacity, 1));
+}
+
 .text-rose-300\/60 {
   color: rgb(253 164 175 / 0.6);
 }
@@ -3852,6 +3934,22 @@
   outline-style: solid;
 }
 
+.outline-2 {
+  outline-width: 2px;
+}
+
+.outline-offset-2 {
+  outline-offset: 2px;
+}
+
+.outline-emerald-400 {
+  outline-color: #34d399;
+}
+
+.outline-rose-400 {
+  outline-color: #fb7185;
+}
+
 .ring {
   --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
   --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(3px + var(--tw-ring-offset-width)) var(--tw-ring-color);
@@ -4080,15 +4178,17 @@ body {
 @keyframes osSlideUp { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: translateY(0); } }
 @keyframes osSlideInRight { from { opacity: 0; transform: translateX(24px); } to { opacity: 1; transform: translateX(0); } }
 @keyframes osBounceIn { 0% { opacity: 0; transform: scale(0.85); } 60% { transform: scale(1.06); } 80% { transform: scale(0.97); } 100% { opacity: 1; transform: scale(1); } }
+@keyframes osBarIn   { from { opacity: 0; transform: scaleX(0); } to { opacity: 1; transform: scaleX(1); } }
 
 .os-fade           { animation: osFade        0.16s ease-out; }
 .os-pop            { animation: osPop         0.2s  cubic-bezier(0.16, 1, 0.3, 1); }
 .os-slide-up       { animation: osSlideUp     0.22s cubic-bezier(0.16, 1, 0.3, 1); }
 .os-slide-in-right { animation: osSlideInRight 0.22s cubic-bezier(0.16, 1, 0.3, 1); }
 .os-bounce-in      { animation: osBounceIn    0.35s cubic-bezier(0.34, 1.56, 0.64, 1); }
+.os-bar-in         { animation: osBarIn       0.22s cubic-bezier(0.16, 1, 0.3, 1) both; transform-origin: left; }
 
 @media (prefers-reduced-motion: reduce) {
-  .os-fade, .os-pop, .os-slide-up, .os-slide-in-right, .os-bounce-in { animation: none; }
+  .os-fade, .os-pop, .os-slide-up, .os-slide-in-right, .os-bounce-in, .os-bar-in { animation: none; }
 }
 
 /* ── Skeleton shimmer ────────────────────────────────────────────────────── */
@@ -4511,6 +4611,9 @@ body {
   --tw-bg-opacity: 1;
   background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
 }
+.hover\:bg-white\/10:hover {
+  background-color: rgb(255 255 255 / 0.1);
+}
 .hover\:bg-white\/20:hover {
   background-color: rgb(255 255 255 / 0.2);
 }
@@ -4920,6 +5023,9 @@ body {
   .sm\:grid-cols-4 {
     grid-template-columns: repeat(4, minmax(0, 1fr));
   }
+  .sm\:grid-cols-5 {
+    grid-template-columns: repeat(5, minmax(0, 1fr));
+  }
   .sm\:grid-cols-6 {
     grid-template-columns: repeat(6, minmax(0, 1fr));
   }
@@ -4948,15 +5054,34 @@ body {
   }
 }
 @media (min-width: 768px) {
+  .md\:relative {
+    position: relative;
+  }
+  .md\:inset-auto {
+    inset: auto;
+  }
+  .md\:mx-auto {
+    margin-left: auto;
+    margin-right: auto;
+  }
+  .md\:block {
+    display: block;
+  }
   .md\:flex {
     display: flex;
   }
+  .md\:hidden {
+    display: none;
+  }
   .md\:w-56 {
     width: 14rem;
   }
   .md\:w-80 {
     width: 20rem;
   }
+  .md\:w-96 {
+    width: 24rem;
+  }
   .md\:grid-cols-2 {
     grid-template-columns: repeat(2, minmax(0, 1fr));
   }
@@ -4981,6 +5106,9 @@ body {
   .md\:self-auto {
     align-self: auto;
   }
+  .md\:rounded-2xl {
+    border-radius: 1rem;
+  }
   .md\:p-6 {
     padding: 1.5rem;
   }
@@ -4991,6 +5119,14 @@ body {
   .md\:pt-4 {
     padding-top: 1rem;
   }
+  .md\:text-3xl {
+    font-size: 1.875rem;
+    line-height: 2.25rem;
+  }
+  .md\:text-xl {
+    font-size: 1.25rem;
+    line-height: 1.75rem;
+  }
 }
 @media (min-width: 1024px) {
   .lg\:col-span-2 {
@@ -5024,6 +5160,14 @@ body {
     padding-left: 3rem;
     padding-right: 3rem;
   }
+  .lg\:px-8 {
+    padding-left: 2rem;
+    padding-right: 2rem;
+  }
+  .lg\:text-4xl {
+    font-size: 2.25rem;
+    line-height: 2.5rem;
+  }
 }
 @media (min-width: 1280px) {
   .xl\:grid-cols-4 {