arekui 1.0.2 → 2.0.0

package/src/base/brutalist-overrides.css

@@ -0,0 +1,254 @@
+html[data-theme="brutalist"] body {
+ font-family: var(--ar-font-mono);
+}
+
+html[data-theme="brutalist"] .ar-btn {
+ font-family: var(--ar-font-mono);
+ font-weight: 700;
+ text-transform: uppercase;
+ letter-spacing: 0.05em;
+ border-color: var(--ar-brutalist-border-color);
+ transition: all 0.1s linear;
+}
+
+html[data-theme="brutalist"] .ar-btn:hover {
+ background: var(--ar-base-content);
+ color: var(--ar-base-100);
+}
+html[data-theme="brutalist"] .ar-btn:active {
+ transform: none;
+}
+html[data-theme="brutalist"] .ar-btn-primary:hover,
+html[data-theme="brutalist"] .ar-btn-neutral:hover {
+ background: var(--ar-base-100);
+ color: var(--ar-base-content);
+}
+html[data-theme="brutalist"] .ar-btn-ghost {
+ border-color: transparent;
+}
+html[data-theme="brutalist"] .ar-btn-ghost:hover {
+ border-color: transparent;
+ background: var(--ar-base-200);
+ color: var(--ar-base-content);
+}
+
+html[data-theme="brutalist"] .ar-card,
+html[data-theme="brutalist"] .ar-modal-box,
+html[data-theme="brutalist"] .ar-dropdown-content,
+html[data-theme="brutalist"] .ar-popover-content,
+html[data-theme="brutalist"] .ar-toast,
+html[data-theme="brutalist"] .ar-carousel-btn,
+html[data-theme="brutalist"] .ar-scroll-top {
+ border: var(--ar-border-width) solid var(--ar-brutalist-border-color);
+ border-radius: 0;
+}
+
+html[data-theme="brutalist"] .ar-scroll-top:hover {
+ background: var(--ar-base-100);
+ color: var(--ar-base-content);
+ transform: none;
+}
+
+html[data-theme="brutalist"] .ar-alert {
+ border: var(--ar-border-width) solid var(--ar-brutalist-border-color);
+ border-radius: 0;
+}
+
+html[data-theme="brutalist"] .ar-badge,
+html[data-theme="brutalist"] .ar-tag {
+ border: var(--ar-border-width) solid var(--ar-brutalist-border-color);
+ font-weight: 700;
+ text-transform: uppercase;
+ letter-spacing: 0.05em;
+}
+
+html[data-theme="brutalist"] .ar-table th,
+html[data-theme="brutalist"] .ar-table td {
+ border-bottom: var(--ar-border-width) solid var(--ar-brutalist-border-color);
+}
+html[data-theme="brutalist"] .ar-table th {
+ text-transform: uppercase;
+ letter-spacing: 0.05em;
+}
+
+html[data-theme="brutalist"] .ar-tabs {
+ border-bottom: var(--ar-border-width) solid var(--ar-brutalist-border-color);
+}
+html[data-theme="brutalist"] .ar-tab {
+ font-family: var(--ar-font-mono);
+ font-weight: 700;
+ text-transform: uppercase;
+ letter-spacing: 0.05em;
+}
+
+html[data-theme="brutalist"] .ar-accordion {
+ border-color: var(--ar-brutalist-border-color);
+}
+html[data-theme="brutalist"] .ar-accordion details {
+ border-top-color: var(--ar-brutalist-border-color);
+}
+
+html[data-theme="brutalist"] .ar-progress {
+ border: var(--ar-border-width) solid var(--ar-brutalist-border-color);
+}
+
+html[data-theme="brutalist"] .ar-input,
+html[data-theme="brutalist"] .ar-select,
+html[data-theme="brutalist"] .ar-textarea {
+ border-color: var(--ar-brutalist-border-color);
+ font-family: var(--ar-font-mono);
+ transition: border-color 0.1s linear;
+}
+html[data-theme="brutalist"] .ar-input:focus,
+html[data-theme="brutalist"] .ar-select:focus,
+html[data-theme="brutalist"] .ar-textarea:focus {
+ border-color: var(--ar-brutalist-border-color);
+}
+html[data-theme="brutalist"] .ar-toggle {
+ border: var(--ar-border-width) solid var(--ar-brutalist-border-color);
+ background: var(--ar-base-200);
+}
+html[data-theme="brutalist"] .ar-toggle::after {
+ background: var(--ar-base-content);
+}
+html[data-theme="brutalist"] .ar-toggle:checked::after {
+ background: var(--ar-base-100);
+}
+
+html[data-theme="brutalist"] .ar-file-upload {
+ border: var(--ar-border-width) dashed var(--ar-brutalist-border-color);
+}
+html[data-theme="brutalist"] .ar-file-upload:hover,
+html[data-theme="brutalist"] .ar-file-upload.ar-file-upload-dragover {
+ border-style: solid;
+ background: var(--ar-base-300);
+ color: var(--ar-base-content);
+}
+
+html[data-theme="brutalist"] .ar-page-item {
+ border-color: var(--ar-brutalist-border-color);
+ font-family: var(--ar-font-mono);
+ font-weight: 700;
+ text-transform: uppercase;
+ letter-spacing: 0.05em;
+ transition: all 0.1s linear;
+}
+
+html[data-theme="brutalist"] .ar-step::before {
+ border: var(--ar-border-width) solid var(--ar-brutalist-border-color);
+ background: var(--ar-base-100);
+}
+html[data-theme="brutalist"] .ar-step-active::before {
+ background: var(--ar-primary);
+ color: var(--ar-primary-content);
+}
+
+html[data-theme="brutalist"] .ar-navbar {
+ border-bottom: var(--ar-border-width) solid var(--ar-brutalist-border-color);
+ background: var(--ar-base-100);
+}
+
+html[data-theme="brutalist"] .ar-sidebar-panel > .ar-menu {
+ border-right: var(--ar-border-width) solid var(--ar-brutalist-border-color);
+ background: var(--ar-base-100);
+}
+html[data-theme="brutalist"] .ar-sidebar-panel-end > .ar-menu {
+ border-right: 0;
+ border-left: var(--ar-border-width) solid var(--ar-brutalist-border-color);
+}
+html[data-theme="brutalist"] .ar-sidebar-nav {
+ border-bottom: var(--ar-border-width) solid var(--ar-brutalist-border-color);
+ background: var(--ar-base-100);
+}
+
+html[data-theme="brutalist"] .ar-footer {
+ border-top: var(--ar-border-width) solid var(--ar-brutalist-border-color);
+ background: var(--ar-base-200);
+}
+
+html[data-theme="brutalist"] .ar-hero {
+ background: var(--ar-base-200);
+ border-bottom: var(--ar-border-width) solid var(--ar-brutalist-border-color);
+}
+
+html[data-theme="brutalist"] .ar-skeleton {
+ border: var(--ar-border-width) solid var(--ar-brutalist-border-color);
+}
+
+html[data-theme="brutalist"] .ar-breadcrumb-item:not(:last-child)::after {
+ color: var(--ar-gray-600);
+}
+
+html[data-theme="brutalist"] .ar-chat-bubble {
+ border: var(--ar-border-width) solid var(--ar-brutalist-border-color);
+}
+
+html[data-theme="brutalist"] .ar-tooltip[data-tip]::after {
+ border: var(--ar-border-width) solid var(--ar-brutalist-border-color);
+}
+
+html[data-theme="brutalist"] .ar-prose pre,
+html[data-theme="brutalist"] .ar-prose code {
+ border: var(--ar-border-width) solid var(--ar-brutalist-border-color);
+}
+html[data-theme="brutalist"] .ar-prose th,
+html[data-theme="brutalist"] .ar-prose td,
+html[data-theme="brutalist"] .ar-prose hr {
+ border-color: var(--ar-brutalist-border-color);
+}
+html[data-theme="brutalist"] .ar-prose blockquote {
+ border-left-color: var(--ar-brutalist-border-color);
+}
+
+html[data-theme="brutalist"] .ar-heading-title {
+ text-transform: uppercase;
+ letter-spacing: 0;
+}
+
+html[data-theme="brutalist"] .ar-divider::before,
+html[data-theme="brutalist"] .ar-divider::after {
+ background: var(--ar-brutalist-border-color);
+}
+
+html[data-theme="brutalist"] .ar-timeline-item::after {
+ background: var(--ar-brutalist-border-color);
+}
+
+html[data-theme="brutalist"] .ar-empty-title {
+ text-transform: uppercase;
+ letter-spacing: 0;
+}
+html[data-theme="brutalist"] .ar-empty-icon {
+ border: var(--ar-border-width) solid var(--ar-brutalist-border-color);
+}
+html[data-theme="brutalist"] .ar-segmented {
+ border: var(--ar-border-width) solid var(--ar-brutalist-border-color);
+}
+html[data-theme="brutalist"] .ar-segmented-item {
+ font-family: var(--ar-font-mono);
+ font-weight: 700;
+ text-transform: uppercase;
+ letter-spacing: 0.05em;
+}
+html[data-theme="brutalist"] .ar-kbd {
+ border-color: var(--ar-brutalist-border-color);
+ font-weight: 700;
+ text-transform: uppercase;
+ letter-spacing: 0.05em;
+}
+html[data-theme="brutalist"] .ar-dt {
+ font-weight: 700;
+ text-transform: uppercase;
+ letter-spacing: 0.05em;
+}
+@media (min-width: 480px) {
+ html[data-theme="brutalist"] .ar-dt {
+  border-bottom-color: var(--ar-brutalist-border-color);
+ }
+}
+html[data-theme="brutalist"] .ar-dd {
+ border-bottom-color: var(--ar-brutalist-border-color);
+}
+html[data-theme="brutalist"] .ar-dl > :nth-last-child(-n + 2) {
+ border-bottom: 0;
+}

package/src/base/neo-overrides.css

@@ -1,9 +1,8 @@
-/* NEOBRUTALISM OVERRIDES */
+/* NEOBRUTALISM OVERRIDES */
 html[data-theme="neo"] body {
  font-family: var(--ar-font-sans);
 }
 
-/* --- Buttons (neo) --- */
 html[data-theme="neo"] .ar-btn {
  border: var(--ar-neo-border-width) solid var(--ar-neo-border-color);
  border-radius: 0.75rem;
@@ -55,7 +54,6 @@ html[data-theme="neo"] .ar-btn-circle {
  border-radius: var(--ar-radius-pill);
 }
 
-/* --- Card (neo) --- */
 html[data-theme="neo"] .ar-card {
  border: var(--ar-neo-border-width) solid var(--ar-neo-border-color);
  border-radius: 1rem;
@@ -63,7 +61,6 @@ html[data-theme="neo"] .ar-card {
  overflow: hidden;
 }
 
-/* --- Badge (neo) --- */
 html[data-theme="neo"] .ar-badge {
  border: 2px solid var(--ar-neo-border-color);
  border-radius: var(--ar-radius-pill);
@@ -71,14 +68,12 @@ html[data-theme="neo"] .ar-badge {
  font-weight: 700;
 }
 
-/* --- Modal (neo) --- */
 html[data-theme="neo"] .ar-modal-box {
  border: var(--ar-neo-border-width) solid var(--ar-neo-border-color);
  border-radius: 1rem;
  box-shadow: var(--ar-neo-shadow-xl);
 }
 
-/* --- Alert (neo) --- */
 html[data-theme="neo"] .ar-alert {
  border: var(--ar-neo-border-width) solid var(--ar-neo-border-color);
  border-radius: 0.75rem;
@@ -86,7 +81,6 @@ html[data-theme="neo"] .ar-alert {
  font-weight: 600;
 }
 
-/* --- Table (neo) --- */
 html[data-theme="neo"] .ar-table th,
 html[data-theme="neo"] .ar-table td {
  border: 2px solid var(--ar-neo-border-color);
@@ -96,7 +90,6 @@ html[data-theme="neo"] .ar-table th {
  font-weight: 700;
 }
 
-/* --- Tabs (neo) --- */
 html[data-theme="neo"] .ar-tabs {
  border-bottom: var(--ar-neo-border-width) solid var(--ar-neo-border-color);
 }
@@ -113,7 +106,6 @@ html[data-theme="neo"] .ar-tab-active {
  color: var(--ar-neo-primary);
 }
 
-/* --- Accordion (neo) --- */
 html[data-theme="neo"] .ar-accordion {
  border: var(--ar-neo-border-width) solid var(--ar-neo-border-color);
  border-radius: 0.75rem;
@@ -126,7 +118,6 @@ html[data-theme="neo"] .ar-accordion details:first-child {
  border-top: 0;
 }
 
-/* --- Progress (neo) --- */
 html[data-theme="neo"] .ar-progress {
  border: 2px solid var(--ar-neo-border-color);
  border-radius: var(--ar-radius-pill);
@@ -136,7 +127,6 @@ html[data-theme="neo"] .ar-progress::-webkit-progress-value {
  background: var(--ar-neo-primary);
 }
 
-/* --- Toast (neo) --- */
 html[data-theme="neo"] .ar-toast {
  border: var(--ar-neo-border-width) solid var(--ar-neo-border-color);
  border-radius: 0.75rem;
@@ -144,7 +134,6 @@ html[data-theme="neo"] .ar-toast {
  font-weight: 600;
 }
 
-/* --- Tag (neo) --- */
 html[data-theme="neo"] .ar-tag {
  border: 2px solid var(--ar-neo-border-color);
  border-radius: var(--ar-radius-pill);
@@ -152,7 +141,6 @@ html[data-theme="neo"] .ar-tag {
  font-weight: 600;
 }
 
-/* --- Chat bubble (neo) --- */
 html[data-theme="neo"] .ar-chat-bubble {
  border: var(--ar-neo-border-width) solid var(--ar-neo-border-color);
  border-radius: 1rem;
@@ -164,21 +152,18 @@ html[data-theme="neo"] .ar-chat-end .ar-chat-bubble {
  border-color: var(--ar-neo-border-color);
 }
 
-/* --- Dropdown (neo) --- */
 html[data-theme="neo"] .ar-dropdown-content {
  border: var(--ar-neo-border-width) solid var(--ar-neo-border-color);
  border-radius: 0.75rem;
  box-shadow: var(--ar-neo-shadow-lg);
 }
 
-/* --- Popover (neo) --- */
 html[data-theme="neo"] .ar-popover-content {
  border: var(--ar-neo-border-width) solid var(--ar-neo-border-color);
  border-radius: 0.75rem;
  box-shadow: var(--ar-neo-shadow-lg);
 }
 
-/* --- Tooltip (neo) --- */
 html[data-theme="neo"] .ar-tooltip[data-tip]::after {
  border: 2px solid var(--ar-neo-border-color);
  border-radius: 0.5rem;
@@ -186,7 +171,6 @@ html[data-theme="neo"] .ar-tooltip[data-tip]::after {
  font-weight: 600;
 }
 
-/* --- Forms (neo) --- */
 html[data-theme="neo"] .ar-input,
 html[data-theme="neo"] .ar-select,
 html[data-theme="neo"] .ar-textarea {
@@ -206,13 +190,20 @@ html[data-theme="neo"] .ar-textarea:focus {
  outline: 0;
 }
 
-/* --- Toggle (neo) --- */
 html[data-theme="neo"] .ar-toggle {
- border: 2px solid var(--ar-neo-border-color);
+ border: var(--ar-neo-border-width) solid var(--ar-neo-border-color);
  border-radius: var(--ar-radius-pill);
+ box-shadow: var(--ar-neo-shadow-sm);
+ transition: background 0.15s ease-out;
+}
+html[data-theme="neo"] .ar-toggle::after {
+ top: 0.125rem;
+ left: 0.125rem;
+ width: 0.875rem;
+ height: 0.875rem;
+ transition: transform 0.15s ease-out;
 }
 
-/* --- Pagination (neo) --- */
 html[data-theme="neo"] .ar-page-item {
  border: 2px solid var(--ar-neo-border-color);
  border-radius: 0.5rem;
@@ -232,29 +223,24 @@ html[data-theme="neo"] .ar-page-active {
  border-color: var(--ar-neo-border-color);
 }
 
-/* --- Stepper (neo) --- */
 html[data-theme="neo"] .ar-step::before {
  border: 2px solid var(--ar-neo-border-color);
  box-shadow: 2px 2px 0px 0px var(--ar-neo-border-color);
 }
 
-/* --- Navbar (neo) --- */
 html[data-theme="neo"] .ar-navbar {
  border-bottom: var(--ar-neo-border-width) solid var(--ar-neo-border-color);
  background: var(--ar-neo-base-100);
 }
 
-/* --- Footer (neo) --- */
 html[data-theme="neo"] .ar-footer {
  border-top: var(--ar-neo-border-width) solid var(--ar-neo-border-color);
 }
 
-/* --- Hero (neo) --- */
 html[data-theme="neo"] .ar-hero {
  background: var(--ar-neo-base-200);
 }
 
-/* --- Scroll to top (neo) --- */
 html[data-theme="neo"] .ar-scroll-top {
  border: var(--ar-neo-border-width) solid var(--ar-neo-border-color);
  border-radius: var(--ar-radius-pill);
@@ -265,22 +251,22 @@ html[data-theme="neo"] .ar-scroll-top:hover {
  transform: translate(2px, 2px);
 }
 
-/* --- Drawer (neo) --- */
-html[data-theme="neo"] .ar-drawer-side .ar-menu {
+html[data-theme="neo"] .ar-sidebar-panel > .ar-menu {
  border-right: var(--ar-neo-border-width) solid var(--ar-neo-border-color);
 }
+html[data-theme="neo"] .ar-sidebar-panel-end > .ar-menu {
+ border-right: 0;
+ border-left: var(--ar-neo-border-width) solid var(--ar-neo-border-color);
+}
 
-/* --- Skeleton (neo) --- */
 html[data-theme="neo"] .ar-skeleton {
  border: 2px solid var(--ar-neo-border-color);
 }
 
-/* --- Breadcrumb (neo) --- */
 html[data-theme="neo"] .ar-breadcrumb-item:not(:last-child)::after {
  color: var(--ar-neo-gray-400);
 }
 
-/* --- File upload (neo) --- */
 html[data-theme="neo"] .ar-file-upload {
  border: 3px dashed var(--ar-neo-border-color);
  border-radius: 0.75rem;
@@ -297,7 +283,6 @@ html[data-theme="neo"] .ar-file-upload.ar-file-upload-dragover {
  transform: scale(1.02);
 }
 
-/* --- Prose (neo) --- */
 html[data-theme="neo"] .ar-prose pre {
  border: 2px solid var(--ar-neo-border-color);
  border-radius: 0.75rem;
@@ -315,3 +300,33 @@ html[data-theme="neo"] .ar-prose td {
 html[data-theme="neo"] .ar-prose blockquote {
  border-left: 4px solid var(--ar-neo-primary);
 }
+
+html[data-theme="neo"] .ar-empty-icon {
+ border: var(--ar-neo-border-width) solid var(--ar-neo-border-color);
+ box-shadow: var(--ar-neo-shadow-sm);
+}
+html[data-theme="neo"] .ar-segmented {
+ border: var(--ar-neo-border-width) solid var(--ar-neo-border-color);
+ box-shadow: var(--ar-neo-shadow-sm);
+}
+html[data-theme="neo"] .ar-segmented-item {
+ border: var(--ar-neo-border-width) solid transparent;
+}
+html[data-theme="neo"] .ar-segmented-input:checked + .ar-segmented-item {
+ border-color: var(--ar-neo-border-color);
+}
+html[data-theme="neo"] .ar-kbd {
+ border-color: var(--ar-neo-border-color);
+ box-shadow: var(--ar-neo-shadow-sm);
+}
+@media (min-width: 480px) {
+ html[data-theme="neo"] .ar-dt {
+  border-bottom: var(--ar-neo-border-width) solid var(--ar-neo-border-color);
+ }
+}
+html[data-theme="neo"] .ar-dd {
+ border-bottom: var(--ar-neo-border-width) solid var(--ar-neo-border-color);
+}
+html[data-theme="neo"] .ar-dl > :nth-last-child(-n + 2) {
+ border-bottom: 0;
+}