@aortl/admin-css 0.14.0 → 0.15.0

package/dist/admin.css

@@ -165,10 +165,13 @@
     --color-border-strong: light-dark(var(--color-base-300), var(--color-base-700));
     --color-code-surface: light-dark(var(--color-base-150), var(--color-base-950));
     --color-code-text: light-dark(var(--color-base-800), var(--color-base-200));
-    --color-primary: light-dark(var(--color-blue-600), var(--color-blue-400));
-    --color-primary-hover: light-dark(var(--color-blue-700), var(--color-blue-300));
-    --color-primary-muted: light-dark(var(--color-blue-50), var(--color-blue-950));
+    --color-primary: light-dark(var(--color-black), var(--color-paper));
+    --color-primary-hover: light-dark(var(--color-base-800), var(--color-base-200));
+    --color-primary-muted: light-dark(var(--color-base-150), var(--color-base-800));
     --color-primary-content: light-dark(var(--color-paper), var(--color-black));
+    --color-link: light-dark(var(--color-blue-600), var(--color-blue-400));
+    --color-link-hover: light-dark(var(--color-blue-700), var(--color-blue-300));
+    --color-focus: light-dark(var(--color-blue-600), var(--color-blue-400));
     --color-system-accent: light-dark(var(--color-base-600), var(--color-base-400));
     --color-system-accent-hover: color-mix(
     in oklch,
@@ -207,9 +210,9 @@
     --color-warning-hover: light-dark(var(--color-yellow-500), var(--color-yellow-300));
     --color-warning-muted: light-dark(var(--color-yellow-50), var(--color-yellow-950));
     --color-warning-content: var(--color-black);
-    --color-info: light-dark(var(--color-cyan-600), var(--color-cyan-400));
-    --color-info-hover: light-dark(var(--color-cyan-700), var(--color-cyan-300));
-    --color-info-muted: light-dark(var(--color-cyan-50), var(--color-cyan-950));
+    --color-info: light-dark(var(--color-blue-600), var(--color-blue-400));
+    --color-info-hover: light-dark(var(--color-blue-700), var(--color-blue-300));
+    --color-info-muted: light-dark(var(--color-blue-50), var(--color-blue-950));
     --color-info-content: light-dark(var(--color-paper), var(--color-black));
   }
 }
@@ -620,7 +623,7 @@
       outline-offset: 2px;
     }
     &:focus-visible {
-      outline-color: var(--color-primary);
+      outline-color: var(--color-focus);
     }
     list-style: none;
   }
@@ -705,39 +708,31 @@
     min-width: 0;
   }
   .alert-info {
-    border-color: var(--color-info-muted);
-    background-color: var(--color-info-muted);
+    border-color: var(--color-info);
+    background-color: var(--color-info);
+    color: var(--color-info-content);
   }
   .alert-success {
-    border-color: var(--color-success-muted);
-    background-color: var(--color-success-muted);
+    border-color: var(--color-success);
+    background-color: var(--color-success);
+    color: var(--color-success-content);
   }
   .alert-warning {
-    border-color: var(--color-warning-muted);
-    background-color: var(--color-warning-muted);
+    border-color: var(--color-warning);
+    background-color: var(--color-warning);
+    color: var(--color-warning-content);
   }
   .alert-danger {
-    border-color: var(--color-danger-muted);
-    background-color: var(--color-danger-muted);
+    border-color: var(--color-danger);
+    background-color: var(--color-danger);
+    color: var(--color-danger-content);
   }
   .alert-title {
     --tw-font-weight: var(--font-weight-medium);
     font-weight: var(--font-weight-medium);
   }
-  .alert-info .alert-title, .alert-info > :is(i, svg):first-child {
-    color: var(--color-info);
-  }
-  .alert-success .alert-title, .alert-success > :is(i, svg):first-child {
-    color: var(--color-success);
-  }
-  .alert-warning .alert-title, .alert-warning > :is(i, svg):first-child {
-    color: var(--color-text);
-  }
-  .alert-danger .alert-title, .alert-danger > :is(i, svg):first-child {
-    color: var(--color-danger);
-  }
   .alert-description {
-    color: var(--color-text-muted);
+    opacity: 0.85;
   }
 }
 @layer components {
@@ -836,24 +831,24 @@
     flex-shrink: 0;
   }
   .badge-info {
-    border-color: var(--color-info-muted);
-    background-color: var(--color-info-muted);
-    color: var(--color-info);
+    border-color: var(--color-info);
+    background-color: var(--color-info);
+    color: var(--color-info-content);
   }
   .badge-success {
-    border-color: var(--color-success-muted);
-    background-color: var(--color-success-muted);
-    color: var(--color-success);
+    border-color: var(--color-success);
+    background-color: var(--color-success);
+    color: var(--color-success-content);
   }
   .badge-warning {
-    border-color: var(--color-warning-muted);
-    background-color: var(--color-warning-muted);
-    color: var(--color-text);
+    border-color: var(--color-warning);
+    background-color: var(--color-warning);
+    color: var(--color-warning-content);
   }
   .badge-danger {
-    border-color: var(--color-danger-muted);
-    background-color: var(--color-danger-muted);
-    color: var(--color-danger);
+    border-color: var(--color-danger);
+    background-color: var(--color-danger);
+    color: var(--color-danger-content);
   }
   .badge-primary {
     background-color: var(--color-primary);
@@ -1069,7 +1064,7 @@
     border-radius: 9999px;
     overflow: hidden;
     background-color: var(--color-surface-strong);
-    color: var(--color-primary);
+    color: var(--color-info);
   }
   .progress::-webkit-progress-bar {
     background-color: var(--color-surface-strong);
@@ -1160,7 +1155,7 @@
       outline-offset: 2px;
     }
     &:focus-visible {
-      outline-color: var(--color-primary);
+      outline-color: var(--color-focus);
     }
   }
   .breadcrumb-item[aria-current="page"] {
@@ -1243,7 +1238,7 @@
       outline-offset: 2px;
     }
     &:focus-visible {
-      outline-color: var(--color-primary);
+      outline-color: var(--color-focus);
     }
     &:disabled {
       pointer-events: none;
@@ -1355,7 +1350,7 @@
       outline-offset: 2px;
     }
     &:focus-visible {
-      outline-color: var(--color-primary);
+      outline-color: var(--color-focus);
     }
     display: none;
     flex-shrink: 0;
@@ -1425,7 +1420,7 @@
       outline-offset: 2px;
     }
     &:focus-visible {
-      outline-color: var(--color-primary);
+      outline-color: var(--color-focus);
     }
     &:disabled {
       pointer-events: none;
@@ -1611,7 +1606,7 @@
     align-items: center;
     gap: calc(var(--spacing) * 1);
     border-radius: var(--radius-sm);
-    color: var(--color-primary);
+    color: var(--color-link);
     text-decoration-line: underline;
     text-underline-offset: 2px;
     transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
@@ -1621,7 +1616,7 @@
     transition-duration: 150ms;
     &:hover {
       @media (hover: hover) {
-        color: var(--color-primary-hover);
+        color: var(--color-link-hover);
       }
     }
     &:focus-visible {
@@ -1632,7 +1627,7 @@
       outline-offset: 2px;
     }
     &:focus-visible {
-      outline-color: var(--color-primary);
+      outline-color: var(--color-focus);
     }
   }
   .link > :is(i, svg) {
@@ -1689,7 +1684,7 @@
       outline-offset: 2px;
     }
     &:focus-visible {
-      outline-color: var(--color-primary);
+      outline-color: var(--color-focus);
     }
     &:disabled {
       cursor: not-allowed;
@@ -1854,7 +1849,7 @@
       outline-offset: 2px;
     }
     &:focus-visible {
-      outline-color: var(--color-primary);
+      outline-color: var(--color-focus);
     }
     &:disabled {
       cursor: not-allowed;
@@ -1966,7 +1961,7 @@
       outline-offset: 2px;
     }
     &:focus-visible {
-      outline-color: var(--color-primary);
+      outline-color: var(--color-focus);
     }
     &:disabled {
       cursor: not-allowed;
@@ -2041,7 +2036,7 @@
       outline-offset: 2px;
     }
     &:focus-visible {
-      outline-color: var(--color-primary);
+      outline-color: var(--color-focus);
     }
     &:disabled {
       cursor: not-allowed;
@@ -2126,7 +2121,7 @@
       outline-offset: 2px;
     }
     &:focus-visible {
-      outline-color: var(--color-primary);
+      outline-color: var(--color-focus);
     }
     &:disabled {
       cursor: not-allowed;
@@ -2240,7 +2235,7 @@
       outline-offset: 2px;
     }
     &:focus-visible {
-      outline-color: var(--color-primary);
+      outline-color: var(--color-focus);
     }
     &:disabled {
       cursor: not-allowed;
@@ -2253,7 +2248,7 @@
     outline-style: var(--tw-outline-style);
     outline-width: 2px;
     outline-offset: 2px;
-    outline-color: var(--color-primary);
+    outline-color: var(--color-focus);
   }
   .select[data-placeholder] {
     color: var(--color-text-muted);
@@ -2405,7 +2400,7 @@
   .card {
     display: flex;
     flex-direction: column;
-    overflow: hidden;
+    overflow: auto;
     border-radius: var(--radius-xl);
     border-style: var(--tw-border-style);
     border-width: 1px;
@@ -2444,6 +2439,9 @@
     align-items: center;
     gap: calc(var(--spacing) * 1);
   }
+  .card-toolbar :is(i, svg) {
+    font-size: 1.25rem;
+  }
   .card-description {
     font-size: var(--text-sm);
     line-height: var(--tw-leading, var(--text-sm--line-height));
@@ -2680,7 +2678,7 @@
       outline-offset: 2px;
     }
     &:focus-visible {
-      outline-color: var(--color-primary);
+      outline-color: var(--color-focus);
     }
   }
 }
@@ -2820,7 +2818,7 @@
       outline-offset: 2px;
     }
     &:focus-visible {
-      outline-color: var(--color-primary);
+      outline-color: var(--color-focus);
     }
     &:disabled {
       cursor: not-allowed;
@@ -2934,7 +2932,7 @@
       outline-offset: 2px;
     }
     &:focus-visible {
-      outline-color: var(--color-primary);
+      outline-color: var(--color-focus);
     }
   }
   .footer-meta {
@@ -2966,7 +2964,7 @@
       outline-offset: 2px;
     }
     &:focus-visible {
-      outline-color: var(--color-primary);
+      outline-color: var(--color-focus);
     }
     list-style: none;
   }
@@ -3177,7 +3175,7 @@
       outline-offset: 2px;
     }
     &:focus-visible {
-      outline-color: var(--color-primary);
+      outline-color: var(--color-focus);
     }
   }
   .navbar-item[aria-current="page"], .navbar-item[data-active] {
@@ -3217,7 +3215,7 @@
       outline-offset: 2px;
     }
     &:focus-visible {
-      outline-color: var(--color-primary);
+      outline-color: var(--color-focus);
     }
   }
   .navbar-mobile-toggle::before {
@@ -3342,7 +3340,7 @@
       outline-offset: 2px;
     }
     &:focus-visible {
-      outline-color: var(--color-primary);
+      outline-color: var(--color-focus);
     }
   }
   .sidebar-item[aria-current="page"], .sidebar-item[data-active] {
@@ -3427,7 +3425,7 @@
       outline-offset: 2px;
     }
     &:focus-visible {
-      outline-color: var(--color-primary);
+      outline-color: var(--color-focus);
     }
     list-style: none;
   }
@@ -3503,7 +3501,7 @@
       outline-offset: 2px;
     }
     &:focus-visible {
-      outline-color: var(--color-primary);
+      outline-color: var(--color-focus);
     }
   }
   .sidebar-subitem[aria-current="page"], .sidebar-subitem[data-active] {
@@ -3555,7 +3553,7 @@
     outline-style: var(--tw-outline-style);
     outline-width: 2px;
     outline-offset: 2px;
-    outline-color: var(--color-primary);
+    outline-color: var(--color-focus);
   }
   .sidebar-collapse-toggle::before {
     content: "";
@@ -3661,7 +3659,7 @@
       outline-offset: 2px;
     }
     &:focus-visible {
-      outline-color: var(--color-primary);
+      outline-color: var(--color-focus);
     }
     &:disabled {
       cursor: not-allowed;
@@ -3693,7 +3691,7 @@
     outline-style: var(--tw-outline-style);
     outline-width: 2px;
     outline-offset: 2px;
-    outline-color: var(--color-primary);
+    outline-color: var(--color-focus);
   }
   .tabs:not(.tabs-boxed) .tab {
     position: relative;
@@ -3898,7 +3896,7 @@
     outline-style: var(--tw-outline-style);
     outline-width: 2px;
     outline-offset: calc(2px * -1);
-    outline-color: var(--color-primary);
+    outline-color: var(--color-focus);
   }
 }
 @layer components {
@@ -4021,7 +4019,7 @@
     --chart-height: 8rem;
     --chart-size: 8rem;
     --chart-gap: 0.25rem;
-    color: var(--color-primary);
+    color: var(--color-info);
   }
   .chart-success {
     color: var(--color-success);