@aortl/admin-css 0.12.1 → 0.13.1

package/dist/admin.css

@@ -607,6 +607,9 @@
   .accordion-summary::-webkit-details-marker {
     display: none;
   }
+  .accordion-summary > :is(i, svg) {
+    flex-shrink: 0;
+  }
   .accordion-summary::after {
     content: "";
     width: 0.5rem;
@@ -807,6 +810,9 @@
     white-space: nowrap;
     color: var(--color-text);
   }
+  .badge > :is(i, svg) {
+    flex-shrink: 0;
+  }
   .badge-info {
     border-color: var(--color-info-muted);
     background-color: var(--color-info-muted);
@@ -1158,6 +1164,9 @@
     width: 0.875rem;
     height: 0.875rem;
   }
+  .breadcrumb-item > :is(i, svg), .breadcrumb-separator > :is(i, svg) {
+    flex-shrink: 0;
+  }
 }
 @layer components {
   .pagination > ol, .pagination > ul {
@@ -1402,6 +1411,9 @@
       opacity: 50%;
     }
   }
+  .btn > :is(i, svg) {
+    flex-shrink: 0;
+  }
   .btn-primary {
     border-color: transparent;
     background-color: var(--color-primary);
@@ -1422,6 +1434,14 @@
       }
     }
   }
+  .btn-muted {
+    background-color: var(--color-surface);
+    &:hover {
+      @media (hover: hover) {
+        background-color: var(--color-surface-muted);
+      }
+    }
+  }
   .btn-danger {
     border-color: transparent;
     background-color: var(--color-danger);
@@ -1548,6 +1568,62 @@
       border-top-color: color-mix(in srgb, currentColor 25%, transparent);
     }
   }
+  .btn-group-full-width:not(.btn-group-vertical) {
+    display: flex;
+    width: 100%;
+  }
+  .btn-group-full-width:not(.btn-group-vertical) > .btn, .btn-group-full-width:not(.btn-group-vertical) > .menu {
+    flex: 1;
+  }
+  .btn-group-full-width.btn-group-vertical {
+    width: 100%;
+  }
+}
+@layer components {
+  .link {
+    display: inline-flex;
+    align-items: center;
+    gap: calc(var(--spacing) * 1);
+    border-radius: var(--radius-sm);
+    color: var(--color-primary);
+    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;
+    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
+    transition-duration: var(--tw-duration, var(--default-transition-duration));
+    --tw-duration: 150ms;
+    transition-duration: 150ms;
+    &:hover {
+      @media (hover: hover) {
+        color: var(--color-primary-hover);
+      }
+    }
+    &:focus-visible {
+      outline-style: var(--tw-outline-style);
+      outline-width: 2px;
+    }
+    &:focus-visible {
+      outline-offset: 2px;
+    }
+    &:focus-visible {
+      outline-color: var(--color-primary);
+    }
+  }
+  .link > :is(i, svg) {
+    flex-shrink: 0;
+  }
+  .link-external {
+    --link-external-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17 7 7 17'/%3E%3Cpath d='M8 7h9v9'/%3E%3C/svg%3E");
+  }
+  .link-external::after {
+    content: "";
+    flex: none;
+    width: 0.85em;
+    height: 0.85em;
+    background-color: currentColor;
+    -webkit-mask: var(--link-external-arrow) center / contain no-repeat;
+    mask: var(--link-external-arrow) center / contain no-repeat;
+  }
 }
 @layer components {
   .input {
@@ -1621,6 +1697,39 @@
       outline-color: var(--color-danger);
     }
   }
+  .input-info {
+    border-color: var(--color-info);
+    &:hover {
+      @media (hover: hover) {
+        border-color: var(--color-info);
+      }
+    }
+    &:focus-visible {
+      outline-color: var(--color-info);
+    }
+  }
+  .input-success {
+    border-color: var(--color-success);
+    &:hover {
+      @media (hover: hover) {
+        border-color: var(--color-success);
+      }
+    }
+    &:focus-visible {
+      outline-color: var(--color-success);
+    }
+  }
+  .input-warning {
+    border-color: var(--color-warning);
+    &:hover {
+      @media (hover: hover) {
+        border-color: var(--color-warning);
+      }
+    }
+    &:focus-visible {
+      outline-color: var(--color-warning);
+    }
+  }
   .input-sm {
     padding-inline: calc(var(--spacing) * 2.5);
     padding-block: calc(var(--spacing) * 1.5);
@@ -1753,6 +1862,43 @@
       outline-color: var(--color-danger);
     }
   }
+  .textarea-info {
+    border-color: var(--color-info);
+    &:hover {
+      @media (hover: hover) {
+        border-color: var(--color-info);
+      }
+    }
+    &:focus-visible {
+      outline-color: var(--color-info);
+    }
+  }
+  .textarea-success {
+    border-color: var(--color-success);
+    &:hover {
+      @media (hover: hover) {
+        border-color: var(--color-success);
+      }
+    }
+    &:focus-visible {
+      outline-color: var(--color-success);
+    }
+  }
+  .textarea-warning {
+    border-color: var(--color-warning);
+    &:hover {
+      @media (hover: hover) {
+        border-color: var(--color-warning);
+      }
+    }
+    &:focus-visible {
+      outline-color: var(--color-warning);
+    }
+  }
+  .textarea-autosize {
+    field-sizing: content;
+    resize: none;
+  }
   .textarea-sm {
     min-height: calc(var(--spacing) * 16);
     padding-inline: calc(var(--spacing) * 2.5);
@@ -2345,6 +2491,9 @@
     font-weight: var(--font-weight-medium);
     color: var(--color-text-muted);
   }
+  .stat-card-label > :is(i, svg) {
+    flex-shrink: 0;
+  }
   .stat-card-value {
     font-size: var(--text-2xl);
     line-height: var(--tw-leading, var(--text-2xl--line-height));
@@ -2913,6 +3062,9 @@
     cursor: not-allowed;
     opacity: 50%;
   }
+  .menu-trigger > :is(i, svg), .menu-item > :is(i, svg) {
+    flex-shrink: 0;
+  }
   .menu-separator {
     margin-block: calc(var(--spacing) * 1);
     height: 1px;
@@ -3006,6 +3158,9 @@
     background-color: var(--color-primary-muted);
     color: var(--color-primary);
   }
+  .navbar-brand > :is(i, svg), .navbar-item > :is(i, svg) {
+    flex-shrink: 0;
+  }
   .navbar-actions {
     margin-left: auto;
     display: flex;
@@ -3492,6 +3647,9 @@
   .tabs .tab[data-selected], .tabs .tab[aria-selected="true"] {
     color: var(--color-text);
   }
+  .tabs .tab > :is(i, svg) {
+    flex-shrink: 0;
+  }
   .tabs .tab-input {
     position: absolute;
     width: 1px;