@aortl/admin-react 0.3.0 → 0.4.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/Accordion.d.ts.map +1 -1
- package/dist/AdminRoot.d.ts.map +1 -1
- package/dist/Alert.d.ts.map +1 -1
- package/dist/AppShell.d.ts.map +1 -1
- package/dist/Badge.d.ts.map +1 -1
- package/dist/BrandTile.d.ts.map +1 -1
- package/dist/Breadcrumbs.d.ts.map +1 -1
- package/dist/ButtonGroup.d.ts.map +1 -1
- package/dist/Card.d.ts.map +1 -1
- package/dist/Dialog.d.ts.map +1 -1
- package/dist/Footer.d.ts.map +1 -1
- package/dist/InputGroup.d.ts.map +1 -1
- package/dist/Menu.d.ts.map +1 -1
- package/dist/Navbar.d.ts.map +1 -1
- package/dist/Pagination.d.ts.map +1 -1
- package/dist/Progress.d.ts.map +1 -1
- package/dist/Sidebar.d.ts.map +1 -1
- package/dist/Spinner.d.ts.map +1 -1
- package/dist/Table.d.ts.map +1 -1
- package/dist/Textarea.d.ts.map +1 -1
- package/dist/admin.scoped.css +430 -366
- package/dist/cn.d.ts +9 -3
- package/dist/cn.d.ts.map +1 -1
- package/dist/index.cjs +137 -99
- package/dist/index.cjs.map +1 -1
- package/dist/index.mjs +137 -99
- package/dist/index.mjs.map +1 -1
- package/package.json +4 -4
- package/dist/admin.css +0 -3477
package/dist/admin.scoped.css
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
/*! @aortl/admin-css scoped variant —
|
|
1
|
+
/*! @aortl/admin-css scoped variant — @scope (._ao-admin-root); admin classes prefixed with _ao-. */
|
|
2
2
|
/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */
|
|
3
3
|
@layer properties;
|
|
4
4
|
@layer theme, base, components, utilities;
|
|
@@ -50,6 +50,26 @@
|
|
|
50
50
|
src: url(https://fonts.gstatic.com/s/ibmplexmono/v20/-F6qfjptAgt5VM-kVkqdyU8n3twJwlBFgg.woff2) format("woff2");
|
|
51
51
|
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
|
|
52
52
|
}
|
|
53
|
+
@property --tw-ordinal {
|
|
54
|
+
syntax: "*";
|
|
55
|
+
inherits: false;
|
|
56
|
+
}
|
|
57
|
+
@property --tw-slashed-zero {
|
|
58
|
+
syntax: "*";
|
|
59
|
+
inherits: false;
|
|
60
|
+
}
|
|
61
|
+
@property --tw-numeric-figure {
|
|
62
|
+
syntax: "*";
|
|
63
|
+
inherits: false;
|
|
64
|
+
}
|
|
65
|
+
@property --tw-numeric-spacing {
|
|
66
|
+
syntax: "*";
|
|
67
|
+
inherits: false;
|
|
68
|
+
}
|
|
69
|
+
@property --tw-numeric-fraction {
|
|
70
|
+
syntax: "*";
|
|
71
|
+
inherits: false;
|
|
72
|
+
}
|
|
53
73
|
@property --tw-shadow {
|
|
54
74
|
syntax: "*";
|
|
55
75
|
inherits: false;
|
|
@@ -156,30 +176,7 @@
|
|
|
156
176
|
syntax: "*";
|
|
157
177
|
inherits: false;
|
|
158
178
|
}
|
|
159
|
-
@
|
|
160
|
-
syntax: "*";
|
|
161
|
-
inherits: false;
|
|
162
|
-
}
|
|
163
|
-
@property --tw-slashed-zero {
|
|
164
|
-
syntax: "*";
|
|
165
|
-
inherits: false;
|
|
166
|
-
}
|
|
167
|
-
@property --tw-numeric-figure {
|
|
168
|
-
syntax: "*";
|
|
169
|
-
inherits: false;
|
|
170
|
-
}
|
|
171
|
-
@property --tw-numeric-spacing {
|
|
172
|
-
syntax: "*";
|
|
173
|
-
inherits: false;
|
|
174
|
-
}
|
|
175
|
-
@property --tw-numeric-fraction {
|
|
176
|
-
syntax: "*";
|
|
177
|
-
inherits: false;
|
|
178
|
-
}
|
|
179
|
-
@scope (.admin-root) {
|
|
180
|
-
:scope, :scope * {
|
|
181
|
-
all: revert-layer;
|
|
182
|
-
}
|
|
179
|
+
@scope (._ao-admin-root) {
|
|
183
180
|
@layer theme {
|
|
184
181
|
:scope, :host {
|
|
185
182
|
--font-sans: "IBM Plex Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
|
|
@@ -534,10 +531,77 @@
|
|
|
534
531
|
}
|
|
535
532
|
}
|
|
536
533
|
@layer utilities {
|
|
537
|
-
.
|
|
534
|
+
._ao-collapse {
|
|
535
|
+
visibility: collapse;
|
|
536
|
+
}
|
|
537
|
+
._ao-visible {
|
|
538
|
+
visibility: visible;
|
|
539
|
+
}
|
|
540
|
+
._ao-sr-only {
|
|
541
|
+
position: absolute;
|
|
542
|
+
width: 1px;
|
|
543
|
+
height: 1px;
|
|
544
|
+
padding: 0;
|
|
545
|
+
margin: -1px;
|
|
546
|
+
overflow: hidden;
|
|
547
|
+
clip-path: inset(50%);
|
|
548
|
+
white-space: nowrap;
|
|
549
|
+
border-width: 0;
|
|
550
|
+
}
|
|
551
|
+
._ao-sticky {
|
|
552
|
+
position: sticky;
|
|
553
|
+
}
|
|
554
|
+
._ao-container {
|
|
555
|
+
width: 100%;
|
|
556
|
+
@media (width >= 40rem) {
|
|
557
|
+
max-width: 40rem;
|
|
558
|
+
}
|
|
559
|
+
@media (width >= 48rem) {
|
|
560
|
+
max-width: 48rem;
|
|
561
|
+
}
|
|
562
|
+
@media (width >= 64rem) {
|
|
563
|
+
max-width: 64rem;
|
|
564
|
+
}
|
|
565
|
+
@media (width >= 80rem) {
|
|
566
|
+
max-width: 80rem;
|
|
567
|
+
}
|
|
568
|
+
@media (width >= 96rem) {
|
|
569
|
+
max-width: 96rem;
|
|
570
|
+
}
|
|
571
|
+
}
|
|
572
|
+
._ao-block {
|
|
573
|
+
display: block;
|
|
574
|
+
}
|
|
575
|
+
._ao-grid {
|
|
576
|
+
display: grid;
|
|
577
|
+
}
|
|
578
|
+
._ao-hidden {
|
|
579
|
+
display: none;
|
|
580
|
+
}
|
|
581
|
+
._ao-table {
|
|
582
|
+
display: table;
|
|
583
|
+
}
|
|
584
|
+
._ao-table-cell {
|
|
585
|
+
display: table-cell;
|
|
586
|
+
}
|
|
587
|
+
._ao-flex-1 {
|
|
588
|
+
flex: 1;
|
|
589
|
+
}
|
|
590
|
+
._ao-text-right {
|
|
591
|
+
text-align: right;
|
|
592
|
+
}
|
|
593
|
+
._ao-tabular-nums {
|
|
594
|
+
--tw-numeric-spacing: tabular-nums;
|
|
595
|
+
font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);
|
|
596
|
+
}
|
|
597
|
+
._ao-shadow {
|
|
538
598
|
--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
|
|
539
599
|
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
|
|
540
600
|
}
|
|
601
|
+
._ao-select-all {
|
|
602
|
+
-webkit-user-select: all;
|
|
603
|
+
user-select: all;
|
|
604
|
+
}
|
|
541
605
|
}
|
|
542
606
|
:scope {
|
|
543
607
|
color-scheme: light dark;
|
|
@@ -586,29 +650,29 @@
|
|
|
586
650
|
}
|
|
587
651
|
}
|
|
588
652
|
@layer components {
|
|
589
|
-
.accordion {
|
|
653
|
+
._ao-accordion {
|
|
590
654
|
display: flex;
|
|
591
655
|
flex-direction: column;
|
|
592
656
|
}
|
|
593
|
-
.accordion-item {
|
|
657
|
+
._ao-accordion-item {
|
|
594
658
|
border-style: var(--tw-border-style);
|
|
595
659
|
border-width: 1px;
|
|
596
660
|
border-color: var(--color-border);
|
|
597
661
|
background-color: var(--color-surface);
|
|
598
662
|
interpolate-size: allow-keywords;
|
|
599
663
|
}
|
|
600
|
-
.accordion-item:first-child {
|
|
664
|
+
._ao-accordion-item:first-child {
|
|
601
665
|
border-top-left-radius: var(--radius-lg);
|
|
602
666
|
border-top-right-radius: var(--radius-lg);
|
|
603
667
|
}
|
|
604
|
-
.accordion-item:last-child {
|
|
668
|
+
._ao-accordion-item:last-child {
|
|
605
669
|
border-bottom-right-radius: var(--radius-lg);
|
|
606
670
|
border-bottom-left-radius: var(--radius-lg);
|
|
607
671
|
}
|
|
608
|
-
.accordion-item + .accordion-item {
|
|
672
|
+
._ao-accordion-item + ._ao-accordion-item {
|
|
609
673
|
border-top: 0;
|
|
610
674
|
}
|
|
611
|
-
.accordion-summary {
|
|
675
|
+
._ao-accordion-summary {
|
|
612
676
|
display: flex;
|
|
613
677
|
cursor: pointer;
|
|
614
678
|
align-items: center;
|
|
@@ -639,10 +703,10 @@
|
|
|
639
703
|
}
|
|
640
704
|
list-style: none;
|
|
641
705
|
}
|
|
642
|
-
.accordion-summary::-webkit-details-marker {
|
|
706
|
+
._ao-accordion-summary::-webkit-details-marker {
|
|
643
707
|
display: none;
|
|
644
708
|
}
|
|
645
|
-
.accordion-summary::after {
|
|
709
|
+
._ao-accordion-summary::after {
|
|
646
710
|
content: "";
|
|
647
711
|
width: 0.5rem;
|
|
648
712
|
height: 0.5rem;
|
|
@@ -653,10 +717,10 @@
|
|
|
653
717
|
flex-shrink: 0;
|
|
654
718
|
margin-left: auto;
|
|
655
719
|
}
|
|
656
|
-
.accordion-item[open] > .accordion-summary::after {
|
|
720
|
+
._ao-accordion-item[open] > ._ao-accordion-summary::after {
|
|
657
721
|
transform: rotate(-135deg);
|
|
658
722
|
}
|
|
659
|
-
.accordion-content {
|
|
723
|
+
._ao-accordion-content {
|
|
660
724
|
border-top-style: var(--tw-border-style);
|
|
661
725
|
border-top-width: 1px;
|
|
662
726
|
border-color: var(--color-border);
|
|
@@ -666,20 +730,20 @@
|
|
|
666
730
|
line-height: var(--tw-leading, var(--text-sm--line-height));
|
|
667
731
|
color: var(--color-text);
|
|
668
732
|
}
|
|
669
|
-
.accordion-item::details-content {
|
|
733
|
+
._ao-accordion-item::details-content {
|
|
670
734
|
opacity: 0;
|
|
671
735
|
height: 0;
|
|
672
736
|
overflow: clip;
|
|
673
737
|
content-visibility: visible;
|
|
674
738
|
transition: opacity 200ms ease, height 200ms ease;
|
|
675
739
|
}
|
|
676
|
-
.accordion-item[open]::details-content {
|
|
740
|
+
._ao-accordion-item[open]::details-content {
|
|
677
741
|
opacity: 1;
|
|
678
742
|
height: auto;
|
|
679
743
|
}
|
|
680
744
|
}
|
|
681
745
|
@layer components {
|
|
682
|
-
.alert {
|
|
746
|
+
._ao-alert {
|
|
683
747
|
display: flex;
|
|
684
748
|
width: 100%;
|
|
685
749
|
flex-direction: column;
|
|
@@ -693,65 +757,65 @@
|
|
|
693
757
|
line-height: var(--tw-leading, var(--text-sm--line-height));
|
|
694
758
|
color: var(--color-text);
|
|
695
759
|
}
|
|
696
|
-
.alert:has(> :is(i, svg):first-child) {
|
|
760
|
+
._ao-alert:has(> :is(i, svg):first-child) {
|
|
697
761
|
display: grid;
|
|
698
762
|
grid-template-columns: auto 1fr;
|
|
699
763
|
column-gap: 0.5rem;
|
|
700
764
|
row-gap: 0.25rem;
|
|
701
765
|
align-items: center;
|
|
702
766
|
}
|
|
703
|
-
.alert > :is(i, svg):first-child {
|
|
767
|
+
._ao-alert > :is(i, svg):first-child {
|
|
704
768
|
font-size: 1rem;
|
|
705
769
|
line-height: 1.25;
|
|
706
770
|
}
|
|
707
|
-
.alert:has(> :is(i, svg):first-child):has(> .alert-title) {
|
|
771
|
+
._ao-alert:has(> :is(i, svg):first-child):has(> ._ao-alert-title) {
|
|
708
772
|
grid-template-rows: auto auto;
|
|
709
773
|
align-items: start;
|
|
710
774
|
}
|
|
711
|
-
.alert:has(> .alert-title) > :is(i, svg):first-child {
|
|
775
|
+
._ao-alert:has(> ._ao-alert-title) > :is(i, svg):first-child {
|
|
712
776
|
grid-row: 1 / -1;
|
|
713
777
|
}
|
|
714
|
-
.alert > :is(.alert-title, .alert-description) {
|
|
778
|
+
._ao-alert > :is(._ao-alert-title, ._ao-alert-description) {
|
|
715
779
|
grid-column: 2;
|
|
716
780
|
}
|
|
717
|
-
.alert-info {
|
|
781
|
+
._ao-alert-info {
|
|
718
782
|
border-color: var(--color-info-muted);
|
|
719
783
|
background-color: var(--color-info-muted);
|
|
720
784
|
}
|
|
721
|
-
.alert-success {
|
|
785
|
+
._ao-alert-success {
|
|
722
786
|
border-color: var(--color-success-muted);
|
|
723
787
|
background-color: var(--color-success-muted);
|
|
724
788
|
}
|
|
725
|
-
.alert-warning {
|
|
789
|
+
._ao-alert-warning {
|
|
726
790
|
border-color: var(--color-warning-muted);
|
|
727
791
|
background-color: var(--color-warning-muted);
|
|
728
792
|
}
|
|
729
|
-
.alert-danger {
|
|
793
|
+
._ao-alert-danger {
|
|
730
794
|
border-color: var(--color-danger-muted);
|
|
731
795
|
background-color: var(--color-danger-muted);
|
|
732
796
|
}
|
|
733
|
-
.alert-title {
|
|
797
|
+
._ao-alert-title {
|
|
734
798
|
--tw-font-weight: var(--font-weight-medium);
|
|
735
799
|
font-weight: var(--font-weight-medium);
|
|
736
800
|
}
|
|
737
|
-
.alert-info .alert-title, .alert-info > :is(i, svg):first-child {
|
|
801
|
+
._ao-alert-info ._ao-alert-title, ._ao-alert-info > :is(i, svg):first-child {
|
|
738
802
|
color: var(--color-info);
|
|
739
803
|
}
|
|
740
|
-
.alert-success .alert-title, .alert-success > :is(i, svg):first-child {
|
|
804
|
+
._ao-alert-success ._ao-alert-title, ._ao-alert-success > :is(i, svg):first-child {
|
|
741
805
|
color: var(--color-success);
|
|
742
806
|
}
|
|
743
|
-
.alert-warning .alert-title, .alert-warning > :is(i, svg):first-child {
|
|
807
|
+
._ao-alert-warning ._ao-alert-title, ._ao-alert-warning > :is(i, svg):first-child {
|
|
744
808
|
color: var(--color-warning);
|
|
745
809
|
}
|
|
746
|
-
.alert-danger .alert-title, .alert-danger > :is(i, svg):first-child {
|
|
810
|
+
._ao-alert-danger ._ao-alert-title, ._ao-alert-danger > :is(i, svg):first-child {
|
|
747
811
|
color: var(--color-danger);
|
|
748
812
|
}
|
|
749
|
-
.alert-description {
|
|
813
|
+
._ao-alert-description {
|
|
750
814
|
color: var(--color-text-muted);
|
|
751
815
|
}
|
|
752
816
|
}
|
|
753
817
|
@layer components {
|
|
754
|
-
.app-shell {
|
|
818
|
+
._ao-app-shell {
|
|
755
819
|
--app-shell-sidebar-w: 240px;
|
|
756
820
|
--app-shell-sidebar-w-collapsed: 56px;
|
|
757
821
|
display: grid;
|
|
@@ -763,35 +827,35 @@
|
|
|
763
827
|
grid-template-rows: auto 1fr auto;
|
|
764
828
|
grid-template-areas: "header" "main" "footer";
|
|
765
829
|
}
|
|
766
|
-
.app-shell > .navbar {
|
|
830
|
+
._ao-app-shell > ._ao-navbar {
|
|
767
831
|
grid-area: header;
|
|
768
832
|
}
|
|
769
|
-
.app-shell > main, .app-shell-main {
|
|
833
|
+
._ao-app-shell > main, ._ao-app-shell-main {
|
|
770
834
|
grid-area: main;
|
|
771
835
|
min-width: 0;
|
|
772
836
|
}
|
|
773
|
-
.app-shell > .footer {
|
|
837
|
+
._ao-app-shell > ._ao-footer {
|
|
774
838
|
grid-area: footer;
|
|
775
839
|
}
|
|
776
|
-
.app-shell-with-sidebar {
|
|
840
|
+
._ao-app-shell-with-sidebar {
|
|
777
841
|
grid-template-columns: auto 1fr;
|
|
778
842
|
grid-template-areas: "header header" "sidebar main" "footer footer";
|
|
779
843
|
}
|
|
780
|
-
.app-shell-with-sidebar > .sidebar {
|
|
844
|
+
._ao-app-shell-with-sidebar > ._ao-sidebar {
|
|
781
845
|
grid-area: sidebar;
|
|
782
846
|
}
|
|
783
847
|
@media (max-width: 48rem) {
|
|
784
|
-
.app-shell-with-sidebar {
|
|
848
|
+
._ao-app-shell-with-sidebar {
|
|
785
849
|
grid-template-columns: 1fr;
|
|
786
850
|
grid-template-areas: "header" "main" "footer";
|
|
787
851
|
}
|
|
788
|
-
.app-shell-with-sidebar > .sidebar {
|
|
852
|
+
._ao-app-shell-with-sidebar > ._ao-sidebar {
|
|
789
853
|
display: none;
|
|
790
854
|
}
|
|
791
855
|
}
|
|
792
856
|
}
|
|
793
857
|
@layer components {
|
|
794
|
-
.badge {
|
|
858
|
+
._ao-badge {
|
|
795
859
|
display: inline-flex;
|
|
796
860
|
height: calc(var(--spacing) * 5);
|
|
797
861
|
align-items: center;
|
|
@@ -810,41 +874,41 @@
|
|
|
810
874
|
font-weight: var(--font-weight-medium);
|
|
811
875
|
white-space: nowrap;
|
|
812
876
|
}
|
|
813
|
-
.badge-neutral {
|
|
877
|
+
._ao-badge-neutral {
|
|
814
878
|
background-color: var(--color-surface-strong);
|
|
815
879
|
color: var(--color-text);
|
|
816
880
|
}
|
|
817
|
-
.badge-info {
|
|
881
|
+
._ao-badge-info {
|
|
818
882
|
border-color: var(--color-info-muted);
|
|
819
883
|
background-color: var(--color-info-muted);
|
|
820
884
|
color: var(--color-info);
|
|
821
885
|
}
|
|
822
|
-
.badge-success {
|
|
886
|
+
._ao-badge-success {
|
|
823
887
|
border-color: var(--color-success-muted);
|
|
824
888
|
background-color: var(--color-success-muted);
|
|
825
889
|
color: var(--color-success);
|
|
826
890
|
}
|
|
827
|
-
.badge-warning {
|
|
891
|
+
._ao-badge-warning {
|
|
828
892
|
border-color: var(--color-warning-muted);
|
|
829
893
|
background-color: var(--color-warning-muted);
|
|
830
894
|
color: var(--color-warning);
|
|
831
895
|
}
|
|
832
|
-
.badge-danger {
|
|
896
|
+
._ao-badge-danger {
|
|
833
897
|
border-color: var(--color-danger-muted);
|
|
834
898
|
background-color: var(--color-danger-muted);
|
|
835
899
|
color: var(--color-danger);
|
|
836
900
|
}
|
|
837
|
-
.badge-primary {
|
|
901
|
+
._ao-badge-primary {
|
|
838
902
|
background-color: var(--color-primary);
|
|
839
903
|
color: var(--color-primary-content);
|
|
840
904
|
}
|
|
841
|
-
.badge-sm {
|
|
905
|
+
._ao-badge-sm {
|
|
842
906
|
height: calc(var(--spacing) * 4);
|
|
843
907
|
gap: calc(var(--spacing) * 0.5);
|
|
844
908
|
padding-inline: calc(var(--spacing) * 1.5);
|
|
845
909
|
font-size: 0.625rem;
|
|
846
910
|
}
|
|
847
|
-
.badge-lg {
|
|
911
|
+
._ao-badge-lg {
|
|
848
912
|
height: calc(var(--spacing) * 6);
|
|
849
913
|
gap: calc(var(--spacing) * 1.5);
|
|
850
914
|
padding-inline: calc(var(--spacing) * 2.5);
|
|
@@ -853,7 +917,7 @@
|
|
|
853
917
|
}
|
|
854
918
|
}
|
|
855
919
|
@layer components {
|
|
856
|
-
.brand-tile {
|
|
920
|
+
._ao-brand-tile {
|
|
857
921
|
display: inline-flex;
|
|
858
922
|
width: calc(var(--spacing) * 6);
|
|
859
923
|
height: calc(var(--spacing) * 6);
|
|
@@ -873,7 +937,7 @@
|
|
|
873
937
|
}
|
|
874
938
|
}
|
|
875
939
|
@layer components {
|
|
876
|
-
.spinner {
|
|
940
|
+
._ao-spinner {
|
|
877
941
|
display: inline-block;
|
|
878
942
|
width: 1rem;
|
|
879
943
|
height: 1rem;
|
|
@@ -886,18 +950,18 @@
|
|
|
886
950
|
border-top-color: currentColor;
|
|
887
951
|
animation: spinner-spin 0.6s linear infinite;
|
|
888
952
|
}
|
|
889
|
-
.spinner-sm {
|
|
953
|
+
._ao-spinner-sm {
|
|
890
954
|
width: 0.75rem;
|
|
891
955
|
height: 0.75rem;
|
|
892
956
|
border-width: 1.5px;
|
|
893
957
|
}
|
|
894
|
-
.spinner-lg {
|
|
958
|
+
._ao-spinner-lg {
|
|
895
959
|
width: 1.5rem;
|
|
896
960
|
height: 1.5rem;
|
|
897
961
|
border-width: 3px;
|
|
898
962
|
}
|
|
899
963
|
@media (prefers-reduced-motion: reduce) {
|
|
900
|
-
.spinner {
|
|
964
|
+
._ao-spinner {
|
|
901
965
|
animation-duration: 2s;
|
|
902
966
|
}
|
|
903
967
|
}
|
|
@@ -908,7 +972,7 @@
|
|
|
908
972
|
}
|
|
909
973
|
}
|
|
910
974
|
@layer components {
|
|
911
|
-
.progress {
|
|
975
|
+
._ao-progress {
|
|
912
976
|
appearance: none;
|
|
913
977
|
-webkit-appearance: none;
|
|
914
978
|
display: block;
|
|
@@ -920,49 +984,49 @@
|
|
|
920
984
|
background-color: var(--color-surface-strong);
|
|
921
985
|
color: var(--color-primary);
|
|
922
986
|
}
|
|
923
|
-
.progress::-webkit-progress-bar {
|
|
987
|
+
._ao-progress::-webkit-progress-bar {
|
|
924
988
|
background-color: var(--color-surface-strong);
|
|
925
989
|
border-radius: 9999px;
|
|
926
990
|
}
|
|
927
|
-
.progress::-webkit-progress-value {
|
|
991
|
+
._ao-progress::-webkit-progress-value {
|
|
928
992
|
background-color: currentColor;
|
|
929
993
|
border-radius: 9999px;
|
|
930
994
|
transition: inline-size 200ms ease;
|
|
931
995
|
}
|
|
932
|
-
.progress::-moz-progress-bar {
|
|
996
|
+
._ao-progress::-moz-progress-bar {
|
|
933
997
|
background-color: currentColor;
|
|
934
998
|
border-radius: 9999px;
|
|
935
999
|
transition: inline-size 200ms ease;
|
|
936
1000
|
}
|
|
937
|
-
.progress-sm {
|
|
1001
|
+
._ao-progress-sm {
|
|
938
1002
|
height: 0.25rem;
|
|
939
1003
|
}
|
|
940
|
-
.progress-lg {
|
|
1004
|
+
._ao-progress-lg {
|
|
941
1005
|
height: 0.5rem;
|
|
942
1006
|
}
|
|
943
|
-
.progress-success {
|
|
1007
|
+
._ao-progress-success {
|
|
944
1008
|
color: var(--color-success);
|
|
945
1009
|
}
|
|
946
|
-
.progress-warning {
|
|
1010
|
+
._ao-progress-warning {
|
|
947
1011
|
color: var(--color-warning);
|
|
948
1012
|
}
|
|
949
|
-
.progress-danger {
|
|
1013
|
+
._ao-progress-danger {
|
|
950
1014
|
color: var(--color-danger);
|
|
951
1015
|
}
|
|
952
|
-
.progress:indeterminate {
|
|
1016
|
+
._ao-progress:indeterminate {
|
|
953
1017
|
background-image: linear-gradient( 90deg, var(--color-surface-strong) 0%, var(--color-surface-strong) 40%, currentColor 50%, var(--color-surface-strong) 60%, var(--color-surface-strong) 100% );
|
|
954
1018
|
background-size: 250% 100%;
|
|
955
1019
|
background-repeat: no-repeat;
|
|
956
1020
|
animation: progress-indeterminate 1.2s linear infinite;
|
|
957
1021
|
}
|
|
958
|
-
.progress:indeterminate::-webkit-progress-bar {
|
|
1022
|
+
._ao-progress:indeterminate::-webkit-progress-bar {
|
|
959
1023
|
background-color: transparent;
|
|
960
1024
|
}
|
|
961
|
-
.progress:indeterminate::-webkit-progress-value, .progress:indeterminate::-moz-progress-bar {
|
|
1025
|
+
._ao-progress:indeterminate::-webkit-progress-value, ._ao-progress:indeterminate::-moz-progress-bar {
|
|
962
1026
|
background-color: transparent;
|
|
963
1027
|
}
|
|
964
1028
|
@media (prefers-reduced-motion: reduce) {
|
|
965
|
-
.progress:indeterminate {
|
|
1029
|
+
._ao-progress:indeterminate {
|
|
966
1030
|
animation-duration: 3s;
|
|
967
1031
|
}
|
|
968
1032
|
}
|
|
@@ -976,12 +1040,12 @@
|
|
|
976
1040
|
}
|
|
977
1041
|
}
|
|
978
1042
|
@layer components {
|
|
979
|
-
.breadcrumbs {
|
|
1043
|
+
._ao-breadcrumbs {
|
|
980
1044
|
font-size: var(--text-sm);
|
|
981
1045
|
line-height: var(--tw-leading, var(--text-sm--line-height));
|
|
982
1046
|
color: var(--color-text-muted);
|
|
983
1047
|
}
|
|
984
|
-
.breadcrumbs > ol {
|
|
1048
|
+
._ao-breadcrumbs > ol {
|
|
985
1049
|
margin: calc(var(--spacing) * 0);
|
|
986
1050
|
display: inline-flex;
|
|
987
1051
|
list-style-type: none;
|
|
@@ -990,7 +1054,7 @@
|
|
|
990
1054
|
gap: calc(var(--spacing) * 1.5);
|
|
991
1055
|
padding: calc(var(--spacing) * 0);
|
|
992
1056
|
}
|
|
993
|
-
.breadcrumb-item {
|
|
1057
|
+
._ao-breadcrumb-item {
|
|
994
1058
|
display: inline-flex;
|
|
995
1059
|
align-items: center;
|
|
996
1060
|
gap: calc(var(--spacing) * 1.5);
|
|
@@ -1012,13 +1076,13 @@
|
|
|
1012
1076
|
outline-color: var(--color-primary);
|
|
1013
1077
|
}
|
|
1014
1078
|
}
|
|
1015
|
-
.breadcrumb-item[aria-current="page"] {
|
|
1079
|
+
._ao-breadcrumb-item[aria-current="page"] {
|
|
1016
1080
|
pointer-events: none;
|
|
1017
1081
|
--tw-font-weight: var(--font-weight-medium);
|
|
1018
1082
|
font-weight: var(--font-weight-medium);
|
|
1019
1083
|
color: var(--color-text);
|
|
1020
1084
|
}
|
|
1021
|
-
.breadcrumb-separator {
|
|
1085
|
+
._ao-breadcrumb-separator {
|
|
1022
1086
|
display: inline-flex;
|
|
1023
1087
|
align-items: center;
|
|
1024
1088
|
color: color-mix(in srgb, light-dark(var(--color-base-600), var(--color-base-500)) 60%, transparent);
|
|
@@ -1028,16 +1092,16 @@
|
|
|
1028
1092
|
-webkit-user-select: none;
|
|
1029
1093
|
user-select: none;
|
|
1030
1094
|
}
|
|
1031
|
-
.breadcrumb-separator:empty::before {
|
|
1095
|
+
._ao-breadcrumb-separator:empty::before {
|
|
1032
1096
|
content: "/";
|
|
1033
1097
|
}
|
|
1034
|
-
.breadcrumb-separator > :is(i, svg) {
|
|
1098
|
+
._ao-breadcrumb-separator > :is(i, svg) {
|
|
1035
1099
|
width: 0.875rem;
|
|
1036
1100
|
height: 0.875rem;
|
|
1037
1101
|
}
|
|
1038
1102
|
}
|
|
1039
1103
|
@layer components {
|
|
1040
|
-
.pagination > ol, .pagination > ul {
|
|
1104
|
+
._ao-pagination > ol, ._ao-pagination > ul {
|
|
1041
1105
|
margin: calc(var(--spacing) * 0);
|
|
1042
1106
|
display: inline-flex;
|
|
1043
1107
|
list-style-type: none;
|
|
@@ -1045,10 +1109,10 @@
|
|
|
1045
1109
|
gap: calc(var(--spacing) * 1);
|
|
1046
1110
|
padding: calc(var(--spacing) * 0);
|
|
1047
1111
|
}
|
|
1048
|
-
.page-item {
|
|
1112
|
+
._ao-page-item {
|
|
1049
1113
|
display: inline-flex;
|
|
1050
1114
|
}
|
|
1051
|
-
.page-link {
|
|
1115
|
+
._ao-page-link {
|
|
1052
1116
|
display: inline-flex;
|
|
1053
1117
|
height: calc(var(--spacing) * 8);
|
|
1054
1118
|
min-width: calc(var(--spacing) * 8);
|
|
@@ -1101,17 +1165,17 @@
|
|
|
1101
1165
|
opacity: 50%;
|
|
1102
1166
|
}
|
|
1103
1167
|
}
|
|
1104
|
-
.page-link.active, .page-link[aria-current="page"] {
|
|
1168
|
+
._ao-page-link._ao-active, ._ao-page-link[aria-current="page"] {
|
|
1105
1169
|
border-color: var(--color-primary-muted);
|
|
1106
1170
|
background-color: var(--color-primary-muted);
|
|
1107
1171
|
color: var(--color-primary);
|
|
1108
1172
|
}
|
|
1109
|
-
.page-link[aria-disabled="true"] {
|
|
1173
|
+
._ao-page-link[aria-disabled="true"] {
|
|
1110
1174
|
pointer-events: none;
|
|
1111
1175
|
cursor: not-allowed;
|
|
1112
1176
|
opacity: 50%;
|
|
1113
1177
|
}
|
|
1114
|
-
.page-ellipsis {
|
|
1178
|
+
._ao-page-ellipsis {
|
|
1115
1179
|
display: inline-flex;
|
|
1116
1180
|
height: calc(var(--spacing) * 8);
|
|
1117
1181
|
min-width: calc(var(--spacing) * 8);
|
|
@@ -1126,7 +1190,7 @@
|
|
|
1126
1190
|
}
|
|
1127
1191
|
}
|
|
1128
1192
|
@layer components {
|
|
1129
|
-
.btn {
|
|
1193
|
+
._ao-btn {
|
|
1130
1194
|
display: inline-flex;
|
|
1131
1195
|
cursor: pointer;
|
|
1132
1196
|
align-items: center;
|
|
@@ -1171,7 +1235,7 @@
|
|
|
1171
1235
|
opacity: 50%;
|
|
1172
1236
|
}
|
|
1173
1237
|
}
|
|
1174
|
-
.btn-primary {
|
|
1238
|
+
._ao-btn-primary {
|
|
1175
1239
|
background-color: var(--color-primary);
|
|
1176
1240
|
color: var(--color-primary-content);
|
|
1177
1241
|
&:hover {
|
|
@@ -1180,7 +1244,7 @@
|
|
|
1180
1244
|
}
|
|
1181
1245
|
}
|
|
1182
1246
|
}
|
|
1183
|
-
.btn-secondary {
|
|
1247
|
+
._ao-btn-secondary {
|
|
1184
1248
|
border-color: var(--color-border);
|
|
1185
1249
|
background-color: var(--color-surface-muted);
|
|
1186
1250
|
color: var(--color-text);
|
|
@@ -1190,7 +1254,7 @@
|
|
|
1190
1254
|
}
|
|
1191
1255
|
}
|
|
1192
1256
|
}
|
|
1193
|
-
.btn-ghost {
|
|
1257
|
+
._ao-btn-ghost {
|
|
1194
1258
|
background-color: transparent;
|
|
1195
1259
|
color: var(--color-text);
|
|
1196
1260
|
&:hover {
|
|
@@ -1199,7 +1263,7 @@
|
|
|
1199
1263
|
}
|
|
1200
1264
|
}
|
|
1201
1265
|
}
|
|
1202
|
-
.btn-danger {
|
|
1266
|
+
._ao-btn-danger {
|
|
1203
1267
|
background-color: var(--color-danger);
|
|
1204
1268
|
color: var(--color-danger-content);
|
|
1205
1269
|
&:hover {
|
|
@@ -1208,38 +1272,38 @@
|
|
|
1208
1272
|
}
|
|
1209
1273
|
}
|
|
1210
1274
|
}
|
|
1211
|
-
.btn-sm {
|
|
1275
|
+
._ao-btn-sm {
|
|
1212
1276
|
gap: calc(var(--spacing) * 1.5);
|
|
1213
1277
|
padding-inline: calc(var(--spacing) * 3);
|
|
1214
1278
|
padding-block: calc(var(--spacing) * 1.5);
|
|
1215
1279
|
font-size: var(--text-xs);
|
|
1216
1280
|
line-height: var(--tw-leading, var(--text-xs--line-height));
|
|
1217
1281
|
}
|
|
1218
|
-
.btn-lg {
|
|
1282
|
+
._ao-btn-lg {
|
|
1219
1283
|
gap: calc(var(--spacing) * 2.5);
|
|
1220
1284
|
padding-inline: calc(var(--spacing) * 5);
|
|
1221
1285
|
padding-block: calc(var(--spacing) * 2.5);
|
|
1222
1286
|
font-size: var(--text-base);
|
|
1223
1287
|
line-height: var(--tw-leading, var(--text-base--line-height));
|
|
1224
1288
|
}
|
|
1225
|
-
.btn-full-width {
|
|
1289
|
+
._ao-btn-full-width {
|
|
1226
1290
|
width: 100%;
|
|
1227
1291
|
}
|
|
1228
|
-
.btn-square {
|
|
1292
|
+
._ao-btn-square {
|
|
1229
1293
|
padding-inline: calc(var(--spacing) * 2);
|
|
1230
1294
|
}
|
|
1231
|
-
.btn-sm.btn-square {
|
|
1295
|
+
._ao-btn-sm._ao-btn-square {
|
|
1232
1296
|
padding-inline: calc(var(--spacing) * 1.5);
|
|
1233
1297
|
}
|
|
1234
|
-
.btn-lg.btn-square {
|
|
1298
|
+
._ao-btn-lg._ao-btn-square {
|
|
1235
1299
|
padding-inline: calc(var(--spacing) * 2.5);
|
|
1236
1300
|
}
|
|
1237
|
-
.btn-loading {
|
|
1301
|
+
._ao-btn-loading {
|
|
1238
1302
|
pointer-events: none;
|
|
1239
1303
|
cursor: not-allowed;
|
|
1240
1304
|
opacity: 50%;
|
|
1241
1305
|
}
|
|
1242
|
-
.btn-loading::before {
|
|
1306
|
+
._ao-btn-loading::before {
|
|
1243
1307
|
content: "";
|
|
1244
1308
|
display: inline-block;
|
|
1245
1309
|
width: 1em;
|
|
@@ -1253,85 +1317,85 @@
|
|
|
1253
1317
|
border-top-color: currentColor;
|
|
1254
1318
|
animation: spinner-spin 0.6s linear infinite;
|
|
1255
1319
|
}
|
|
1256
|
-
.btn-loading > :is(i, svg):first-child {
|
|
1320
|
+
._ao-btn-loading > :is(i, svg):first-child {
|
|
1257
1321
|
display: none;
|
|
1258
1322
|
}
|
|
1259
1323
|
@media (prefers-reduced-motion: reduce) {
|
|
1260
|
-
.btn-loading::before {
|
|
1324
|
+
._ao-btn-loading::before {
|
|
1261
1325
|
animation-duration: 2s;
|
|
1262
1326
|
}
|
|
1263
1327
|
}
|
|
1264
1328
|
}
|
|
1265
1329
|
@layer components {
|
|
1266
|
-
.btn-group {
|
|
1330
|
+
._ao-btn-group {
|
|
1267
1331
|
display: inline-flex;
|
|
1268
1332
|
}
|
|
1269
|
-
.btn-group > .btn {
|
|
1333
|
+
._ao-btn-group > ._ao-btn {
|
|
1270
1334
|
position: relative;
|
|
1271
1335
|
border-radius: 0;
|
|
1272
1336
|
&:focus-visible {
|
|
1273
1337
|
z-index: 10;
|
|
1274
1338
|
}
|
|
1275
1339
|
}
|
|
1276
|
-
.btn-group > .btn:not(:first-child) {
|
|
1340
|
+
._ao-btn-group > ._ao-btn:not(:first-child) {
|
|
1277
1341
|
margin-left: -1px;
|
|
1278
1342
|
}
|
|
1279
|
-
.btn-group > .btn:first-child {
|
|
1343
|
+
._ao-btn-group > ._ao-btn:first-child {
|
|
1280
1344
|
border-top-left-radius: var(--radius-lg);
|
|
1281
1345
|
border-bottom-left-radius: var(--radius-lg);
|
|
1282
1346
|
}
|
|
1283
|
-
.btn-group > .btn:last-child {
|
|
1347
|
+
._ao-btn-group > ._ao-btn:last-child {
|
|
1284
1348
|
border-top-right-radius: var(--radius-lg);
|
|
1285
1349
|
border-bottom-right-radius: var(--radius-lg);
|
|
1286
1350
|
}
|
|
1287
|
-
.btn-group > .menu {
|
|
1351
|
+
._ao-btn-group > ._ao-menu {
|
|
1288
1352
|
position: relative;
|
|
1289
1353
|
&:focus-visible {
|
|
1290
1354
|
z-index: 10;
|
|
1291
1355
|
}
|
|
1292
1356
|
display: inline-flex;
|
|
1293
1357
|
}
|
|
1294
|
-
.btn-group > .menu:not(:first-child) {
|
|
1358
|
+
._ao-btn-group > ._ao-menu:not(:first-child) {
|
|
1295
1359
|
margin-left: -1px;
|
|
1296
1360
|
}
|
|
1297
|
-
.btn-group > .menu > .menu-trigger {
|
|
1361
|
+
._ao-btn-group > ._ao-menu > ._ao-menu-trigger {
|
|
1298
1362
|
border-radius: 0;
|
|
1299
1363
|
}
|
|
1300
|
-
.btn-group > .menu:first-child > .menu-trigger {
|
|
1364
|
+
._ao-btn-group > ._ao-menu:first-child > ._ao-menu-trigger {
|
|
1301
1365
|
border-top-left-radius: var(--radius-lg);
|
|
1302
1366
|
border-bottom-left-radius: var(--radius-lg);
|
|
1303
1367
|
}
|
|
1304
|
-
.btn-group > .menu:last-child > .menu-trigger {
|
|
1368
|
+
._ao-btn-group > ._ao-menu:last-child > ._ao-menu-trigger {
|
|
1305
1369
|
border-top-right-radius: var(--radius-lg);
|
|
1306
1370
|
border-bottom-right-radius: var(--radius-lg);
|
|
1307
1371
|
}
|
|
1308
|
-
.btn-group > .btn:not(:first-child), .btn-group > .menu:not(:first-child) > .menu-trigger {
|
|
1372
|
+
._ao-btn-group > ._ao-btn:not(:first-child), ._ao-btn-group > ._ao-menu:not(:first-child) > ._ao-menu-trigger {
|
|
1309
1373
|
border-left-color: currentColor;
|
|
1310
1374
|
@supports (color: color-mix(in lab, red, red)) {
|
|
1311
1375
|
border-left-color: color-mix(in srgb, currentColor 25%, transparent);
|
|
1312
1376
|
}
|
|
1313
1377
|
}
|
|
1314
|
-
.btn-group-vertical {
|
|
1378
|
+
._ao-btn-group-vertical {
|
|
1315
1379
|
display: inline-flex;
|
|
1316
1380
|
flex-direction: column;
|
|
1317
1381
|
}
|
|
1318
|
-
.btn-group-vertical > .btn:not(:first-child) {
|
|
1382
|
+
._ao-btn-group-vertical > ._ao-btn:not(:first-child) {
|
|
1319
1383
|
margin-top: -1px;
|
|
1320
1384
|
margin-left: calc(var(--spacing) * 0);
|
|
1321
1385
|
}
|
|
1322
|
-
.btn-group-vertical > .btn:first-child {
|
|
1386
|
+
._ao-btn-group-vertical > ._ao-btn:first-child {
|
|
1323
1387
|
border-top-left-radius: var(--radius-lg);
|
|
1324
1388
|
border-top-right-radius: var(--radius-lg);
|
|
1325
1389
|
border-bottom-left-radius: 0;
|
|
1326
1390
|
}
|
|
1327
|
-
.btn-group-vertical > .btn:last-child {
|
|
1391
|
+
._ao-btn-group-vertical > ._ao-btn:last-child {
|
|
1328
1392
|
border-top-right-radius: 0;
|
|
1329
1393
|
border-bottom-right-radius: var(--radius-lg);
|
|
1330
1394
|
border-bottom-left-radius: var(--radius-lg);
|
|
1331
1395
|
}
|
|
1332
1396
|
}
|
|
1333
1397
|
@layer components {
|
|
1334
|
-
.input {
|
|
1398
|
+
._ao-input {
|
|
1335
1399
|
display: inline-flex;
|
|
1336
1400
|
width: 100%;
|
|
1337
1401
|
align-items: center;
|
|
@@ -1372,7 +1436,7 @@
|
|
|
1372
1436
|
opacity: 50%;
|
|
1373
1437
|
}
|
|
1374
1438
|
}
|
|
1375
|
-
.input-bordered {
|
|
1439
|
+
._ao-input-bordered {
|
|
1376
1440
|
border-color: var(--color-border);
|
|
1377
1441
|
&:hover {
|
|
1378
1442
|
@media (hover: hover) {
|
|
@@ -1380,7 +1444,7 @@
|
|
|
1380
1444
|
}
|
|
1381
1445
|
}
|
|
1382
1446
|
}
|
|
1383
|
-
.input-ghost {
|
|
1447
|
+
._ao-input-ghost {
|
|
1384
1448
|
background-color: transparent;
|
|
1385
1449
|
&:hover {
|
|
1386
1450
|
@media (hover: hover) {
|
|
@@ -1388,25 +1452,25 @@
|
|
|
1388
1452
|
}
|
|
1389
1453
|
}
|
|
1390
1454
|
}
|
|
1391
|
-
.input-danger {
|
|
1455
|
+
._ao-input-danger {
|
|
1392
1456
|
border-color: var(--color-danger);
|
|
1393
1457
|
&:focus-visible {
|
|
1394
1458
|
outline-color: var(--color-danger);
|
|
1395
1459
|
}
|
|
1396
1460
|
}
|
|
1397
|
-
.input-sm {
|
|
1461
|
+
._ao-input-sm {
|
|
1398
1462
|
padding-inline: calc(var(--spacing) * 2.5);
|
|
1399
1463
|
padding-block: calc(var(--spacing) * 1.5);
|
|
1400
1464
|
font-size: var(--text-xs);
|
|
1401
1465
|
line-height: var(--tw-leading, var(--text-xs--line-height));
|
|
1402
1466
|
}
|
|
1403
|
-
.input-lg {
|
|
1467
|
+
._ao-input-lg {
|
|
1404
1468
|
padding-inline: calc(var(--spacing) * 4);
|
|
1405
1469
|
padding-block: calc(var(--spacing) * 2.5);
|
|
1406
1470
|
font-size: var(--text-base);
|
|
1407
1471
|
line-height: var(--tw-leading, var(--text-base--line-height));
|
|
1408
1472
|
}
|
|
1409
|
-
.input::-webkit-calendar-picker-indicator {
|
|
1473
|
+
._ao-input::-webkit-calendar-picker-indicator {
|
|
1410
1474
|
cursor: pointer;
|
|
1411
1475
|
opacity: 60%;
|
|
1412
1476
|
&:hover {
|
|
@@ -1417,29 +1481,29 @@
|
|
|
1417
1481
|
}
|
|
1418
1482
|
}
|
|
1419
1483
|
@layer components {
|
|
1420
|
-
.input-group {
|
|
1484
|
+
._ao-input-group {
|
|
1421
1485
|
display: inline-flex;
|
|
1422
1486
|
width: 100%;
|
|
1423
1487
|
}
|
|
1424
|
-
.input-group > * {
|
|
1488
|
+
._ao-input-group > * {
|
|
1425
1489
|
border-radius: 0;
|
|
1426
1490
|
}
|
|
1427
|
-
.input-group > :first-child {
|
|
1491
|
+
._ao-input-group > :first-child {
|
|
1428
1492
|
border-top-left-radius: var(--radius-lg);
|
|
1429
1493
|
border-bottom-left-radius: var(--radius-lg);
|
|
1430
1494
|
}
|
|
1431
|
-
.input-group > :last-child {
|
|
1495
|
+
._ao-input-group > :last-child {
|
|
1432
1496
|
border-top-right-radius: var(--radius-lg);
|
|
1433
1497
|
border-bottom-right-radius: var(--radius-lg);
|
|
1434
1498
|
}
|
|
1435
|
-
.input-group > :not(:first-child) {
|
|
1499
|
+
._ao-input-group > :not(:first-child) {
|
|
1436
1500
|
margin-left: -1px;
|
|
1437
1501
|
}
|
|
1438
|
-
.input-group > :focus, .input-group > :focus-within {
|
|
1502
|
+
._ao-input-group > :focus, ._ao-input-group > :focus-within {
|
|
1439
1503
|
position: relative;
|
|
1440
1504
|
z-index: 10;
|
|
1441
1505
|
}
|
|
1442
|
-
.input-group-addon {
|
|
1506
|
+
._ao-input-group-addon {
|
|
1443
1507
|
display: inline-flex;
|
|
1444
1508
|
align-items: center;
|
|
1445
1509
|
border-style: var(--tw-border-style);
|
|
@@ -1456,7 +1520,7 @@
|
|
|
1456
1520
|
}
|
|
1457
1521
|
}
|
|
1458
1522
|
@layer components {
|
|
1459
|
-
.textarea {
|
|
1523
|
+
._ao-textarea {
|
|
1460
1524
|
display: block;
|
|
1461
1525
|
min-height: calc(var(--spacing) * 20);
|
|
1462
1526
|
width: 100%;
|
|
@@ -1496,7 +1560,7 @@
|
|
|
1496
1560
|
opacity: 50%;
|
|
1497
1561
|
}
|
|
1498
1562
|
}
|
|
1499
|
-
.textarea-bordered {
|
|
1563
|
+
._ao-textarea-bordered {
|
|
1500
1564
|
border-color: var(--color-border);
|
|
1501
1565
|
&:hover {
|
|
1502
1566
|
@media (hover: hover) {
|
|
@@ -1504,7 +1568,7 @@
|
|
|
1504
1568
|
}
|
|
1505
1569
|
}
|
|
1506
1570
|
}
|
|
1507
|
-
.textarea-ghost {
|
|
1571
|
+
._ao-textarea-ghost {
|
|
1508
1572
|
background-color: transparent;
|
|
1509
1573
|
&:hover {
|
|
1510
1574
|
@media (hover: hover) {
|
|
@@ -1512,20 +1576,20 @@
|
|
|
1512
1576
|
}
|
|
1513
1577
|
}
|
|
1514
1578
|
}
|
|
1515
|
-
.textarea-danger {
|
|
1579
|
+
._ao-textarea-danger {
|
|
1516
1580
|
border-color: var(--color-danger);
|
|
1517
1581
|
&:focus-visible {
|
|
1518
1582
|
outline-color: var(--color-danger);
|
|
1519
1583
|
}
|
|
1520
1584
|
}
|
|
1521
|
-
.textarea-sm {
|
|
1585
|
+
._ao-textarea-sm {
|
|
1522
1586
|
min-height: calc(var(--spacing) * 16);
|
|
1523
1587
|
padding-inline: calc(var(--spacing) * 2.5);
|
|
1524
1588
|
padding-block: calc(var(--spacing) * 1.5);
|
|
1525
1589
|
font-size: var(--text-xs);
|
|
1526
1590
|
line-height: var(--tw-leading, var(--text-xs--line-height));
|
|
1527
1591
|
}
|
|
1528
|
-
.textarea-lg {
|
|
1592
|
+
._ao-textarea-lg {
|
|
1529
1593
|
min-height: calc(var(--spacing) * 24);
|
|
1530
1594
|
padding-inline: calc(var(--spacing) * 4);
|
|
1531
1595
|
padding-block: calc(var(--spacing) * 2.5);
|
|
@@ -1534,7 +1598,7 @@
|
|
|
1534
1598
|
}
|
|
1535
1599
|
}
|
|
1536
1600
|
@layer components {
|
|
1537
|
-
.checkbox {
|
|
1601
|
+
._ao-checkbox {
|
|
1538
1602
|
display: inline-flex;
|
|
1539
1603
|
width: calc(var(--spacing) * 4);
|
|
1540
1604
|
height: calc(var(--spacing) * 4);
|
|
@@ -1568,7 +1632,7 @@
|
|
|
1568
1632
|
opacity: 50%;
|
|
1569
1633
|
}
|
|
1570
1634
|
}
|
|
1571
|
-
.checkbox[data-unchecked] {
|
|
1635
|
+
._ao-checkbox[data-unchecked] {
|
|
1572
1636
|
border-color: var(--color-border-strong);
|
|
1573
1637
|
&:hover {
|
|
1574
1638
|
@media (hover: hover) {
|
|
@@ -1576,7 +1640,7 @@
|
|
|
1576
1640
|
}
|
|
1577
1641
|
}
|
|
1578
1642
|
}
|
|
1579
|
-
.checkbox[data-checked], .checkbox[data-indeterminate] {
|
|
1643
|
+
._ao-checkbox[data-checked], ._ao-checkbox[data-indeterminate] {
|
|
1580
1644
|
border-color: var(--color-primary);
|
|
1581
1645
|
background-color: var(--color-primary);
|
|
1582
1646
|
&:hover {
|
|
@@ -1585,11 +1649,11 @@
|
|
|
1585
1649
|
}
|
|
1586
1650
|
}
|
|
1587
1651
|
}
|
|
1588
|
-
.checkbox[data-disabled] {
|
|
1652
|
+
._ao-checkbox[data-disabled] {
|
|
1589
1653
|
cursor: not-allowed;
|
|
1590
1654
|
opacity: 50%;
|
|
1591
1655
|
}
|
|
1592
|
-
.checkbox-indicator {
|
|
1656
|
+
._ao-checkbox-indicator {
|
|
1593
1657
|
display: inline-flex;
|
|
1594
1658
|
width: calc(var(--spacing) * 3);
|
|
1595
1659
|
height: calc(var(--spacing) * 3);
|
|
@@ -1597,19 +1661,19 @@
|
|
|
1597
1661
|
justify-content: center;
|
|
1598
1662
|
color: var(--color-primary-content);
|
|
1599
1663
|
}
|
|
1600
|
-
label:has(> .checkbox) {
|
|
1664
|
+
label:has(> ._ao-checkbox) {
|
|
1601
1665
|
display: inline-flex;
|
|
1602
1666
|
cursor: pointer;
|
|
1603
1667
|
align-items: center;
|
|
1604
1668
|
gap: calc(var(--spacing) * 2);
|
|
1605
1669
|
}
|
|
1606
|
-
label:has(> .checkbox:disabled), label:has(> .checkbox[data-disabled]) {
|
|
1670
|
+
label:has(> ._ao-checkbox:disabled), label:has(> ._ao-checkbox[data-disabled]) {
|
|
1607
1671
|
cursor: not-allowed;
|
|
1608
1672
|
opacity: 60%;
|
|
1609
1673
|
}
|
|
1610
1674
|
}
|
|
1611
1675
|
@layer components {
|
|
1612
|
-
.radio {
|
|
1676
|
+
._ao-radio {
|
|
1613
1677
|
display: inline-flex;
|
|
1614
1678
|
width: calc(var(--spacing) * 4);
|
|
1615
1679
|
height: calc(var(--spacing) * 4);
|
|
@@ -1643,7 +1707,7 @@
|
|
|
1643
1707
|
opacity: 50%;
|
|
1644
1708
|
}
|
|
1645
1709
|
}
|
|
1646
|
-
.radio[data-unchecked] {
|
|
1710
|
+
._ao-radio[data-unchecked] {
|
|
1647
1711
|
border-color: var(--color-border-strong);
|
|
1648
1712
|
&:hover {
|
|
1649
1713
|
@media (hover: hover) {
|
|
@@ -1651,7 +1715,7 @@
|
|
|
1651
1715
|
}
|
|
1652
1716
|
}
|
|
1653
1717
|
}
|
|
1654
|
-
.radio[data-checked] {
|
|
1718
|
+
._ao-radio[data-checked] {
|
|
1655
1719
|
border-color: var(--color-primary);
|
|
1656
1720
|
background-color: var(--color-primary);
|
|
1657
1721
|
&:hover {
|
|
@@ -1660,40 +1724,40 @@
|
|
|
1660
1724
|
}
|
|
1661
1725
|
}
|
|
1662
1726
|
}
|
|
1663
|
-
.radio[data-disabled] {
|
|
1727
|
+
._ao-radio[data-disabled] {
|
|
1664
1728
|
cursor: not-allowed;
|
|
1665
1729
|
opacity: 50%;
|
|
1666
1730
|
}
|
|
1667
|
-
.radio-indicator {
|
|
1731
|
+
._ao-radio-indicator {
|
|
1668
1732
|
display: inline-flex;
|
|
1669
1733
|
width: calc(var(--spacing) * 1.5);
|
|
1670
1734
|
height: calc(var(--spacing) * 1.5);
|
|
1671
1735
|
border-radius: calc(infinity * 1px);
|
|
1672
1736
|
background-color: var(--color-primary-content);
|
|
1673
1737
|
}
|
|
1674
|
-
.radio-group {
|
|
1738
|
+
._ao-radio-group {
|
|
1675
1739
|
display: inline-flex;
|
|
1676
1740
|
flex-wrap: wrap;
|
|
1677
1741
|
gap: calc(var(--spacing) * 4);
|
|
1678
1742
|
}
|
|
1679
|
-
.radio-group-vertical {
|
|
1743
|
+
._ao-radio-group-vertical {
|
|
1680
1744
|
flex-direction: column;
|
|
1681
1745
|
align-items: flex-start;
|
|
1682
1746
|
gap: calc(var(--spacing) * 2);
|
|
1683
1747
|
}
|
|
1684
|
-
label:has(> .radio) {
|
|
1748
|
+
label:has(> ._ao-radio) {
|
|
1685
1749
|
display: inline-flex;
|
|
1686
1750
|
cursor: pointer;
|
|
1687
1751
|
align-items: center;
|
|
1688
1752
|
gap: calc(var(--spacing) * 2);
|
|
1689
1753
|
}
|
|
1690
|
-
label:has(> .radio:disabled), label:has(> .radio[data-disabled]) {
|
|
1754
|
+
label:has(> ._ao-radio:disabled), label:has(> ._ao-radio[data-disabled]) {
|
|
1691
1755
|
cursor: not-allowed;
|
|
1692
1756
|
opacity: 60%;
|
|
1693
1757
|
}
|
|
1694
1758
|
}
|
|
1695
1759
|
@layer components {
|
|
1696
|
-
.switch {
|
|
1760
|
+
._ao-switch {
|
|
1697
1761
|
position: relative;
|
|
1698
1762
|
display: inline-flex;
|
|
1699
1763
|
height: calc(var(--spacing) * 5);
|
|
@@ -1728,17 +1792,17 @@
|
|
|
1728
1792
|
opacity: 50%;
|
|
1729
1793
|
}
|
|
1730
1794
|
}
|
|
1731
|
-
.switch[data-unchecked] {
|
|
1795
|
+
._ao-switch[data-unchecked] {
|
|
1732
1796
|
background-color: var(--color-border-strong);
|
|
1733
1797
|
}
|
|
1734
|
-
.switch[data-checked] {
|
|
1798
|
+
._ao-switch[data-checked] {
|
|
1735
1799
|
background-color: var(--color-primary);
|
|
1736
1800
|
}
|
|
1737
|
-
.switch[data-disabled] {
|
|
1801
|
+
._ao-switch[data-disabled] {
|
|
1738
1802
|
cursor: not-allowed;
|
|
1739
1803
|
opacity: 50%;
|
|
1740
1804
|
}
|
|
1741
|
-
.switch-thumb {
|
|
1805
|
+
._ao-switch-thumb {
|
|
1742
1806
|
width: calc(var(--spacing) * 4);
|
|
1743
1807
|
height: calc(var(--spacing) * 4);
|
|
1744
1808
|
border-radius: calc(infinity * 1px);
|
|
@@ -1751,19 +1815,19 @@
|
|
|
1751
1815
|
--tw-duration: 150ms;
|
|
1752
1816
|
transition-duration: 150ms;
|
|
1753
1817
|
}
|
|
1754
|
-
.switch[data-checked] .switch-thumb {
|
|
1818
|
+
._ao-switch[data-checked] ._ao-switch-thumb {
|
|
1755
1819
|
--tw-translate-x: calc(var(--spacing) * 4);
|
|
1756
1820
|
translate: var(--tw-translate-x) var(--tw-translate-y);
|
|
1757
1821
|
}
|
|
1758
|
-
input.switch {
|
|
1822
|
+
input._ao-switch {
|
|
1759
1823
|
margin: calc(var(--spacing) * 0);
|
|
1760
1824
|
appearance: none;
|
|
1761
1825
|
background-color: var(--color-border-strong);
|
|
1762
1826
|
}
|
|
1763
|
-
input.switch:checked {
|
|
1827
|
+
input._ao-switch:checked {
|
|
1764
1828
|
background-color: var(--color-primary);
|
|
1765
1829
|
}
|
|
1766
|
-
input.switch::before {
|
|
1830
|
+
input._ao-switch::before {
|
|
1767
1831
|
content: "";
|
|
1768
1832
|
width: calc(var(--spacing) * 4);
|
|
1769
1833
|
height: calc(var(--spacing) * 4);
|
|
@@ -1777,23 +1841,23 @@
|
|
|
1777
1841
|
--tw-duration: 150ms;
|
|
1778
1842
|
transition-duration: 150ms;
|
|
1779
1843
|
}
|
|
1780
|
-
input.switch:checked::before {
|
|
1844
|
+
input._ao-switch:checked::before {
|
|
1781
1845
|
--tw-translate-x: calc(var(--spacing) * 4);
|
|
1782
1846
|
translate: var(--tw-translate-x) var(--tw-translate-y);
|
|
1783
1847
|
}
|
|
1784
|
-
label:has(> .switch) {
|
|
1848
|
+
label:has(> ._ao-switch) {
|
|
1785
1849
|
display: inline-flex;
|
|
1786
1850
|
cursor: pointer;
|
|
1787
1851
|
align-items: center;
|
|
1788
1852
|
gap: calc(var(--spacing) * 3);
|
|
1789
1853
|
}
|
|
1790
|
-
label:has(> .switch:disabled), label:has(> .switch[data-disabled]) {
|
|
1854
|
+
label:has(> ._ao-switch:disabled), label:has(> ._ao-switch[data-disabled]) {
|
|
1791
1855
|
cursor: not-allowed;
|
|
1792
1856
|
opacity: 60%;
|
|
1793
1857
|
}
|
|
1794
1858
|
}
|
|
1795
1859
|
@layer components {
|
|
1796
|
-
.select {
|
|
1860
|
+
._ao-select {
|
|
1797
1861
|
display: inline-flex;
|
|
1798
1862
|
width: 100%;
|
|
1799
1863
|
cursor: pointer;
|
|
@@ -1837,16 +1901,16 @@
|
|
|
1837
1901
|
opacity: 50%;
|
|
1838
1902
|
}
|
|
1839
1903
|
}
|
|
1840
|
-
.select[data-popup-open] {
|
|
1904
|
+
._ao-select[data-popup-open] {
|
|
1841
1905
|
outline-style: var(--tw-outline-style);
|
|
1842
1906
|
outline-width: 2px;
|
|
1843
1907
|
outline-offset: 2px;
|
|
1844
1908
|
outline-color: var(--color-primary);
|
|
1845
1909
|
}
|
|
1846
|
-
.select[data-placeholder] {
|
|
1910
|
+
._ao-select[data-placeholder] {
|
|
1847
1911
|
color: var(--color-text-muted);
|
|
1848
1912
|
}
|
|
1849
|
-
.select-bordered {
|
|
1913
|
+
._ao-select-bordered {
|
|
1850
1914
|
border-color: var(--color-border);
|
|
1851
1915
|
&:hover {
|
|
1852
1916
|
@media (hover: hover) {
|
|
@@ -1854,7 +1918,7 @@
|
|
|
1854
1918
|
}
|
|
1855
1919
|
}
|
|
1856
1920
|
}
|
|
1857
|
-
.select-ghost {
|
|
1921
|
+
._ao-select-ghost {
|
|
1858
1922
|
background-color: transparent;
|
|
1859
1923
|
&:hover {
|
|
1860
1924
|
@media (hover: hover) {
|
|
@@ -1862,25 +1926,25 @@
|
|
|
1862
1926
|
}
|
|
1863
1927
|
}
|
|
1864
1928
|
}
|
|
1865
|
-
.select-danger {
|
|
1929
|
+
._ao-select-danger {
|
|
1866
1930
|
border-color: var(--color-danger);
|
|
1867
1931
|
&:focus-visible {
|
|
1868
1932
|
outline-color: var(--color-danger);
|
|
1869
1933
|
}
|
|
1870
1934
|
}
|
|
1871
|
-
.select-sm {
|
|
1935
|
+
._ao-select-sm {
|
|
1872
1936
|
padding-inline: calc(var(--spacing) * 2.5);
|
|
1873
1937
|
padding-block: calc(var(--spacing) * 1.5);
|
|
1874
1938
|
font-size: var(--text-xs);
|
|
1875
1939
|
line-height: var(--tw-leading, var(--text-xs--line-height));
|
|
1876
1940
|
}
|
|
1877
|
-
.select-lg {
|
|
1941
|
+
._ao-select-lg {
|
|
1878
1942
|
padding-inline: calc(var(--spacing) * 4);
|
|
1879
1943
|
padding-block: calc(var(--spacing) * 2.5);
|
|
1880
1944
|
font-size: var(--text-base);
|
|
1881
1945
|
line-height: var(--tw-leading, var(--text-base--line-height));
|
|
1882
1946
|
}
|
|
1883
|
-
select.select {
|
|
1947
|
+
select._ao-select {
|
|
1884
1948
|
appearance: none;
|
|
1885
1949
|
padding-right: 2rem;
|
|
1886
1950
|
background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23878580' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
|
|
@@ -1888,14 +1952,14 @@
|
|
|
1888
1952
|
background-position: right 0.5rem center;
|
|
1889
1953
|
background-size: 1rem;
|
|
1890
1954
|
}
|
|
1891
|
-
select.select-sm {
|
|
1955
|
+
select._ao-select-sm {
|
|
1892
1956
|
padding-right: 1.75rem;
|
|
1893
1957
|
background-size: 0.875rem;
|
|
1894
1958
|
}
|
|
1895
|
-
select.select-lg {
|
|
1959
|
+
select._ao-select-lg {
|
|
1896
1960
|
padding-right: 2.25rem;
|
|
1897
1961
|
}
|
|
1898
|
-
.select-icon {
|
|
1962
|
+
._ao-select-icon {
|
|
1899
1963
|
display: inline-flex;
|
|
1900
1964
|
width: calc(var(--spacing) * 4);
|
|
1901
1965
|
height: calc(var(--spacing) * 4);
|
|
@@ -1909,10 +1973,10 @@
|
|
|
1909
1973
|
--tw-duration: 150ms;
|
|
1910
1974
|
transition-duration: 150ms;
|
|
1911
1975
|
}
|
|
1912
|
-
.select[data-popup-open] .select-icon {
|
|
1976
|
+
._ao-select[data-popup-open] ._ao-select-icon {
|
|
1913
1977
|
rotate: 180deg;
|
|
1914
1978
|
}
|
|
1915
|
-
.select-popup {
|
|
1979
|
+
._ao-select-popup {
|
|
1916
1980
|
max-height: calc(var(--spacing) * 72);
|
|
1917
1981
|
min-width: var(--anchor-width);
|
|
1918
1982
|
overflow: auto;
|
|
@@ -1933,14 +1997,14 @@
|
|
|
1933
1997
|
--tw-outline-style: none;
|
|
1934
1998
|
outline-style: none;
|
|
1935
1999
|
}
|
|
1936
|
-
.select-popup[data-starting-style], .select-popup[data-ending-style] {
|
|
2000
|
+
._ao-select-popup[data-starting-style], ._ao-select-popup[data-ending-style] {
|
|
1937
2001
|
opacity: 0%;
|
|
1938
2002
|
}
|
|
1939
|
-
.select-popup[data-starting-style] {
|
|
2003
|
+
._ao-select-popup[data-starting-style] {
|
|
1940
2004
|
--tw-translate-y: calc(var(--spacing) * -1);
|
|
1941
2005
|
translate: var(--tw-translate-x) var(--tw-translate-y);
|
|
1942
2006
|
}
|
|
1943
|
-
.select-item {
|
|
2007
|
+
._ao-select-item {
|
|
1944
2008
|
display: flex;
|
|
1945
2009
|
cursor: pointer;
|
|
1946
2010
|
align-items: center;
|
|
@@ -1954,18 +2018,18 @@
|
|
|
1954
2018
|
-webkit-user-select: none;
|
|
1955
2019
|
user-select: none;
|
|
1956
2020
|
}
|
|
1957
|
-
.select-item[data-highlighted] {
|
|
2021
|
+
._ao-select-item[data-highlighted] {
|
|
1958
2022
|
background-color: var(--color-surface-muted);
|
|
1959
2023
|
}
|
|
1960
|
-
.select-item[data-selected] {
|
|
2024
|
+
._ao-select-item[data-selected] {
|
|
1961
2025
|
--tw-font-weight: var(--font-weight-medium);
|
|
1962
2026
|
font-weight: var(--font-weight-medium);
|
|
1963
2027
|
}
|
|
1964
|
-
.select-item[data-disabled] {
|
|
2028
|
+
._ao-select-item[data-disabled] {
|
|
1965
2029
|
cursor: not-allowed;
|
|
1966
2030
|
opacity: 50%;
|
|
1967
2031
|
}
|
|
1968
|
-
.select-item-indicator {
|
|
2032
|
+
._ao-select-item-indicator {
|
|
1969
2033
|
margin-left: auto;
|
|
1970
2034
|
display: inline-flex;
|
|
1971
2035
|
width: calc(var(--spacing) * 4);
|
|
@@ -1974,7 +2038,7 @@
|
|
|
1974
2038
|
justify-content: center;
|
|
1975
2039
|
color: var(--color-primary);
|
|
1976
2040
|
}
|
|
1977
|
-
.select-group-label {
|
|
2041
|
+
._ao-select-group-label {
|
|
1978
2042
|
padding-inline: calc(var(--spacing) * 3);
|
|
1979
2043
|
padding-top: calc(var(--spacing) * 2);
|
|
1980
2044
|
padding-bottom: calc(var(--spacing) * 1);
|
|
@@ -1987,7 +2051,7 @@
|
|
|
1987
2051
|
}
|
|
1988
2052
|
}
|
|
1989
2053
|
@layer components {
|
|
1990
|
-
.card {
|
|
2054
|
+
._ao-card {
|
|
1991
2055
|
display: flex;
|
|
1992
2056
|
flex-direction: column;
|
|
1993
2057
|
overflow: hidden;
|
|
@@ -2000,13 +2064,13 @@
|
|
|
2000
2064
|
--tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.05));
|
|
2001
2065
|
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
|
|
2002
2066
|
}
|
|
2003
|
-
.card-body {
|
|
2067
|
+
._ao-card-body {
|
|
2004
2068
|
display: flex;
|
|
2005
2069
|
flex-direction: column;
|
|
2006
2070
|
gap: calc(var(--spacing) * 3);
|
|
2007
2071
|
padding: calc(var(--spacing) * 5);
|
|
2008
2072
|
}
|
|
2009
|
-
.card-title {
|
|
2073
|
+
._ao-card-title {
|
|
2010
2074
|
display: flex;
|
|
2011
2075
|
align-items: center;
|
|
2012
2076
|
gap: calc(var(--spacing) * 2);
|
|
@@ -2017,12 +2081,12 @@
|
|
|
2017
2081
|
--tw-font-weight: var(--font-weight-semibold);
|
|
2018
2082
|
font-weight: var(--font-weight-semibold);
|
|
2019
2083
|
}
|
|
2020
|
-
.card-description {
|
|
2084
|
+
._ao-card-description {
|
|
2021
2085
|
font-size: var(--text-sm);
|
|
2022
2086
|
line-height: var(--tw-leading, var(--text-sm--line-height));
|
|
2023
2087
|
color: var(--color-text-muted);
|
|
2024
2088
|
}
|
|
2025
|
-
.card-actions {
|
|
2089
|
+
._ao-card-actions {
|
|
2026
2090
|
margin-top: auto;
|
|
2027
2091
|
display: flex;
|
|
2028
2092
|
flex-wrap: wrap;
|
|
@@ -2030,18 +2094,18 @@
|
|
|
2030
2094
|
gap: calc(var(--spacing) * 2);
|
|
2031
2095
|
padding-top: calc(var(--spacing) * 2);
|
|
2032
2096
|
}
|
|
2033
|
-
.card-compact .card-body {
|
|
2097
|
+
._ao-card-compact ._ao-card-body {
|
|
2034
2098
|
gap: calc(var(--spacing) * 2);
|
|
2035
2099
|
padding: calc(var(--spacing) * 3);
|
|
2036
2100
|
}
|
|
2037
|
-
.card-bordered {
|
|
2101
|
+
._ao-card-bordered {
|
|
2038
2102
|
border-color: var(--color-border-strong);
|
|
2039
2103
|
--tw-shadow: 0 0 #0000;
|
|
2040
2104
|
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
|
|
2041
2105
|
}
|
|
2042
2106
|
}
|
|
2043
2107
|
@layer components {
|
|
2044
|
-
.dialog {
|
|
2108
|
+
._ao-dialog {
|
|
2045
2109
|
margin: auto;
|
|
2046
2110
|
flex-direction: column;
|
|
2047
2111
|
overflow: hidden;
|
|
@@ -2061,29 +2125,29 @@
|
|
|
2061
2125
|
transform: translateY(0) scale(1);
|
|
2062
2126
|
transition: display 150ms allow-discrete, overlay 150ms allow-discrete, opacity 150ms ease-out, transform 150ms ease-out;
|
|
2063
2127
|
}
|
|
2064
|
-
.dialog[open] {
|
|
2128
|
+
._ao-dialog[open] {
|
|
2065
2129
|
display: flex;
|
|
2066
2130
|
}
|
|
2067
|
-
.dialog::backdrop {
|
|
2131
|
+
._ao-dialog::backdrop {
|
|
2068
2132
|
background: rgb(0 0 0 / 0.4);
|
|
2069
2133
|
transition: display 150ms allow-discrete, overlay 150ms allow-discrete, background 150ms ease-out;
|
|
2070
2134
|
}
|
|
2071
2135
|
@starting-style {
|
|
2072
|
-
.dialog[open] {
|
|
2136
|
+
._ao-dialog[open] {
|
|
2073
2137
|
opacity: 0;
|
|
2074
2138
|
transform: translateY(-0.5rem) scale(0.98);
|
|
2075
2139
|
}
|
|
2076
|
-
.dialog[open]::backdrop {
|
|
2140
|
+
._ao-dialog[open]::backdrop {
|
|
2077
2141
|
background: rgb(0 0 0 / 0);
|
|
2078
2142
|
}
|
|
2079
2143
|
}
|
|
2080
|
-
.dialog-sm {
|
|
2144
|
+
._ao-dialog-sm {
|
|
2081
2145
|
max-width: 24rem;
|
|
2082
2146
|
}
|
|
2083
|
-
.dialog-lg {
|
|
2147
|
+
._ao-dialog-lg {
|
|
2084
2148
|
max-width: 48rem;
|
|
2085
2149
|
}
|
|
2086
|
-
.dialog-header {
|
|
2150
|
+
._ao-dialog-header {
|
|
2087
2151
|
display: flex;
|
|
2088
2152
|
align-items: flex-start;
|
|
2089
2153
|
gap: calc(var(--spacing) * 3);
|
|
@@ -2091,7 +2155,7 @@
|
|
|
2091
2155
|
padding-top: calc(var(--spacing) * 5);
|
|
2092
2156
|
padding-bottom: calc(var(--spacing) * 3);
|
|
2093
2157
|
}
|
|
2094
|
-
.dialog-title {
|
|
2158
|
+
._ao-dialog-title {
|
|
2095
2159
|
margin: calc(var(--spacing) * 0);
|
|
2096
2160
|
display: flex;
|
|
2097
2161
|
flex: 1;
|
|
@@ -2104,7 +2168,7 @@
|
|
|
2104
2168
|
--tw-font-weight: var(--font-weight-semibold);
|
|
2105
2169
|
font-weight: var(--font-weight-semibold);
|
|
2106
2170
|
}
|
|
2107
|
-
.dialog-description {
|
|
2171
|
+
._ao-dialog-description {
|
|
2108
2172
|
margin-top: calc(var(--spacing) * -2);
|
|
2109
2173
|
margin-bottom: calc(var(--spacing) * 3);
|
|
2110
2174
|
padding-inline: calc(var(--spacing) * 5);
|
|
@@ -2112,7 +2176,7 @@
|
|
|
2112
2176
|
line-height: var(--tw-leading, var(--text-sm--line-height));
|
|
2113
2177
|
color: var(--color-text-muted);
|
|
2114
2178
|
}
|
|
2115
|
-
.dialog-body {
|
|
2179
|
+
._ao-dialog-body {
|
|
2116
2180
|
display: flex;
|
|
2117
2181
|
flex-direction: column;
|
|
2118
2182
|
gap: calc(var(--spacing) * 3);
|
|
@@ -2120,7 +2184,7 @@
|
|
|
2120
2184
|
padding-inline: calc(var(--spacing) * 5);
|
|
2121
2185
|
padding-block: calc(var(--spacing) * 3);
|
|
2122
2186
|
}
|
|
2123
|
-
.dialog-footer {
|
|
2187
|
+
._ao-dialog-footer {
|
|
2124
2188
|
display: flex;
|
|
2125
2189
|
flex-wrap: wrap;
|
|
2126
2190
|
align-items: center;
|
|
@@ -2133,7 +2197,7 @@
|
|
|
2133
2197
|
padding-inline: calc(var(--spacing) * 5);
|
|
2134
2198
|
padding-block: calc(var(--spacing) * 3);
|
|
2135
2199
|
}
|
|
2136
|
-
.dialog-close {
|
|
2200
|
+
._ao-dialog-close {
|
|
2137
2201
|
display: inline-flex;
|
|
2138
2202
|
width: calc(var(--spacing) * 7);
|
|
2139
2203
|
height: calc(var(--spacing) * 7);
|
|
@@ -2172,17 +2236,17 @@
|
|
|
2172
2236
|
}
|
|
2173
2237
|
}
|
|
2174
2238
|
@layer components {
|
|
2175
|
-
.field {
|
|
2239
|
+
._ao-field {
|
|
2176
2240
|
display: flex;
|
|
2177
2241
|
flex-direction: column;
|
|
2178
2242
|
gap: calc(var(--spacing) * 1.5);
|
|
2179
2243
|
}
|
|
2180
|
-
.field-row {
|
|
2244
|
+
._ao-field-row {
|
|
2181
2245
|
flex-direction: row;
|
|
2182
2246
|
align-items: center;
|
|
2183
2247
|
gap: calc(var(--spacing) * 3);
|
|
2184
2248
|
}
|
|
2185
|
-
.field-label {
|
|
2249
|
+
._ao-field-label {
|
|
2186
2250
|
font-size: var(--text-sm);
|
|
2187
2251
|
line-height: var(--tw-leading, var(--text-sm--line-height));
|
|
2188
2252
|
--tw-leading: 1;
|
|
@@ -2191,41 +2255,41 @@
|
|
|
2191
2255
|
font-weight: var(--font-weight-medium);
|
|
2192
2256
|
color: var(--color-text);
|
|
2193
2257
|
}
|
|
2194
|
-
.field-label[data-required]::after {
|
|
2258
|
+
._ao-field-label[data-required]::after {
|
|
2195
2259
|
content: " *";
|
|
2196
2260
|
color: var(--color-danger);
|
|
2197
2261
|
}
|
|
2198
|
-
.asteriskField {
|
|
2262
|
+
._ao-asteriskField {
|
|
2199
2263
|
color: var(--color-danger);
|
|
2200
2264
|
}
|
|
2201
|
-
.field-description {
|
|
2265
|
+
._ao-field-description {
|
|
2202
2266
|
font-size: var(--text-xs);
|
|
2203
2267
|
line-height: var(--tw-leading, var(--text-xs--line-height));
|
|
2204
2268
|
--tw-leading: var(--leading-relaxed);
|
|
2205
2269
|
line-height: var(--leading-relaxed);
|
|
2206
2270
|
color: var(--color-text-muted);
|
|
2207
2271
|
}
|
|
2208
|
-
.field-error {
|
|
2272
|
+
._ao-field-error {
|
|
2209
2273
|
font-size: var(--text-xs);
|
|
2210
2274
|
line-height: var(--tw-leading, var(--text-xs--line-height));
|
|
2211
2275
|
--tw-leading: var(--leading-relaxed);
|
|
2212
2276
|
line-height: var(--leading-relaxed);
|
|
2213
2277
|
color: var(--color-danger);
|
|
2214
2278
|
}
|
|
2215
|
-
.field[data-invalid] .input, .field[data-invalid] .textarea, .field[data-invalid] .select, .field[data-invalid] .file-input {
|
|
2279
|
+
._ao-field[data-invalid] ._ao-input, ._ao-field[data-invalid] ._ao-textarea, ._ao-field[data-invalid] ._ao-select, ._ao-field[data-invalid] ._ao-file-input {
|
|
2216
2280
|
border-color: var(--color-danger);
|
|
2217
2281
|
}
|
|
2218
|
-
.field[data-invalid] .checkbox[data-unchecked], .field[data-invalid] .radio[data-unchecked] {
|
|
2282
|
+
._ao-field[data-invalid] ._ao-checkbox[data-unchecked], ._ao-field[data-invalid] ._ao-radio[data-unchecked] {
|
|
2219
2283
|
border-color: var(--color-danger);
|
|
2220
2284
|
}
|
|
2221
|
-
.field[data-invalid] .switch[data-unchecked] {
|
|
2285
|
+
._ao-field[data-invalid] ._ao-switch[data-unchecked] {
|
|
2222
2286
|
--tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
|
|
2223
2287
|
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
|
|
2224
2288
|
--tw-ring-color: var(--color-danger);
|
|
2225
2289
|
}
|
|
2226
2290
|
}
|
|
2227
2291
|
@layer components {
|
|
2228
|
-
.file-input {
|
|
2292
|
+
._ao-file-input {
|
|
2229
2293
|
display: inline-flex;
|
|
2230
2294
|
width: 100%;
|
|
2231
2295
|
align-items: center;
|
|
@@ -2311,7 +2375,7 @@
|
|
|
2311
2375
|
opacity: 50%;
|
|
2312
2376
|
}
|
|
2313
2377
|
}
|
|
2314
|
-
.file-input-bordered {
|
|
2378
|
+
._ao-file-input-bordered {
|
|
2315
2379
|
border-color: var(--color-border);
|
|
2316
2380
|
&:hover {
|
|
2317
2381
|
@media (hover: hover) {
|
|
@@ -2319,7 +2383,7 @@
|
|
|
2319
2383
|
}
|
|
2320
2384
|
}
|
|
2321
2385
|
}
|
|
2322
|
-
.file-input-ghost {
|
|
2386
|
+
._ao-file-input-ghost {
|
|
2323
2387
|
background-color: transparent;
|
|
2324
2388
|
&:hover {
|
|
2325
2389
|
@media (hover: hover) {
|
|
@@ -2327,13 +2391,13 @@
|
|
|
2327
2391
|
}
|
|
2328
2392
|
}
|
|
2329
2393
|
}
|
|
2330
|
-
.file-input-danger {
|
|
2394
|
+
._ao-file-input-danger {
|
|
2331
2395
|
border-color: var(--color-danger);
|
|
2332
2396
|
&:focus-visible {
|
|
2333
2397
|
outline-color: var(--color-danger);
|
|
2334
2398
|
}
|
|
2335
2399
|
}
|
|
2336
|
-
.file-input-sm {
|
|
2400
|
+
._ao-file-input-sm {
|
|
2337
2401
|
font-size: var(--text-xs);
|
|
2338
2402
|
line-height: var(--tw-leading, var(--text-xs--line-height));
|
|
2339
2403
|
&::file-selector-button {
|
|
@@ -2350,7 +2414,7 @@
|
|
|
2350
2414
|
line-height: var(--tw-leading, var(--text-xs--line-height));
|
|
2351
2415
|
}
|
|
2352
2416
|
}
|
|
2353
|
-
.file-input-lg {
|
|
2417
|
+
._ao-file-input-lg {
|
|
2354
2418
|
font-size: var(--text-base);
|
|
2355
2419
|
line-height: var(--tw-leading, var(--text-base--line-height));
|
|
2356
2420
|
&::file-selector-button {
|
|
@@ -2369,7 +2433,7 @@
|
|
|
2369
2433
|
}
|
|
2370
2434
|
}
|
|
2371
2435
|
@layer components {
|
|
2372
|
-
.footer {
|
|
2436
|
+
._ao-footer {
|
|
2373
2437
|
display: flex;
|
|
2374
2438
|
flex-wrap: wrap;
|
|
2375
2439
|
align-items: center;
|
|
@@ -2385,13 +2449,13 @@
|
|
|
2385
2449
|
line-height: var(--tw-leading, var(--text-xs--line-height));
|
|
2386
2450
|
color: var(--color-text-muted);
|
|
2387
2451
|
}
|
|
2388
|
-
.footer-links {
|
|
2452
|
+
._ao-footer-links {
|
|
2389
2453
|
display: flex;
|
|
2390
2454
|
flex-wrap: wrap;
|
|
2391
2455
|
align-items: center;
|
|
2392
2456
|
gap: calc(var(--spacing) * 3);
|
|
2393
2457
|
}
|
|
2394
|
-
.footer-link {
|
|
2458
|
+
._ao-footer-link {
|
|
2395
2459
|
border-radius: var(--radius-sm);
|
|
2396
2460
|
color: var(--color-text-muted);
|
|
2397
2461
|
text-decoration-line: none;
|
|
@@ -2416,16 +2480,16 @@
|
|
|
2416
2480
|
outline-color: var(--color-primary);
|
|
2417
2481
|
}
|
|
2418
2482
|
}
|
|
2419
|
-
.footer-meta {
|
|
2483
|
+
._ao-footer-meta {
|
|
2420
2484
|
color: var(--color-text-muted);
|
|
2421
2485
|
}
|
|
2422
2486
|
}
|
|
2423
2487
|
@layer components {
|
|
2424
|
-
.menu {
|
|
2488
|
+
._ao-menu {
|
|
2425
2489
|
position: relative;
|
|
2426
2490
|
display: inline-block;
|
|
2427
2491
|
}
|
|
2428
|
-
.menu-trigger {
|
|
2492
|
+
._ao-menu-trigger {
|
|
2429
2493
|
display: inline-flex;
|
|
2430
2494
|
cursor: pointer;
|
|
2431
2495
|
align-items: center;
|
|
@@ -2449,10 +2513,10 @@
|
|
|
2449
2513
|
}
|
|
2450
2514
|
list-style: none;
|
|
2451
2515
|
}
|
|
2452
|
-
.menu-trigger::-webkit-details-marker {
|
|
2516
|
+
._ao-menu-trigger::-webkit-details-marker {
|
|
2453
2517
|
display: none;
|
|
2454
2518
|
}
|
|
2455
|
-
.menu-trigger:not(.btn) {
|
|
2519
|
+
._ao-menu-trigger:not(._ao-btn) {
|
|
2456
2520
|
border-radius: var(--radius-md);
|
|
2457
2521
|
background-color: transparent;
|
|
2458
2522
|
padding-inline: calc(var(--spacing) * 2.5);
|
|
@@ -2468,7 +2532,7 @@
|
|
|
2468
2532
|
}
|
|
2469
2533
|
}
|
|
2470
2534
|
}
|
|
2471
|
-
.menu-trigger::after {
|
|
2535
|
+
._ao-menu-trigger::after {
|
|
2472
2536
|
content: "";
|
|
2473
2537
|
width: 0.5em;
|
|
2474
2538
|
height: 0.5em;
|
|
@@ -2478,13 +2542,13 @@
|
|
|
2478
2542
|
transition: transform 150ms ease;
|
|
2479
2543
|
flex-shrink: 0;
|
|
2480
2544
|
}
|
|
2481
|
-
.menu-trigger:empty {
|
|
2545
|
+
._ao-menu-trigger:empty {
|
|
2482
2546
|
justify-content: center;
|
|
2483
2547
|
}
|
|
2484
|
-
.menu[open] > .menu-trigger::after {
|
|
2548
|
+
._ao-menu[open] > ._ao-menu-trigger::after {
|
|
2485
2549
|
transform: rotate(-135deg);
|
|
2486
2550
|
}
|
|
2487
|
-
.menu-popup {
|
|
2551
|
+
._ao-menu-popup {
|
|
2488
2552
|
position: absolute;
|
|
2489
2553
|
top: 100%;
|
|
2490
2554
|
left: calc(var(--spacing) * 0);
|
|
@@ -2503,7 +2567,7 @@
|
|
|
2503
2567
|
--tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 2px 4px -2px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
|
|
2504
2568
|
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
|
|
2505
2569
|
}
|
|
2506
|
-
.menu-item {
|
|
2570
|
+
._ao-menu-item {
|
|
2507
2571
|
display: flex;
|
|
2508
2572
|
width: 100%;
|
|
2509
2573
|
cursor: pointer;
|
|
@@ -2542,22 +2606,22 @@
|
|
|
2542
2606
|
opacity: 50%;
|
|
2543
2607
|
}
|
|
2544
2608
|
}
|
|
2545
|
-
.menu-item[aria-disabled="true"] {
|
|
2609
|
+
._ao-menu-item[aria-disabled="true"] {
|
|
2546
2610
|
cursor: not-allowed;
|
|
2547
2611
|
opacity: 50%;
|
|
2548
2612
|
}
|
|
2549
|
-
.menu-separator {
|
|
2613
|
+
._ao-menu-separator {
|
|
2550
2614
|
margin-block: calc(var(--spacing) * 1);
|
|
2551
2615
|
height: 1px;
|
|
2552
2616
|
border-style: var(--tw-border-style);
|
|
2553
2617
|
border-width: 0px;
|
|
2554
2618
|
background-color: var(--color-border);
|
|
2555
2619
|
}
|
|
2556
|
-
.menu-group {
|
|
2620
|
+
._ao-menu-group {
|
|
2557
2621
|
display: flex;
|
|
2558
2622
|
flex-direction: column;
|
|
2559
2623
|
}
|
|
2560
|
-
.menu-group-label {
|
|
2624
|
+
._ao-menu-group-label {
|
|
2561
2625
|
padding-inline: calc(var(--spacing) * 3);
|
|
2562
2626
|
padding-top: calc(var(--spacing) * 2);
|
|
2563
2627
|
padding-bottom: calc(var(--spacing) * 1);
|
|
@@ -2570,7 +2634,7 @@
|
|
|
2570
2634
|
}
|
|
2571
2635
|
}
|
|
2572
2636
|
@layer components {
|
|
2573
|
-
.navbar {
|
|
2637
|
+
._ao-navbar {
|
|
2574
2638
|
display: flex;
|
|
2575
2639
|
height: calc(var(--spacing) * 12);
|
|
2576
2640
|
align-items: center;
|
|
@@ -2582,7 +2646,7 @@
|
|
|
2582
2646
|
padding-inline: calc(var(--spacing) * 4);
|
|
2583
2647
|
color: var(--color-text);
|
|
2584
2648
|
}
|
|
2585
|
-
.navbar-brand {
|
|
2649
|
+
._ao-navbar-brand {
|
|
2586
2650
|
display: flex;
|
|
2587
2651
|
flex-shrink: 0;
|
|
2588
2652
|
align-items: center;
|
|
@@ -2593,12 +2657,12 @@
|
|
|
2593
2657
|
font-weight: var(--font-weight-semibold);
|
|
2594
2658
|
color: var(--color-text);
|
|
2595
2659
|
}
|
|
2596
|
-
.navbar-items {
|
|
2660
|
+
._ao-navbar-items {
|
|
2597
2661
|
display: flex;
|
|
2598
2662
|
align-items: center;
|
|
2599
2663
|
gap: calc(var(--spacing) * 0.5);
|
|
2600
2664
|
}
|
|
2601
|
-
.navbar-item {
|
|
2665
|
+
._ao-navbar-item {
|
|
2602
2666
|
display: inline-flex;
|
|
2603
2667
|
cursor: pointer;
|
|
2604
2668
|
align-items: center;
|
|
@@ -2635,17 +2699,17 @@
|
|
|
2635
2699
|
outline-color: var(--color-primary);
|
|
2636
2700
|
}
|
|
2637
2701
|
}
|
|
2638
|
-
.navbar-item[aria-current="page"], .navbar-item[data-active] {
|
|
2702
|
+
._ao-navbar-item[aria-current="page"], ._ao-navbar-item[data-active] {
|
|
2639
2703
|
background-color: var(--color-primary-muted);
|
|
2640
2704
|
color: var(--color-primary);
|
|
2641
2705
|
}
|
|
2642
|
-
.navbar-actions {
|
|
2706
|
+
._ao-navbar-actions {
|
|
2643
2707
|
margin-left: auto;
|
|
2644
2708
|
display: flex;
|
|
2645
2709
|
align-items: center;
|
|
2646
2710
|
gap: calc(var(--spacing) * 2);
|
|
2647
2711
|
}
|
|
2648
|
-
.navbar-mobile-toggle {
|
|
2712
|
+
._ao-navbar-mobile-toggle {
|
|
2649
2713
|
margin-left: calc(var(--spacing) * -2);
|
|
2650
2714
|
display: inline-flex;
|
|
2651
2715
|
width: calc(var(--spacing) * 9);
|
|
@@ -2672,7 +2736,7 @@
|
|
|
2672
2736
|
outline-color: var(--color-primary);
|
|
2673
2737
|
}
|
|
2674
2738
|
}
|
|
2675
|
-
.navbar-mobile-toggle::before {
|
|
2739
|
+
._ao-navbar-mobile-toggle::before {
|
|
2676
2740
|
content: "";
|
|
2677
2741
|
display: block;
|
|
2678
2742
|
width: 18px;
|
|
@@ -2682,13 +2746,13 @@
|
|
|
2682
2746
|
box-shadow: 0 -6px 0 currentColor, 0 6px 0 currentColor;
|
|
2683
2747
|
}
|
|
2684
2748
|
@media (min-width: 48rem) {
|
|
2685
|
-
.navbar-mobile-toggle {
|
|
2749
|
+
._ao-navbar-mobile-toggle {
|
|
2686
2750
|
display: none;
|
|
2687
2751
|
}
|
|
2688
2752
|
}
|
|
2689
2753
|
}
|
|
2690
2754
|
@layer components {
|
|
2691
|
-
.sidebar {
|
|
2755
|
+
._ao-sidebar {
|
|
2692
2756
|
display: flex;
|
|
2693
2757
|
flex-shrink: 0;
|
|
2694
2758
|
flex-direction: column;
|
|
@@ -2700,7 +2764,7 @@
|
|
|
2700
2764
|
width: var(--app-shell-sidebar-w, 240px);
|
|
2701
2765
|
transition: width 150ms ease;
|
|
2702
2766
|
}
|
|
2703
|
-
.sidebar-toggle {
|
|
2767
|
+
._ao-sidebar-toggle {
|
|
2704
2768
|
position: absolute;
|
|
2705
2769
|
width: 1px;
|
|
2706
2770
|
height: 1px;
|
|
@@ -2710,17 +2774,17 @@
|
|
|
2710
2774
|
opacity: 0;
|
|
2711
2775
|
pointer-events: none;
|
|
2712
2776
|
}
|
|
2713
|
-
.sidebar:has(.sidebar-toggle:checked) {
|
|
2777
|
+
._ao-sidebar:has(._ao-sidebar-toggle:checked) {
|
|
2714
2778
|
width: var(--app-shell-sidebar-w-collapsed, 56px);
|
|
2715
2779
|
}
|
|
2716
|
-
.sidebar:has(.sidebar-toggle:checked) .sidebar-label, .sidebar:has(.sidebar-toggle:checked) .sidebar-group-label, .sidebar:has(.sidebar-toggle:checked) .sidebar-badge, .sidebar:has(.sidebar-toggle:checked) .sidebar-collapsible-panel, .sidebar:has(.sidebar-toggle:checked) .sidebar-collapsible-trigger::after {
|
|
2780
|
+
._ao-sidebar:has(._ao-sidebar-toggle:checked) ._ao-sidebar-label, ._ao-sidebar:has(._ao-sidebar-toggle:checked) ._ao-sidebar-group-label, ._ao-sidebar:has(._ao-sidebar-toggle:checked) ._ao-sidebar-badge, ._ao-sidebar:has(._ao-sidebar-toggle:checked) ._ao-sidebar-collapsible-panel, ._ao-sidebar:has(._ao-sidebar-toggle:checked) ._ao-sidebar-collapsible-trigger::after {
|
|
2717
2781
|
display: none;
|
|
2718
2782
|
}
|
|
2719
|
-
.sidebar:has(.sidebar-toggle:checked) .sidebar-item, .sidebar:has(.sidebar-toggle:checked) .sidebar-subitem, .sidebar:has(.sidebar-toggle:checked) .sidebar-collapsible-trigger {
|
|
2783
|
+
._ao-sidebar:has(._ao-sidebar-toggle:checked) ._ao-sidebar-item, ._ao-sidebar:has(._ao-sidebar-toggle:checked) ._ao-sidebar-subitem, ._ao-sidebar:has(._ao-sidebar-toggle:checked) ._ao-sidebar-collapsible-trigger {
|
|
2720
2784
|
justify-content: center;
|
|
2721
2785
|
padding-inline: calc(var(--spacing) * 1);
|
|
2722
2786
|
}
|
|
2723
|
-
.sidebar-header {
|
|
2787
|
+
._ao-sidebar-header {
|
|
2724
2788
|
display: flex;
|
|
2725
2789
|
height: calc(var(--spacing) * 12);
|
|
2726
2790
|
flex-shrink: 0;
|
|
@@ -2731,7 +2795,7 @@
|
|
|
2731
2795
|
border-color: var(--color-border);
|
|
2732
2796
|
padding-inline: calc(var(--spacing) * 3);
|
|
2733
2797
|
}
|
|
2734
|
-
.sidebar-nav {
|
|
2798
|
+
._ao-sidebar-nav {
|
|
2735
2799
|
display: flex;
|
|
2736
2800
|
flex: 1;
|
|
2737
2801
|
flex-direction: column;
|
|
@@ -2740,15 +2804,15 @@
|
|
|
2740
2804
|
padding-inline: calc(var(--spacing) * 2);
|
|
2741
2805
|
padding-block: calc(var(--spacing) * 2);
|
|
2742
2806
|
}
|
|
2743
|
-
.sidebar-group {
|
|
2807
|
+
._ao-sidebar-group {
|
|
2744
2808
|
display: flex;
|
|
2745
2809
|
flex-direction: column;
|
|
2746
2810
|
gap: calc(var(--spacing) * 0.5);
|
|
2747
2811
|
}
|
|
2748
|
-
.sidebar-group + .sidebar-group {
|
|
2812
|
+
._ao-sidebar-group + ._ao-sidebar-group {
|
|
2749
2813
|
margin-top: calc(var(--spacing) * 2);
|
|
2750
2814
|
}
|
|
2751
|
-
.sidebar-group-label {
|
|
2815
|
+
._ao-sidebar-group-label {
|
|
2752
2816
|
padding-inline: calc(var(--spacing) * 2);
|
|
2753
2817
|
padding-top: calc(var(--spacing) * 2);
|
|
2754
2818
|
padding-bottom: calc(var(--spacing) * 1);
|
|
@@ -2759,7 +2823,7 @@
|
|
|
2759
2823
|
color: var(--color-text-muted);
|
|
2760
2824
|
text-transform: uppercase;
|
|
2761
2825
|
}
|
|
2762
|
-
.sidebar-item {
|
|
2826
|
+
._ao-sidebar-item {
|
|
2763
2827
|
display: flex;
|
|
2764
2828
|
cursor: pointer;
|
|
2765
2829
|
align-items: center;
|
|
@@ -2797,13 +2861,13 @@
|
|
|
2797
2861
|
outline-color: var(--color-primary);
|
|
2798
2862
|
}
|
|
2799
2863
|
}
|
|
2800
|
-
.sidebar-item[aria-current="page"], .sidebar-item[data-active] {
|
|
2864
|
+
._ao-sidebar-item[aria-current="page"], ._ao-sidebar-item[data-active] {
|
|
2801
2865
|
background-color: var(--color-primary-muted);
|
|
2802
2866
|
--tw-font-weight: var(--font-weight-medium);
|
|
2803
2867
|
font-weight: var(--font-weight-medium);
|
|
2804
2868
|
color: var(--color-primary);
|
|
2805
2869
|
}
|
|
2806
|
-
.sidebar-icon {
|
|
2870
|
+
._ao-sidebar-icon {
|
|
2807
2871
|
display: inline-flex;
|
|
2808
2872
|
width: calc(var(--spacing) * 4);
|
|
2809
2873
|
height: calc(var(--spacing) * 4);
|
|
@@ -2812,17 +2876,17 @@
|
|
|
2812
2876
|
justify-content: center;
|
|
2813
2877
|
color: var(--color-text-muted);
|
|
2814
2878
|
}
|
|
2815
|
-
.sidebar-item[aria-current="page"] .sidebar-icon, .sidebar-item[data-active] .sidebar-icon {
|
|
2879
|
+
._ao-sidebar-item[aria-current="page"] ._ao-sidebar-icon, ._ao-sidebar-item[data-active] ._ao-sidebar-icon {
|
|
2816
2880
|
color: var(--color-primary);
|
|
2817
2881
|
}
|
|
2818
|
-
.sidebar-label {
|
|
2882
|
+
._ao-sidebar-label {
|
|
2819
2883
|
min-width: calc(var(--spacing) * 0);
|
|
2820
2884
|
flex: 1;
|
|
2821
2885
|
overflow: hidden;
|
|
2822
2886
|
text-overflow: ellipsis;
|
|
2823
2887
|
white-space: nowrap;
|
|
2824
2888
|
}
|
|
2825
|
-
.sidebar-badge {
|
|
2889
|
+
._ao-sidebar-badge {
|
|
2826
2890
|
margin-left: auto;
|
|
2827
2891
|
display: inline-flex;
|
|
2828
2892
|
height: calc(var(--spacing) * 5);
|
|
@@ -2838,12 +2902,12 @@
|
|
|
2838
2902
|
font-weight: var(--font-weight-medium);
|
|
2839
2903
|
color: var(--color-text-muted);
|
|
2840
2904
|
}
|
|
2841
|
-
.sidebar-collapsible {
|
|
2905
|
+
._ao-sidebar-collapsible {
|
|
2842
2906
|
display: flex;
|
|
2843
2907
|
flex-direction: column;
|
|
2844
2908
|
interpolate-size: allow-keywords;
|
|
2845
2909
|
}
|
|
2846
|
-
.sidebar-collapsible-trigger {
|
|
2910
|
+
._ao-sidebar-collapsible-trigger {
|
|
2847
2911
|
display: flex;
|
|
2848
2912
|
width: 100%;
|
|
2849
2913
|
cursor: pointer;
|
|
@@ -2883,10 +2947,10 @@
|
|
|
2883
2947
|
}
|
|
2884
2948
|
list-style: none;
|
|
2885
2949
|
}
|
|
2886
|
-
.sidebar-collapsible-trigger::-webkit-details-marker {
|
|
2950
|
+
._ao-sidebar-collapsible-trigger::-webkit-details-marker {
|
|
2887
2951
|
display: none;
|
|
2888
2952
|
}
|
|
2889
|
-
.sidebar-collapsible-trigger::after {
|
|
2953
|
+
._ao-sidebar-collapsible-trigger::after {
|
|
2890
2954
|
content: "";
|
|
2891
2955
|
margin-left: auto;
|
|
2892
2956
|
width: 0.375rem;
|
|
@@ -2898,10 +2962,10 @@
|
|
|
2898
2962
|
transition: transform 150ms ease;
|
|
2899
2963
|
flex-shrink: 0;
|
|
2900
2964
|
}
|
|
2901
|
-
.sidebar-collapsible[open] > .sidebar-collapsible-trigger::after {
|
|
2965
|
+
._ao-sidebar-collapsible[open] > ._ao-sidebar-collapsible-trigger::after {
|
|
2902
2966
|
transform: rotate(45deg);
|
|
2903
2967
|
}
|
|
2904
|
-
.sidebar-collapsible-panel {
|
|
2968
|
+
._ao-sidebar-collapsible-panel {
|
|
2905
2969
|
margin-top: calc(var(--spacing) * 0.5);
|
|
2906
2970
|
display: flex;
|
|
2907
2971
|
flex-direction: column;
|
|
@@ -2909,18 +2973,18 @@
|
|
|
2909
2973
|
padding-left: calc(var(--spacing) * 4);
|
|
2910
2974
|
overflow: hidden;
|
|
2911
2975
|
}
|
|
2912
|
-
.sidebar-collapsible::details-content {
|
|
2976
|
+
._ao-sidebar-collapsible::details-content {
|
|
2913
2977
|
opacity: 0;
|
|
2914
2978
|
height: 0;
|
|
2915
2979
|
overflow: clip;
|
|
2916
2980
|
transition: opacity 150ms ease, height 150ms ease, content-visibility 150ms;
|
|
2917
2981
|
transition-behavior: allow-discrete;
|
|
2918
2982
|
}
|
|
2919
|
-
.sidebar-collapsible[open]::details-content {
|
|
2983
|
+
._ao-sidebar-collapsible[open]::details-content {
|
|
2920
2984
|
opacity: 1;
|
|
2921
2985
|
height: auto;
|
|
2922
2986
|
}
|
|
2923
|
-
.sidebar-subitem {
|
|
2987
|
+
._ao-sidebar-subitem {
|
|
2924
2988
|
display: flex;
|
|
2925
2989
|
cursor: pointer;
|
|
2926
2990
|
align-items: center;
|
|
@@ -2958,13 +3022,13 @@
|
|
|
2958
3022
|
outline-color: var(--color-primary);
|
|
2959
3023
|
}
|
|
2960
3024
|
}
|
|
2961
|
-
.sidebar-subitem[aria-current="page"], .sidebar-subitem[data-active] {
|
|
3025
|
+
._ao-sidebar-subitem[aria-current="page"], ._ao-sidebar-subitem[data-active] {
|
|
2962
3026
|
background-color: var(--color-primary-muted);
|
|
2963
3027
|
--tw-font-weight: var(--font-weight-medium);
|
|
2964
3028
|
font-weight: var(--font-weight-medium);
|
|
2965
3029
|
color: var(--color-primary);
|
|
2966
3030
|
}
|
|
2967
|
-
.sidebar-footer {
|
|
3031
|
+
._ao-sidebar-footer {
|
|
2968
3032
|
display: flex;
|
|
2969
3033
|
flex-direction: column;
|
|
2970
3034
|
gap: calc(var(--spacing) * 1);
|
|
@@ -2974,7 +3038,7 @@
|
|
|
2974
3038
|
padding-inline: calc(var(--spacing) * 2);
|
|
2975
3039
|
padding-block: calc(var(--spacing) * 2);
|
|
2976
3040
|
}
|
|
2977
|
-
.sidebar-collapse-toggle {
|
|
3041
|
+
._ao-sidebar-collapse-toggle {
|
|
2978
3042
|
position: relative;
|
|
2979
3043
|
display: inline-flex;
|
|
2980
3044
|
width: calc(var(--spacing) * 7);
|
|
@@ -3003,13 +3067,13 @@
|
|
|
3003
3067
|
}
|
|
3004
3068
|
}
|
|
3005
3069
|
}
|
|
3006
|
-
.sidebar-collapse-toggle:has(.sidebar-toggle:focus-visible) {
|
|
3070
|
+
._ao-sidebar-collapse-toggle:has(._ao-sidebar-toggle:focus-visible) {
|
|
3007
3071
|
outline-style: var(--tw-outline-style);
|
|
3008
3072
|
outline-width: 2px;
|
|
3009
3073
|
outline-offset: 2px;
|
|
3010
3074
|
outline-color: var(--color-primary);
|
|
3011
3075
|
}
|
|
3012
|
-
.sidebar-collapse-toggle::before {
|
|
3076
|
+
._ao-sidebar-collapse-toggle::before {
|
|
3013
3077
|
content: "";
|
|
3014
3078
|
width: 0.5rem;
|
|
3015
3079
|
height: 0.5rem;
|
|
@@ -3018,10 +3082,10 @@
|
|
|
3018
3082
|
transform: rotate(45deg);
|
|
3019
3083
|
transition: transform 150ms ease;
|
|
3020
3084
|
}
|
|
3021
|
-
.sidebar:has(.sidebar-toggle:checked) .sidebar-collapse-toggle::before {
|
|
3085
|
+
._ao-sidebar:has(._ao-sidebar-toggle:checked) ._ao-sidebar-collapse-toggle::before {
|
|
3022
3086
|
transform: rotate(-135deg);
|
|
3023
3087
|
}
|
|
3024
|
-
.sidebar-drawer-backdrop {
|
|
3088
|
+
._ao-sidebar-drawer-backdrop {
|
|
3025
3089
|
position: fixed;
|
|
3026
3090
|
inset: calc(var(--spacing) * 0);
|
|
3027
3091
|
z-index: 40;
|
|
@@ -3035,10 +3099,10 @@
|
|
|
3035
3099
|
--tw-duration: 150ms;
|
|
3036
3100
|
transition-duration: 150ms;
|
|
3037
3101
|
}
|
|
3038
|
-
.sidebar-drawer-backdrop[data-starting-style], .sidebar-drawer-backdrop[data-ending-style] {
|
|
3102
|
+
._ao-sidebar-drawer-backdrop[data-starting-style], ._ao-sidebar-drawer-backdrop[data-ending-style] {
|
|
3039
3103
|
opacity: 0%;
|
|
3040
3104
|
}
|
|
3041
|
-
.sidebar-drawer {
|
|
3105
|
+
._ao-sidebar-drawer {
|
|
3042
3106
|
position: fixed;
|
|
3043
3107
|
inset-block: calc(var(--spacing) * 0);
|
|
3044
3108
|
left: calc(var(--spacing) * 0);
|
|
@@ -3057,17 +3121,17 @@
|
|
|
3057
3121
|
transition-duration: 150ms;
|
|
3058
3122
|
width: min(var(--app-shell-sidebar-w, 240px), 80vw);
|
|
3059
3123
|
}
|
|
3060
|
-
.sidebar-drawer[data-starting-style], .sidebar-drawer[data-ending-style] {
|
|
3124
|
+
._ao-sidebar-drawer[data-starting-style], ._ao-sidebar-drawer[data-ending-style] {
|
|
3061
3125
|
--tw-translate-x: -100%;
|
|
3062
3126
|
translate: var(--tw-translate-x) var(--tw-translate-y);
|
|
3063
3127
|
}
|
|
3064
3128
|
}
|
|
3065
3129
|
@layer components {
|
|
3066
|
-
.tabs {
|
|
3130
|
+
._ao-tabs {
|
|
3067
3131
|
display: flex;
|
|
3068
3132
|
flex-direction: column;
|
|
3069
3133
|
}
|
|
3070
|
-
.tabs .tab-list {
|
|
3134
|
+
._ao-tabs ._ao-tab-list {
|
|
3071
3135
|
display: inline-flex;
|
|
3072
3136
|
align-items: center;
|
|
3073
3137
|
gap: calc(var(--spacing) * 1);
|
|
@@ -3076,7 +3140,7 @@
|
|
|
3076
3140
|
border-color: var(--color-border);
|
|
3077
3141
|
position: relative;
|
|
3078
3142
|
}
|
|
3079
|
-
.tabs .tab {
|
|
3143
|
+
._ao-tabs ._ao-tab {
|
|
3080
3144
|
display: inline-flex;
|
|
3081
3145
|
height: calc(var(--spacing) * 9);
|
|
3082
3146
|
cursor: pointer;
|
|
@@ -3122,10 +3186,10 @@
|
|
|
3122
3186
|
opacity: 50%;
|
|
3123
3187
|
}
|
|
3124
3188
|
}
|
|
3125
|
-
.tabs .tab[data-selected], .tabs .tab[aria-selected="true"] {
|
|
3189
|
+
._ao-tabs ._ao-tab[data-selected], ._ao-tabs ._ao-tab[aria-selected="true"] {
|
|
3126
3190
|
color: var(--color-text);
|
|
3127
3191
|
}
|
|
3128
|
-
.tabs .tab-input {
|
|
3192
|
+
._ao-tabs ._ao-tab-input {
|
|
3129
3193
|
position: absolute;
|
|
3130
3194
|
width: 1px;
|
|
3131
3195
|
height: 1px;
|
|
@@ -3135,19 +3199,19 @@
|
|
|
3135
3199
|
opacity: 0;
|
|
3136
3200
|
pointer-events: none;
|
|
3137
3201
|
}
|
|
3138
|
-
.tabs .tab-input:checked + .tab {
|
|
3202
|
+
._ao-tabs ._ao-tab-input:checked + ._ao-tab {
|
|
3139
3203
|
color: var(--color-text);
|
|
3140
3204
|
}
|
|
3141
|
-
.tabs .tab-input:focus-visible + .tab {
|
|
3205
|
+
._ao-tabs ._ao-tab-input:focus-visible + ._ao-tab {
|
|
3142
3206
|
outline-style: var(--tw-outline-style);
|
|
3143
3207
|
outline-width: 2px;
|
|
3144
3208
|
outline-offset: 2px;
|
|
3145
3209
|
outline-color: var(--color-primary);
|
|
3146
3210
|
}
|
|
3147
|
-
.tabs-bordered .tab, .tabs:not(.tabs-boxed) .tab {
|
|
3211
|
+
._ao-tabs-bordered ._ao-tab, ._ao-tabs:not(._ao-tabs-boxed) ._ao-tab {
|
|
3148
3212
|
position: relative;
|
|
3149
3213
|
}
|
|
3150
|
-
.tabs-bordered .tab::after, .tabs:not(.tabs-boxed) .tab::after {
|
|
3214
|
+
._ao-tabs-bordered ._ao-tab::after, ._ao-tabs:not(._ao-tabs-boxed) ._ao-tab::after {
|
|
3151
3215
|
content: "";
|
|
3152
3216
|
position: absolute;
|
|
3153
3217
|
inset-inline: 0;
|
|
@@ -3157,10 +3221,10 @@
|
|
|
3157
3221
|
transform: scaleX(0);
|
|
3158
3222
|
transition: transform 150ms ease;
|
|
3159
3223
|
}
|
|
3160
|
-
.tabs-bordered .tab[data-selected]::after, .tabs-bordered .tab[aria-selected="true"]::after, .tabs-bordered .tab-input:checked + .tab::after, .tabs:not(.tabs-boxed) .tab[data-selected]::after, .tabs:not(.tabs-boxed) .tab[aria-selected="true"]::after, .tabs:not(.tabs-boxed) .tab-input:checked + .tab::after {
|
|
3224
|
+
._ao-tabs-bordered ._ao-tab[data-selected]::after, ._ao-tabs-bordered ._ao-tab[aria-selected="true"]::after, ._ao-tabs-bordered ._ao-tab-input:checked + ._ao-tab::after, ._ao-tabs:not(._ao-tabs-boxed) ._ao-tab[data-selected]::after, ._ao-tabs:not(._ao-tabs-boxed) ._ao-tab[aria-selected="true"]::after, ._ao-tabs:not(._ao-tabs-boxed) ._ao-tab-input:checked + ._ao-tab::after {
|
|
3161
3225
|
transform: scaleX(1);
|
|
3162
3226
|
}
|
|
3163
|
-
.tabs-boxed .tab-list {
|
|
3227
|
+
._ao-tabs-boxed ._ao-tab-list {
|
|
3164
3228
|
gap: calc(var(--spacing) * 0);
|
|
3165
3229
|
border-radius: var(--radius-md);
|
|
3166
3230
|
border-style: var(--tw-border-style);
|
|
@@ -3169,54 +3233,54 @@
|
|
|
3169
3233
|
background-color: var(--color-surface-muted);
|
|
3170
3234
|
padding: calc(var(--spacing) * 0.5);
|
|
3171
3235
|
}
|
|
3172
|
-
.tabs-boxed .tab {
|
|
3236
|
+
._ao-tabs-boxed ._ao-tab {
|
|
3173
3237
|
border-radius: 0.25rem;
|
|
3174
3238
|
}
|
|
3175
|
-
.tabs-boxed .tab[data-selected], .tabs-boxed .tab[aria-selected="true"], .tabs-boxed .tab-input:checked + .tab {
|
|
3239
|
+
._ao-tabs-boxed ._ao-tab[data-selected], ._ao-tabs-boxed ._ao-tab[aria-selected="true"], ._ao-tabs-boxed ._ao-tab-input:checked + ._ao-tab {
|
|
3176
3240
|
background-color: var(--color-surface);
|
|
3177
3241
|
color: var(--color-text);
|
|
3178
3242
|
--tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));
|
|
3179
3243
|
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
|
|
3180
3244
|
}
|
|
3181
|
-
.tabs-full-width:not([data-orientation="vertical"]) .tab-list {
|
|
3245
|
+
._ao-tabs-full-width:not([data-orientation="vertical"]) ._ao-tab-list {
|
|
3182
3246
|
display: flex;
|
|
3183
3247
|
width: 100%;
|
|
3184
3248
|
}
|
|
3185
|
-
.tabs-full-width:not([data-orientation="vertical"]) .tab {
|
|
3249
|
+
._ao-tabs-full-width:not([data-orientation="vertical"]) ._ao-tab {
|
|
3186
3250
|
flex: 1;
|
|
3187
3251
|
justify-content: center;
|
|
3188
3252
|
}
|
|
3189
|
-
.tabs-sm .tab {
|
|
3253
|
+
._ao-tabs-sm ._ao-tab {
|
|
3190
3254
|
height: calc(var(--spacing) * 7);
|
|
3191
3255
|
padding-inline: calc(var(--spacing) * 2);
|
|
3192
3256
|
font-size: var(--text-xs);
|
|
3193
3257
|
line-height: var(--tw-leading, var(--text-xs--line-height));
|
|
3194
3258
|
}
|
|
3195
|
-
.tabs-lg .tab {
|
|
3259
|
+
._ao-tabs-lg ._ao-tab {
|
|
3196
3260
|
height: calc(var(--spacing) * 11);
|
|
3197
3261
|
padding-inline: calc(var(--spacing) * 4);
|
|
3198
3262
|
font-size: var(--text-base);
|
|
3199
3263
|
line-height: var(--tw-leading, var(--text-base--line-height));
|
|
3200
3264
|
}
|
|
3201
|
-
.tabs .tab-panel {
|
|
3265
|
+
._ao-tabs ._ao-tab-panel {
|
|
3202
3266
|
padding-top: calc(var(--spacing) * 3);
|
|
3203
3267
|
--tw-outline-style: none;
|
|
3204
3268
|
outline-style: none;
|
|
3205
3269
|
}
|
|
3206
|
-
.tabs .tab-panel {
|
|
3270
|
+
._ao-tabs ._ao-tab-panel {
|
|
3207
3271
|
display: none;
|
|
3208
3272
|
}
|
|
3209
|
-
.tabs:has(.tab-input[value="1"]:checked) .tab-panel[data-value="1"], .tabs:has(.tab-input[value="2"]:checked) .tab-panel[data-value="2"], .tabs:has(.tab-input[value="3"]:checked) .tab-panel[data-value="3"], .tabs:has(.tab-input[value="4"]:checked) .tab-panel[data-value="4"], .tabs:has(.tab-input[value="5"]:checked) .tab-panel[data-value="5"], .tabs:has(.tab-input[value="6"]:checked) .tab-panel[data-value="6"] {
|
|
3273
|
+
._ao-tabs:has(._ao-tab-input[value="1"]:checked) ._ao-tab-panel[data-value="1"], ._ao-tabs:has(._ao-tab-input[value="2"]:checked) ._ao-tab-panel[data-value="2"], ._ao-tabs:has(._ao-tab-input[value="3"]:checked) ._ao-tab-panel[data-value="3"], ._ao-tabs:has(._ao-tab-input[value="4"]:checked) ._ao-tab-panel[data-value="4"], ._ao-tabs:has(._ao-tab-input[value="5"]:checked) ._ao-tab-panel[data-value="5"], ._ao-tabs:has(._ao-tab-input[value="6"]:checked) ._ao-tab-panel[data-value="6"] {
|
|
3210
3274
|
display: block;
|
|
3211
3275
|
}
|
|
3212
|
-
.tabs .tab-panel:not([hidden]):not([data-value]) {
|
|
3276
|
+
._ao-tabs ._ao-tab-panel:not([hidden]):not([data-value]) {
|
|
3213
3277
|
display: block;
|
|
3214
3278
|
}
|
|
3215
|
-
.tabs[data-orientation="vertical"] {
|
|
3279
|
+
._ao-tabs[data-orientation="vertical"] {
|
|
3216
3280
|
flex-direction: row;
|
|
3217
3281
|
gap: calc(var(--spacing) * 3);
|
|
3218
3282
|
}
|
|
3219
|
-
.tabs[data-orientation="vertical"] .tab-list {
|
|
3283
|
+
._ao-tabs[data-orientation="vertical"] ._ao-tab-list {
|
|
3220
3284
|
flex-direction: column;
|
|
3221
3285
|
align-items: stretch;
|
|
3222
3286
|
border-right-style: var(--tw-border-style);
|
|
@@ -3225,11 +3289,11 @@
|
|
|
3225
3289
|
border-bottom-width: 0px;
|
|
3226
3290
|
border-color: var(--color-border);
|
|
3227
3291
|
}
|
|
3228
|
-
.tabs[data-orientation="vertical"] .tab {
|
|
3292
|
+
._ao-tabs[data-orientation="vertical"] ._ao-tab {
|
|
3229
3293
|
width: 100%;
|
|
3230
3294
|
justify-content: flex-start;
|
|
3231
3295
|
}
|
|
3232
|
-
.tabs[data-orientation="vertical"].tabs-bordered .tab::after, .tabs[data-orientation="vertical"]:not(.tabs-boxed) .tab::after {
|
|
3296
|
+
._ao-tabs[data-orientation="vertical"]._ao-tabs-bordered ._ao-tab::after, ._ao-tabs[data-orientation="vertical"]:not(._ao-tabs-boxed) ._ao-tab::after {
|
|
3233
3297
|
inset-inline: auto;
|
|
3234
3298
|
inset-inline-end: -1px;
|
|
3235
3299
|
inset-block: 0;
|
|
@@ -3237,19 +3301,19 @@
|
|
|
3237
3301
|
block-size: auto;
|
|
3238
3302
|
transform: scaleY(0);
|
|
3239
3303
|
}
|
|
3240
|
-
.tabs[data-orientation="vertical"].tabs-bordered .tab[data-selected]::after, .tabs[data-orientation="vertical"].tabs-bordered .tab[aria-selected="true"]::after, .tabs[data-orientation="vertical"]:not(.tabs-boxed) .tab[data-selected]::after, .tabs[data-orientation="vertical"]:not(.tabs-boxed) .tab[aria-selected="true"]::after {
|
|
3304
|
+
._ao-tabs[data-orientation="vertical"]._ao-tabs-bordered ._ao-tab[data-selected]::after, ._ao-tabs[data-orientation="vertical"]._ao-tabs-bordered ._ao-tab[aria-selected="true"]::after, ._ao-tabs[data-orientation="vertical"]:not(._ao-tabs-boxed) ._ao-tab[data-selected]::after, ._ao-tabs[data-orientation="vertical"]:not(._ao-tabs-boxed) ._ao-tab[aria-selected="true"]::after {
|
|
3241
3305
|
transform: scaleY(1);
|
|
3242
3306
|
}
|
|
3243
3307
|
}
|
|
3244
3308
|
@layer components {
|
|
3245
|
-
.table {
|
|
3309
|
+
._ao-table {
|
|
3246
3310
|
width: 100%;
|
|
3247
3311
|
border-collapse: collapse;
|
|
3248
3312
|
font-size: var(--text-sm);
|
|
3249
3313
|
line-height: var(--tw-leading, var(--text-sm--line-height));
|
|
3250
3314
|
color: var(--color-text);
|
|
3251
3315
|
}
|
|
3252
|
-
.table :where(th, td), .table-cell, .table-header-cell {
|
|
3316
|
+
._ao-table :where(th, td), ._ao-table-cell, ._ao-table-header-cell {
|
|
3253
3317
|
border-bottom-style: var(--tw-border-style);
|
|
3254
3318
|
border-bottom-width: 1px;
|
|
3255
3319
|
border-color: var(--color-border);
|
|
@@ -3258,7 +3322,7 @@
|
|
|
3258
3322
|
text-align: left;
|
|
3259
3323
|
vertical-align: middle;
|
|
3260
3324
|
}
|
|
3261
|
-
.table :where(thead th), .table-header-cell {
|
|
3325
|
+
._ao-table :where(thead th), ._ao-table-header-cell {
|
|
3262
3326
|
border-bottom-color: var(--color-border-strong);
|
|
3263
3327
|
background-color: var(--color-surface-muted);
|
|
3264
3328
|
--tw-font-weight: var(--font-weight-medium);
|
|
@@ -3266,84 +3330,84 @@
|
|
|
3266
3330
|
white-space: nowrap;
|
|
3267
3331
|
color: var(--color-text-muted);
|
|
3268
3332
|
}
|
|
3269
|
-
.table > :last-child > tr:last-child :where(td), .table > :last-child > tr:last-child .table-cell {
|
|
3333
|
+
._ao-table > :last-child > tr:last-child :where(td), ._ao-table > :last-child > tr:last-child ._ao-table-cell {
|
|
3270
3334
|
border-bottom-style: var(--tw-border-style);
|
|
3271
3335
|
border-bottom-width: 0px;
|
|
3272
3336
|
}
|
|
3273
|
-
.table :where(th, td)[data-align="right"] {
|
|
3337
|
+
._ao-table :where(th, td)[data-align="right"] {
|
|
3274
3338
|
text-align: right;
|
|
3275
3339
|
}
|
|
3276
|
-
.table :where(th, td)[data-align="center"] {
|
|
3340
|
+
._ao-table :where(th, td)[data-align="center"] {
|
|
3277
3341
|
text-align: center;
|
|
3278
3342
|
}
|
|
3279
|
-
.table-cell-numeric {
|
|
3343
|
+
._ao-table-cell-numeric {
|
|
3280
3344
|
text-align: right;
|
|
3281
3345
|
--tw-numeric-spacing: tabular-nums;
|
|
3282
3346
|
font-variant-numeric: var(--tw-ordinal,) var(--tw-slashed-zero,) var(--tw-numeric-figure,) var(--tw-numeric-spacing,) var(--tw-numeric-fraction,);
|
|
3283
3347
|
}
|
|
3284
|
-
.table-cell-gutter {
|
|
3348
|
+
._ao-table-cell-gutter {
|
|
3285
3349
|
width: calc(var(--spacing) * 6);
|
|
3286
3350
|
padding-inline: calc(var(--spacing) * 0);
|
|
3287
3351
|
text-align: center;
|
|
3288
3352
|
color: var(--color-text-muted);
|
|
3289
3353
|
}
|
|
3290
|
-
.table-cell-gutter > :is(i, svg) {
|
|
3354
|
+
._ao-table-cell-gutter > :is(i, svg) {
|
|
3291
3355
|
font-size: 1rem;
|
|
3292
3356
|
line-height: 1;
|
|
3293
3357
|
vertical-align: middle;
|
|
3294
3358
|
}
|
|
3295
|
-
.table-striped tbody tr:nth-child(even) :where(td) {
|
|
3359
|
+
._ao-table-striped tbody tr:nth-child(even) :where(td) {
|
|
3296
3360
|
background-color: var(--color-surface-muted);
|
|
3297
3361
|
}
|
|
3298
|
-
.table-bordered {
|
|
3362
|
+
._ao-table-bordered {
|
|
3299
3363
|
border-style: var(--tw-border-style);
|
|
3300
3364
|
border-width: 1px;
|
|
3301
3365
|
border-color: var(--color-border);
|
|
3302
3366
|
}
|
|
3303
|
-
.table-bordered :where(th, td) {
|
|
3367
|
+
._ao-table-bordered :where(th, td) {
|
|
3304
3368
|
border-style: var(--tw-border-style);
|
|
3305
3369
|
border-width: 1px;
|
|
3306
3370
|
border-color: var(--color-border);
|
|
3307
3371
|
}
|
|
3308
|
-
.table-relaxed :where(th, td) {
|
|
3372
|
+
._ao-table-relaxed :where(th, td) {
|
|
3309
3373
|
padding-inline: calc(var(--spacing) * 4);
|
|
3310
3374
|
padding-block: calc(var(--spacing) * 3);
|
|
3311
3375
|
}
|
|
3312
|
-
.table-sticky thead :where(th) {
|
|
3376
|
+
._ao-table-sticky thead :where(th) {
|
|
3313
3377
|
position: sticky;
|
|
3314
3378
|
top: calc(var(--spacing) * 0);
|
|
3315
3379
|
z-index: 10;
|
|
3316
3380
|
background-color: var(--color-surface-muted);
|
|
3317
3381
|
}
|
|
3318
|
-
.table tbody tr {
|
|
3382
|
+
._ao-table tbody tr {
|
|
3319
3383
|
transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;
|
|
3320
3384
|
transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));
|
|
3321
3385
|
transition-duration: var(--tw-duration, var(--default-transition-duration));
|
|
3322
3386
|
--tw-duration: 75ms;
|
|
3323
3387
|
transition-duration: 75ms;
|
|
3324
3388
|
}
|
|
3325
|
-
.table tbody tr:hover :where(td) {
|
|
3389
|
+
._ao-table tbody tr:hover :where(td) {
|
|
3326
3390
|
background-color: var(--color-surface-muted);
|
|
3327
3391
|
}
|
|
3328
|
-
.table tbody tr:has(input[type="checkbox"]:checked), .table tbody tr:has(.checkbox[data-checked]), .table tbody tr[data-selected] {
|
|
3392
|
+
._ao-table tbody tr:has(input[type="checkbox"]:checked), ._ao-table tbody tr:has(._ao-checkbox[data-checked]), ._ao-table tbody tr[data-selected] {
|
|
3329
3393
|
background-color: var(--color-primary-muted);
|
|
3330
3394
|
}
|
|
3331
|
-
.table tbody tr:has(input[type="checkbox"]:checked):hover :where(td), .table tbody tr:has(.checkbox[data-checked]):hover :where(td), .table tbody tr[data-selected]:hover :where(td) {
|
|
3395
|
+
._ao-table tbody tr:has(input[type="checkbox"]:checked):hover :where(td), ._ao-table tbody tr:has(._ao-checkbox[data-checked]):hover :where(td), ._ao-table tbody tr[data-selected]:hover :where(td) {
|
|
3332
3396
|
background-color: var(--color-primary-muted);
|
|
3333
3397
|
}
|
|
3334
|
-
.table-row-link {
|
|
3398
|
+
._ao-table-row-link {
|
|
3335
3399
|
position: relative;
|
|
3336
3400
|
cursor: pointer;
|
|
3337
3401
|
}
|
|
3338
|
-
.table-row-link:hover :where(td) {
|
|
3402
|
+
._ao-table-row-link:hover :where(td) {
|
|
3339
3403
|
background-color: var(--color-surface-muted);
|
|
3340
3404
|
}
|
|
3341
|
-
.table-row-link a:first-of-type::after {
|
|
3405
|
+
._ao-table-row-link a:first-of-type::after {
|
|
3342
3406
|
content: "";
|
|
3343
3407
|
position: absolute;
|
|
3344
3408
|
inset: calc(var(--spacing) * 0);
|
|
3345
3409
|
}
|
|
3346
|
-
.table-row-link:focus-within {
|
|
3410
|
+
._ao-table-row-link:focus-within {
|
|
3347
3411
|
outline-style: var(--tw-outline-style);
|
|
3348
3412
|
outline-width: 2px;
|
|
3349
3413
|
outline-offset: calc(2px * -1);
|
|
@@ -3351,7 +3415,7 @@
|
|
|
3351
3415
|
}
|
|
3352
3416
|
}
|
|
3353
3417
|
@layer components {
|
|
3354
|
-
.tooltip {
|
|
3418
|
+
._ao-tooltip {
|
|
3355
3419
|
pointer-events: none;
|
|
3356
3420
|
display: inline-block;
|
|
3357
3421
|
max-width: var(--container-xs);
|
|
@@ -3370,34 +3434,34 @@
|
|
|
3370
3434
|
box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
|
|
3371
3435
|
text-wrap: balance;
|
|
3372
3436
|
}
|
|
3373
|
-
.tooltip-sm {
|
|
3437
|
+
._ao-tooltip-sm {
|
|
3374
3438
|
padding-inline: calc(var(--spacing) * 1.5);
|
|
3375
3439
|
padding-block: calc(var(--spacing) * 0.5);
|
|
3376
3440
|
}
|
|
3377
|
-
.tooltip {
|
|
3441
|
+
._ao-tooltip {
|
|
3378
3442
|
transition: opacity 150ms ease-out, transform 150ms ease-out;
|
|
3379
3443
|
}
|
|
3380
|
-
.tooltip[data-starting-style], .tooltip[data-ending-style] {
|
|
3444
|
+
._ao-tooltip[data-starting-style], ._ao-tooltip[data-ending-style] {
|
|
3381
3445
|
opacity: 0;
|
|
3382
3446
|
}
|
|
3383
|
-
.tooltip[data-side="top"][data-starting-style], .tooltip[data-side="top"][data-ending-style] {
|
|
3447
|
+
._ao-tooltip[data-side="top"][data-starting-style], ._ao-tooltip[data-side="top"][data-ending-style] {
|
|
3384
3448
|
transform: translateY(0.25rem);
|
|
3385
3449
|
}
|
|
3386
|
-
.tooltip[data-side="bottom"][data-starting-style], .tooltip[data-side="bottom"][data-ending-style] {
|
|
3450
|
+
._ao-tooltip[data-side="bottom"][data-starting-style], ._ao-tooltip[data-side="bottom"][data-ending-style] {
|
|
3387
3451
|
transform: translateY(-0.25rem);
|
|
3388
3452
|
}
|
|
3389
|
-
.tooltip[data-side="left"][data-starting-style], .tooltip[data-side="left"][data-ending-style] {
|
|
3453
|
+
._ao-tooltip[data-side="left"][data-starting-style], ._ao-tooltip[data-side="left"][data-ending-style] {
|
|
3390
3454
|
transform: translateX(0.25rem);
|
|
3391
3455
|
}
|
|
3392
|
-
.tooltip[data-side="right"][data-starting-style], .tooltip[data-side="right"][data-ending-style] {
|
|
3456
|
+
._ao-tooltip[data-side="right"][data-starting-style], ._ao-tooltip[data-side="right"][data-ending-style] {
|
|
3393
3457
|
transform: translateX(-0.25rem);
|
|
3394
3458
|
}
|
|
3395
|
-
.tooltip-wrap {
|
|
3459
|
+
._ao-tooltip-wrap {
|
|
3396
3460
|
position: relative;
|
|
3397
3461
|
display: inline-flex;
|
|
3398
3462
|
align-items: center;
|
|
3399
3463
|
}
|
|
3400
|
-
.tooltip-wrap > .tooltip {
|
|
3464
|
+
._ao-tooltip-wrap > ._ao-tooltip {
|
|
3401
3465
|
visibility: hidden;
|
|
3402
3466
|
position: absolute;
|
|
3403
3467
|
opacity: 0%;
|
|
@@ -3407,7 +3471,7 @@
|
|
|
3407
3471
|
transform: translateX(-50%);
|
|
3408
3472
|
transition: opacity 150ms ease-out 0ms, visibility 0s linear 150ms;
|
|
3409
3473
|
}
|
|
3410
|
-
.tooltip-wrap-bottom > .tooltip {
|
|
3474
|
+
._ao-tooltip-wrap-bottom > ._ao-tooltip {
|
|
3411
3475
|
top: 100%;
|
|
3412
3476
|
right: auto;
|
|
3413
3477
|
bottom: auto;
|
|
@@ -3418,7 +3482,7 @@
|
|
|
3418
3482
|
margin-left: 0;
|
|
3419
3483
|
transform: translateX(-50%);
|
|
3420
3484
|
}
|
|
3421
|
-
.tooltip-wrap-left > .tooltip {
|
|
3485
|
+
._ao-tooltip-wrap-left > ._ao-tooltip {
|
|
3422
3486
|
top: 50%;
|
|
3423
3487
|
right: 100%;
|
|
3424
3488
|
bottom: auto;
|
|
@@ -3429,7 +3493,7 @@
|
|
|
3429
3493
|
margin-left: 0;
|
|
3430
3494
|
transform: translateY(-50%);
|
|
3431
3495
|
}
|
|
3432
|
-
.tooltip-wrap-right > .tooltip {
|
|
3496
|
+
._ao-tooltip-wrap-right > ._ao-tooltip {
|
|
3433
3497
|
top: 50%;
|
|
3434
3498
|
right: auto;
|
|
3435
3499
|
bottom: auto;
|
|
@@ -3440,7 +3504,7 @@
|
|
|
3440
3504
|
margin-left: calc(var(--spacing) * 1.5);
|
|
3441
3505
|
transform: translateY(-50%);
|
|
3442
3506
|
}
|
|
3443
|
-
.tooltip-wrap:hover > .tooltip, .tooltip-wrap:focus-within > .tooltip {
|
|
3507
|
+
._ao-tooltip-wrap:hover > ._ao-tooltip, ._ao-tooltip-wrap:focus-within > ._ao-tooltip {
|
|
3444
3508
|
visibility: visible;
|
|
3445
3509
|
opacity: 100%;
|
|
3446
3510
|
transition: opacity 150ms ease-out 200ms, visibility 0s linear 200ms;
|
|
@@ -3449,6 +3513,11 @@
|
|
|
3449
3513
|
@layer properties {
|
|
3450
3514
|
@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
|
|
3451
3515
|
*, ::before, ::after, ::backdrop {
|
|
3516
|
+
--tw-ordinal: initial;
|
|
3517
|
+
--tw-slashed-zero: initial;
|
|
3518
|
+
--tw-numeric-figure: initial;
|
|
3519
|
+
--tw-numeric-spacing: initial;
|
|
3520
|
+
--tw-numeric-fraction: initial;
|
|
3452
3521
|
--tw-shadow: 0 0 #0000;
|
|
3453
3522
|
--tw-shadow-color: initial;
|
|
3454
3523
|
--tw-shadow-alpha: 100%;
|
|
@@ -3472,11 +3541,6 @@
|
|
|
3472
3541
|
--tw-translate-y: 0;
|
|
3473
3542
|
--tw-translate-z: 0;
|
|
3474
3543
|
--tw-tracking: initial;
|
|
3475
|
-
--tw-ordinal: initial;
|
|
3476
|
-
--tw-slashed-zero: initial;
|
|
3477
|
-
--tw-numeric-figure: initial;
|
|
3478
|
-
--tw-numeric-spacing: initial;
|
|
3479
|
-
--tw-numeric-fraction: initial;
|
|
3480
3544
|
}
|
|
3481
3545
|
}
|
|
3482
3546
|
}
|