@ecopages/radiant-themes 0.2.1 → 0.2.3
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/README.md +27 -15
- package/dist/compiled/themes/cloudflare/compact.css +40 -12
- package/dist/compiled/themes/cloudflare.css +40 -12
- package/dist/compiled/themes/github/compact.css +264 -67
- package/dist/compiled/themes/github.css +264 -67
- package/dist/compiled/themes/high-contrast/compact.css +88 -5
- package/dist/compiled/themes/high-contrast.css +88 -5
- package/dist/compiled/themes/macos/compact.css +679 -294
- package/dist/compiled/themes/macos-classic/compact.css +197 -25
- package/dist/compiled/themes/macos-classic.css +197 -25
- package/dist/compiled/themes/macos.css +679 -294
- package/dist/compiled/themes/material/compact.css +447 -132
- package/dist/compiled/themes/material.css +447 -132
- package/dist/compiled/themes/vercel/compact.css +104 -62
- package/dist/compiled/themes/vercel.css +104 -62
- package/dist/compiled/themes/vscode/compact.css +255 -40
- package/dist/compiled/themes/vscode.css +255 -40
- package/dist/compiled/themes/windows95/compact.css +260 -22
- package/dist/compiled/themes/windows95.css +260 -22
- package/dist/tokens/colors/github.css +32 -0
- package/dist/tokens/colors/macos.css +65 -25
- package/dist/tokens/colors/material.css +61 -20
- package/dist/tokens/colors/vercel.css +43 -39
- package/dist/tokens/colors/vscode.css +48 -4
- package/dist/tokens/colors/windows95.css +10 -5
- package/dist/tokens/components/cloudflare.css +55 -5
- package/dist/tokens/components/github.css +258 -40
- package/dist/tokens/components/high-contrast.css +93 -5
- package/dist/tokens/components/macos-classic.css +262 -24
- package/dist/tokens/components/macos.css +542 -106
- package/dist/tokens/components/material.css +354 -25
- package/dist/tokens/components/vercel.css +77 -15
- package/dist/tokens/components/vscode.css +248 -27
- package/dist/tokens/components/windows95.css +304 -19
- package/dist/tokens/roles/github.css +12 -12
- package/dist/tokens/roles/macos.css +97 -93
- package/dist/tokens/roles/material.css +65 -65
- package/dist/tokens/roles/vercel.css +3 -3
- package/package.json +3 -3
|
@@ -767,8 +767,13 @@
|
|
|
767
767
|
font-size: 0;
|
|
768
768
|
box-shadow: var(--macos-classic-bevel);
|
|
769
769
|
}
|
|
770
|
+
:root .rui-popover {
|
|
771
|
+
--rui-popover-radius: 0;
|
|
772
|
+
--rui-popover-surface: var(--macos-classic-surface);
|
|
773
|
+
--rui-popover-border-color: var(--macos-classic-dark);
|
|
774
|
+
--rui-popover-shadow: var(--macos-classic-bevel), 1px 1px 0 var(--macos-classic-dark), 3px 3px 0 rgb(0 0 0 / 0.25);
|
|
775
|
+
}
|
|
770
776
|
:root .rui-dialog__surface,
|
|
771
|
-
:root .rui-popover-host,
|
|
772
777
|
:root .rui-hover-card__content,
|
|
773
778
|
:root .rui-calendar {
|
|
774
779
|
border-radius: var(--radius-none);
|
|
@@ -827,7 +832,7 @@
|
|
|
827
832
|
padding-inline: 1.125rem;
|
|
828
833
|
clip-path: var(--macos-classic-tab-shape);
|
|
829
834
|
border-radius: 0;
|
|
830
|
-
background-color: var(--macos-classic-
|
|
835
|
+
background-color: var(--macos-classic-container);
|
|
831
836
|
background-image: var(--macos-classic-tab-outline);
|
|
832
837
|
background-position: 0 0;
|
|
833
838
|
background-size: 100% 100%;
|
|
@@ -855,42 +860,173 @@
|
|
|
855
860
|
box-shadow: none;
|
|
856
861
|
padding: var(--rui-tabs-panel-padding);
|
|
857
862
|
}
|
|
863
|
+
:root .rui-select__listbox .rui-listbox,
|
|
864
|
+
:root .rui-combobox__listbox .rui-listbox {
|
|
865
|
+
background-color: transparent;
|
|
866
|
+
}
|
|
867
|
+
:root .rui-listbox {
|
|
868
|
+
gap: 0;
|
|
869
|
+
padding: 1px;
|
|
870
|
+
}
|
|
871
|
+
:root .rui-listbox--bordered {
|
|
872
|
+
border-radius: var(--radius-none);
|
|
873
|
+
border-color: var(--macos-classic-dark);
|
|
874
|
+
background-color: var(--macos-classic-field);
|
|
875
|
+
color: var(--macos-classic-field-text);
|
|
876
|
+
box-shadow: none;
|
|
877
|
+
}
|
|
878
|
+
:root .rui-listbox__option,
|
|
879
|
+
:root .rui-menu-button__item,
|
|
880
|
+
:root .rui-menubar__item,
|
|
881
|
+
:root .rui-menubar__menu-item,
|
|
882
|
+
:root .rui-tree__node,
|
|
883
|
+
:root .rui-calendar__day {
|
|
884
|
+
border-radius: 0;
|
|
885
|
+
background-image: none;
|
|
886
|
+
transition: none;
|
|
887
|
+
}
|
|
888
|
+
:root .rui-listbox__option[aria-selected='true'][data-active]:not([aria-disabled='true']) {
|
|
889
|
+
--tw-ring-shadow: 0 0 #0000;
|
|
890
|
+
}
|
|
891
|
+
:root .rui-menu-button__item:is(:hover, :focus-visible):not([aria-disabled='true']),
|
|
892
|
+
:root .rui-menubar__menu-item:is(:hover, :focus-visible):not(:disabled):not([aria-disabled='true']),
|
|
893
|
+
:root .rui-menubar__menu-item[aria-expanded='true'],
|
|
894
|
+
:root .rui-menubar__item:is([aria-expanded='true'], :active):not(:disabled):not([aria-disabled='true']),
|
|
895
|
+
:root .rui-listbox__option[data-active]:not([aria-selected='true']):not([aria-disabled='true']) {
|
|
896
|
+
background-color: var(--macos-classic-selection);
|
|
897
|
+
color: var(--macos-classic-selection-text);
|
|
898
|
+
box-shadow: none;
|
|
899
|
+
outline: none;
|
|
900
|
+
--tw-ring-shadow: 0 0 #0000;
|
|
901
|
+
}
|
|
902
|
+
:root .rui-menubar {
|
|
903
|
+
border-radius: var(--radius-none);
|
|
904
|
+
gap: 0;
|
|
905
|
+
padding: 0 0.25rem;
|
|
906
|
+
border: 0;
|
|
907
|
+
border-bottom: 1px solid var(--macos-classic-dark);
|
|
908
|
+
background-color: var(--macos-classic-face);
|
|
909
|
+
box-shadow: inset 0 1px 0 var(--macos-classic-light);
|
|
910
|
+
}
|
|
911
|
+
:root .rui-menubar__item {
|
|
912
|
+
--tw-font-weight: var(--font-weight-normal, 400);
|
|
913
|
+
font-weight: var(--font-weight-normal, 400);
|
|
914
|
+
}
|
|
915
|
+
:root .rui-menubar__item:hover:not(:disabled):not([aria-disabled='true']):not([aria-expanded='true']) {
|
|
916
|
+
background-color: transparent;
|
|
917
|
+
}
|
|
918
|
+
:root .rui-tooltip__content {
|
|
919
|
+
--rui-tooltip-radius: 0;
|
|
920
|
+
--rui-tooltip-surface: var(--macos-classic-field);
|
|
921
|
+
--rui-tooltip-color: var(--macos-classic-field-text);
|
|
922
|
+
--rui-tooltip-shadow: 0 0 0 1px var(--macos-classic-dark), 2px 2px 0 rgb(0 0 0 / 0.3);
|
|
923
|
+
}
|
|
924
|
+
:root .rui-tag {
|
|
925
|
+
border-radius: var(--radius-sm);
|
|
926
|
+
border-color: var(--macos-classic-dark);
|
|
927
|
+
background-color: var(--macos-classic-face);
|
|
928
|
+
background-image: none;
|
|
929
|
+
color: var(--macos-classic-text);
|
|
930
|
+
box-shadow: var(--macos-classic-bevel);
|
|
931
|
+
}
|
|
932
|
+
:root .rui-tag[aria-selected='true'] {
|
|
933
|
+
border-color: var(--macos-classic-dark);
|
|
934
|
+
background-color: var(--macos-classic-selection);
|
|
935
|
+
color: var(--macos-classic-selection-text);
|
|
936
|
+
box-shadow: none;
|
|
937
|
+
}
|
|
938
|
+
:root .rui-tag__remove {
|
|
939
|
+
border-radius: var(--radius-none);
|
|
940
|
+
}
|
|
941
|
+
:root .rui-tree {
|
|
942
|
+
border-radius: var(--radius-none);
|
|
943
|
+
border-color: var(--macos-classic-dark);
|
|
944
|
+
background-color: var(--macos-classic-field);
|
|
945
|
+
color: var(--macos-classic-field-text);
|
|
946
|
+
box-shadow: none;
|
|
947
|
+
}
|
|
948
|
+
:root .rui-tree ul {
|
|
949
|
+
border-left: 0;
|
|
950
|
+
}
|
|
951
|
+
:root .rui-tree__node {
|
|
952
|
+
color: var(--macos-classic-field-text);
|
|
953
|
+
}
|
|
954
|
+
:root .rui-tree__node:hover:not([aria-selected='true']) {
|
|
955
|
+
background-color: transparent;
|
|
956
|
+
}
|
|
957
|
+
:root .rui-disclosure__icon--chevron > * {
|
|
958
|
+
display: none;
|
|
959
|
+
}
|
|
960
|
+
:root .rui-disclosure__icon--chevron::before {
|
|
961
|
+
content: '';
|
|
962
|
+
border-block: 4px solid transparent;
|
|
963
|
+
border-inline-start: 6px solid var(--macos-classic-text);
|
|
964
|
+
}
|
|
965
|
+
:root .rui-disclosure__icon--chevron,
|
|
966
|
+
:root .rui-disclosure__trigger[aria-expanded='true'] .rui-disclosure__icon--chevron {
|
|
967
|
+
transition: none;
|
|
968
|
+
transform: none;
|
|
969
|
+
}
|
|
970
|
+
:root .rui-disclosure__trigger[aria-expanded='true'] .rui-disclosure__icon--chevron {
|
|
971
|
+
transform: rotate(90deg);
|
|
972
|
+
}
|
|
973
|
+
:root .rui-disclosure__trigger:hover {
|
|
974
|
+
background-color: transparent;
|
|
975
|
+
}
|
|
858
976
|
:root .rui-listbox__option[aria-selected='true'],
|
|
859
977
|
:root .rui-menu-button__item[aria-checked='true'],
|
|
860
978
|
:root .rui-menubar__menu-item[aria-checked='true'],
|
|
861
979
|
:root .rui-tree__node[aria-selected='true'],
|
|
862
980
|
:root .rui-calendar__day[aria-selected='true'],
|
|
863
981
|
:root .rui-sidebar__menu-button--active,
|
|
982
|
+
:root .rui-sidebar__menu-button[aria-current='page'],
|
|
864
983
|
:root .rui-navigation-menu__link-list a[aria-current='page'] {
|
|
865
984
|
background-color: var(--macos-classic-selection);
|
|
866
985
|
color: var(--macos-classic-selection-text);
|
|
867
986
|
}
|
|
868
|
-
:root
|
|
987
|
+
:root rui-table,
|
|
869
988
|
:root .rui-grid {
|
|
989
|
+
border-radius: 0;
|
|
990
|
+
border-color: var(--macos-classic-dark);
|
|
991
|
+
box-shadow: none;
|
|
992
|
+
}
|
|
993
|
+
:root .rui-table__cell,
|
|
994
|
+
:root .rui-table__selection-cell,
|
|
995
|
+
:root .rui-table__empty-state,
|
|
996
|
+
:root .rui-table__empty-state-spacer,
|
|
997
|
+
:root .rui-grid__cell {
|
|
998
|
+
border-color: var(--macos-classic-mid);
|
|
870
999
|
background-color: var(--macos-classic-field);
|
|
871
1000
|
color: var(--macos-classic-field-text);
|
|
872
1001
|
}
|
|
873
|
-
:root .rui-
|
|
874
|
-
:root .rui-
|
|
875
|
-
:root .rui-
|
|
1002
|
+
:root .rui-table__column,
|
|
1003
|
+
:root .rui-grid__row:first-child .rui-grid__cell,
|
|
1004
|
+
:root .rui-treegrid__row--header .rui-treegrid__cell {
|
|
1005
|
+
--tw-font-weight: var(--font-weight-normal, 400);
|
|
1006
|
+
font-weight: var(--font-weight-normal, 400);
|
|
1007
|
+
border-right: 1px solid var(--macos-classic-shadow);
|
|
1008
|
+
border-bottom: 1px solid var(--macos-classic-dark);
|
|
1009
|
+
background-color: var(--macos-classic-face);
|
|
1010
|
+
color: var(--macos-classic-text);
|
|
1011
|
+
box-shadow: var(--macos-classic-bevel);
|
|
1012
|
+
}
|
|
1013
|
+
:root .rui-table__column .rui-table__sort {
|
|
1014
|
+
--tw-font-weight: var(--font-weight-normal, 400);
|
|
1015
|
+
font-weight: var(--font-weight-normal, 400);
|
|
1016
|
+
color: var(--macos-classic-text);
|
|
1017
|
+
}
|
|
1018
|
+
:root .rui-calendar__weekdays {
|
|
876
1019
|
--tw-font-weight: var(--font-weight-normal, 400);
|
|
877
1020
|
font-weight: var(--font-weight-normal, 400);
|
|
878
1021
|
background-color: var(--macos-classic-face);
|
|
879
1022
|
box-shadow: var(--macos-classic-raised);
|
|
880
1023
|
}
|
|
881
|
-
:root .rui-table__row:nth-child(even),
|
|
882
|
-
:root .rui-grid__row:nth-child(even) {
|
|
883
|
-
background-color: var(--macos-classic-light);
|
|
884
|
-
background-image: linear-gradient(var(--macos-classic-container) 0 0);
|
|
885
|
-
background-blend-mode: soft-light;
|
|
886
|
-
}
|
|
887
1024
|
:root .rui-treegrid {
|
|
888
1025
|
border-radius: var(--radius-none);
|
|
889
|
-
border
|
|
890
|
-
border-width: 0px;
|
|
1026
|
+
border: 1px solid var(--macos-classic-dark);
|
|
891
1027
|
background-color: var(--macos-classic-field);
|
|
892
1028
|
color: var(--macos-classic-field-text);
|
|
893
|
-
box-shadow:
|
|
1029
|
+
box-shadow: none;
|
|
894
1030
|
--rui-treegrid-indent: 0.875rem;
|
|
895
1031
|
}
|
|
896
1032
|
:root .rui-treegrid__cell {
|
|
@@ -901,13 +1037,6 @@
|
|
|
901
1037
|
padding-block: calc(var(--spacing, 0.25rem) * 1.5);
|
|
902
1038
|
color: var(--macos-classic-field-text);
|
|
903
1039
|
}
|
|
904
|
-
:root .rui-treegrid__row--header .rui-treegrid__cell {
|
|
905
|
-
--tw-font-weight: var(--font-weight-normal, 400);
|
|
906
|
-
font-weight: var(--font-weight-normal, 400);
|
|
907
|
-
background-color: var(--macos-classic-face);
|
|
908
|
-
color: var(--macos-classic-text);
|
|
909
|
-
box-shadow: var(--macos-classic-raised-thin);
|
|
910
|
-
}
|
|
911
1040
|
:root .rui-treegrid__row:not(.rui-treegrid__row--header):hover .rui-treegrid__cell:not([aria-selected='true']) {
|
|
912
1041
|
background-color: var(--macos-classic-container);
|
|
913
1042
|
}
|
|
@@ -930,7 +1059,7 @@
|
|
|
930
1059
|
transform: rotate(90deg);
|
|
931
1060
|
}
|
|
932
1061
|
:root .rui-alert,
|
|
933
|
-
:root .rui-
|
|
1062
|
+
:root .rui-toast {
|
|
934
1063
|
border-radius: var(--radius-none);
|
|
935
1064
|
color: var(--color-on-surface);
|
|
936
1065
|
border: 1px solid var(--macos-classic-dark);
|
|
@@ -938,6 +1067,27 @@
|
|
|
938
1067
|
box-shadow: var(--macos-classic-bevel),
|
|
939
1068
|
1px 1px 0 var(--macos-classic-dark);
|
|
940
1069
|
}
|
|
1070
|
+
:root .rui-toast {
|
|
1071
|
+
background-image: none;
|
|
1072
|
+
}
|
|
1073
|
+
:root .rui-toast--info .rui-toast__icon {
|
|
1074
|
+
color: var(--macos-classic-blue);
|
|
1075
|
+
}
|
|
1076
|
+
:root .rui-toast--success .rui-toast__icon {
|
|
1077
|
+
color: var(--macos-classic-green);
|
|
1078
|
+
}
|
|
1079
|
+
:root .rui-toast--warning .rui-toast__icon {
|
|
1080
|
+
color: var(--macos-classic-amber);
|
|
1081
|
+
}
|
|
1082
|
+
:root .rui-toast--error .rui-toast__icon {
|
|
1083
|
+
color: var(--macos-classic-red);
|
|
1084
|
+
}
|
|
1085
|
+
:root .rui-toast__close {
|
|
1086
|
+
border-color: var(--macos-classic-dark);
|
|
1087
|
+
background-color: var(--macos-classic-face);
|
|
1088
|
+
color: var(--macos-classic-text);
|
|
1089
|
+
box-shadow: var(--macos-classic-bevel);
|
|
1090
|
+
}
|
|
941
1091
|
:root .rui-alert--inline.rui-alert--dismissible {
|
|
942
1092
|
padding-inline-start: 2.5rem;
|
|
943
1093
|
}
|
|
@@ -969,19 +1119,35 @@
|
|
|
969
1119
|
color: var(--macos-classic-red);
|
|
970
1120
|
}
|
|
971
1121
|
:root .rui-badge,
|
|
972
|
-
:root .rui-chip
|
|
973
|
-
:root .rui-pagination__link {
|
|
1122
|
+
:root .rui-chip {
|
|
974
1123
|
border-radius: var(--radius-sm);
|
|
975
1124
|
color: var(--color-on-surface);
|
|
976
1125
|
border: 1px solid var(--macos-classic-dark);
|
|
977
1126
|
background-color: var(--macos-classic-face);
|
|
978
1127
|
box-shadow: var(--macos-classic-raised);
|
|
979
1128
|
}
|
|
1129
|
+
:root .rui-pagination__link {
|
|
1130
|
+
min-width: 0;
|
|
1131
|
+
}
|
|
1132
|
+
:root .rui-calendar {
|
|
1133
|
+
--radius-control: 0;
|
|
1134
|
+
}
|
|
980
1135
|
:root .rui-separator,
|
|
981
1136
|
:root .rui-sidebar__separator {
|
|
982
1137
|
background-color: var(--macos-classic-shadow);
|
|
983
1138
|
box-shadow: 0 1px 0 var(--macos-classic-light);
|
|
984
1139
|
}
|
|
1140
|
+
:root .rui-slider {
|
|
1141
|
+
--rui-slider-track-size: 0.3125rem;
|
|
1142
|
+
}
|
|
1143
|
+
:root .rui-slider__thumb {
|
|
1144
|
+
inline-size: 0.6875rem;
|
|
1145
|
+
block-size: 1.125rem;
|
|
1146
|
+
}
|
|
1147
|
+
:root .rui-slider--vertical .rui-slider__thumb {
|
|
1148
|
+
inline-size: 1.125rem;
|
|
1149
|
+
block-size: 0.6875rem;
|
|
1150
|
+
}
|
|
985
1151
|
:root .rui-slider__thumb,
|
|
986
1152
|
:root .rui-number-field__stepper {
|
|
987
1153
|
border-radius: var(--radius-sm);
|
|
@@ -997,9 +1163,15 @@
|
|
|
997
1163
|
background-color: var(--macos-classic-field);
|
|
998
1164
|
box-shadow: var(--macos-classic-well);
|
|
999
1165
|
}
|
|
1166
|
+
:root .rui-meter__track {
|
|
1167
|
+
background-color: var(--macos-classic-container);
|
|
1168
|
+
}
|
|
1000
1169
|
:root .rui-meter__fill {
|
|
1001
1170
|
border-radius: var(--radius-none);
|
|
1002
1171
|
background-color: var(--macos-classic-selection);
|
|
1172
|
+
box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.45),
|
|
1173
|
+
inset 0 -1px 0 rgb(0 0 0 / 0.3),
|
|
1174
|
+
1px 0 0 var(--macos-classic-dark);
|
|
1003
1175
|
}
|
|
1004
1176
|
:root .rui-slider__range-fill {
|
|
1005
1177
|
border-radius: var(--radius-none);
|
|
@@ -767,8 +767,13 @@
|
|
|
767
767
|
font-size: 0;
|
|
768
768
|
box-shadow: var(--macos-classic-bevel);
|
|
769
769
|
}
|
|
770
|
+
:root .rui-popover {
|
|
771
|
+
--rui-popover-radius: 0;
|
|
772
|
+
--rui-popover-surface: var(--macos-classic-surface);
|
|
773
|
+
--rui-popover-border-color: var(--macos-classic-dark);
|
|
774
|
+
--rui-popover-shadow: var(--macos-classic-bevel), 1px 1px 0 var(--macos-classic-dark), 3px 3px 0 rgb(0 0 0 / 0.25);
|
|
775
|
+
}
|
|
770
776
|
:root .rui-dialog__surface,
|
|
771
|
-
:root .rui-popover-host,
|
|
772
777
|
:root .rui-hover-card__content,
|
|
773
778
|
:root .rui-calendar {
|
|
774
779
|
border-radius: var(--radius-none);
|
|
@@ -827,7 +832,7 @@
|
|
|
827
832
|
padding-inline: 1.125rem;
|
|
828
833
|
clip-path: var(--macos-classic-tab-shape);
|
|
829
834
|
border-radius: 0;
|
|
830
|
-
background-color: var(--macos-classic-
|
|
835
|
+
background-color: var(--macos-classic-container);
|
|
831
836
|
background-image: var(--macos-classic-tab-outline);
|
|
832
837
|
background-position: 0 0;
|
|
833
838
|
background-size: 100% 100%;
|
|
@@ -855,42 +860,173 @@
|
|
|
855
860
|
box-shadow: none;
|
|
856
861
|
padding: var(--rui-tabs-panel-padding);
|
|
857
862
|
}
|
|
863
|
+
:root .rui-select__listbox .rui-listbox,
|
|
864
|
+
:root .rui-combobox__listbox .rui-listbox {
|
|
865
|
+
background-color: transparent;
|
|
866
|
+
}
|
|
867
|
+
:root .rui-listbox {
|
|
868
|
+
gap: 0;
|
|
869
|
+
padding: 1px;
|
|
870
|
+
}
|
|
871
|
+
:root .rui-listbox--bordered {
|
|
872
|
+
border-radius: var(--radius-none);
|
|
873
|
+
border-color: var(--macos-classic-dark);
|
|
874
|
+
background-color: var(--macos-classic-field);
|
|
875
|
+
color: var(--macos-classic-field-text);
|
|
876
|
+
box-shadow: none;
|
|
877
|
+
}
|
|
878
|
+
:root .rui-listbox__option,
|
|
879
|
+
:root .rui-menu-button__item,
|
|
880
|
+
:root .rui-menubar__item,
|
|
881
|
+
:root .rui-menubar__menu-item,
|
|
882
|
+
:root .rui-tree__node,
|
|
883
|
+
:root .rui-calendar__day {
|
|
884
|
+
border-radius: 0;
|
|
885
|
+
background-image: none;
|
|
886
|
+
transition: none;
|
|
887
|
+
}
|
|
888
|
+
:root .rui-listbox__option[aria-selected='true'][data-active]:not([aria-disabled='true']) {
|
|
889
|
+
--tw-ring-shadow: 0 0 #0000;
|
|
890
|
+
}
|
|
891
|
+
:root .rui-menu-button__item:is(:hover, :focus-visible):not([aria-disabled='true']),
|
|
892
|
+
:root .rui-menubar__menu-item:is(:hover, :focus-visible):not(:disabled):not([aria-disabled='true']),
|
|
893
|
+
:root .rui-menubar__menu-item[aria-expanded='true'],
|
|
894
|
+
:root .rui-menubar__item:is([aria-expanded='true'], :active):not(:disabled):not([aria-disabled='true']),
|
|
895
|
+
:root .rui-listbox__option[data-active]:not([aria-selected='true']):not([aria-disabled='true']) {
|
|
896
|
+
background-color: var(--macos-classic-selection);
|
|
897
|
+
color: var(--macos-classic-selection-text);
|
|
898
|
+
box-shadow: none;
|
|
899
|
+
outline: none;
|
|
900
|
+
--tw-ring-shadow: 0 0 #0000;
|
|
901
|
+
}
|
|
902
|
+
:root .rui-menubar {
|
|
903
|
+
border-radius: var(--radius-none);
|
|
904
|
+
gap: 0;
|
|
905
|
+
padding: 0 0.25rem;
|
|
906
|
+
border: 0;
|
|
907
|
+
border-bottom: 1px solid var(--macos-classic-dark);
|
|
908
|
+
background-color: var(--macos-classic-face);
|
|
909
|
+
box-shadow: inset 0 1px 0 var(--macos-classic-light);
|
|
910
|
+
}
|
|
911
|
+
:root .rui-menubar__item {
|
|
912
|
+
--tw-font-weight: var(--font-weight-normal, 400);
|
|
913
|
+
font-weight: var(--font-weight-normal, 400);
|
|
914
|
+
}
|
|
915
|
+
:root .rui-menubar__item:hover:not(:disabled):not([aria-disabled='true']):not([aria-expanded='true']) {
|
|
916
|
+
background-color: transparent;
|
|
917
|
+
}
|
|
918
|
+
:root .rui-tooltip__content {
|
|
919
|
+
--rui-tooltip-radius: 0;
|
|
920
|
+
--rui-tooltip-surface: var(--macos-classic-field);
|
|
921
|
+
--rui-tooltip-color: var(--macos-classic-field-text);
|
|
922
|
+
--rui-tooltip-shadow: 0 0 0 1px var(--macos-classic-dark), 2px 2px 0 rgb(0 0 0 / 0.3);
|
|
923
|
+
}
|
|
924
|
+
:root .rui-tag {
|
|
925
|
+
border-radius: var(--radius-sm);
|
|
926
|
+
border-color: var(--macos-classic-dark);
|
|
927
|
+
background-color: var(--macos-classic-face);
|
|
928
|
+
background-image: none;
|
|
929
|
+
color: var(--macos-classic-text);
|
|
930
|
+
box-shadow: var(--macos-classic-bevel);
|
|
931
|
+
}
|
|
932
|
+
:root .rui-tag[aria-selected='true'] {
|
|
933
|
+
border-color: var(--macos-classic-dark);
|
|
934
|
+
background-color: var(--macos-classic-selection);
|
|
935
|
+
color: var(--macos-classic-selection-text);
|
|
936
|
+
box-shadow: none;
|
|
937
|
+
}
|
|
938
|
+
:root .rui-tag__remove {
|
|
939
|
+
border-radius: var(--radius-none);
|
|
940
|
+
}
|
|
941
|
+
:root .rui-tree {
|
|
942
|
+
border-radius: var(--radius-none);
|
|
943
|
+
border-color: var(--macos-classic-dark);
|
|
944
|
+
background-color: var(--macos-classic-field);
|
|
945
|
+
color: var(--macos-classic-field-text);
|
|
946
|
+
box-shadow: none;
|
|
947
|
+
}
|
|
948
|
+
:root .rui-tree ul {
|
|
949
|
+
border-left: 0;
|
|
950
|
+
}
|
|
951
|
+
:root .rui-tree__node {
|
|
952
|
+
color: var(--macos-classic-field-text);
|
|
953
|
+
}
|
|
954
|
+
:root .rui-tree__node:hover:not([aria-selected='true']) {
|
|
955
|
+
background-color: transparent;
|
|
956
|
+
}
|
|
957
|
+
:root .rui-disclosure__icon--chevron > * {
|
|
958
|
+
display: none;
|
|
959
|
+
}
|
|
960
|
+
:root .rui-disclosure__icon--chevron::before {
|
|
961
|
+
content: '';
|
|
962
|
+
border-block: 4px solid transparent;
|
|
963
|
+
border-inline-start: 6px solid var(--macos-classic-text);
|
|
964
|
+
}
|
|
965
|
+
:root .rui-disclosure__icon--chevron,
|
|
966
|
+
:root .rui-disclosure__trigger[aria-expanded='true'] .rui-disclosure__icon--chevron {
|
|
967
|
+
transition: none;
|
|
968
|
+
transform: none;
|
|
969
|
+
}
|
|
970
|
+
:root .rui-disclosure__trigger[aria-expanded='true'] .rui-disclosure__icon--chevron {
|
|
971
|
+
transform: rotate(90deg);
|
|
972
|
+
}
|
|
973
|
+
:root .rui-disclosure__trigger:hover {
|
|
974
|
+
background-color: transparent;
|
|
975
|
+
}
|
|
858
976
|
:root .rui-listbox__option[aria-selected='true'],
|
|
859
977
|
:root .rui-menu-button__item[aria-checked='true'],
|
|
860
978
|
:root .rui-menubar__menu-item[aria-checked='true'],
|
|
861
979
|
:root .rui-tree__node[aria-selected='true'],
|
|
862
980
|
:root .rui-calendar__day[aria-selected='true'],
|
|
863
981
|
:root .rui-sidebar__menu-button--active,
|
|
982
|
+
:root .rui-sidebar__menu-button[aria-current='page'],
|
|
864
983
|
:root .rui-navigation-menu__link-list a[aria-current='page'] {
|
|
865
984
|
background-color: var(--macos-classic-selection);
|
|
866
985
|
color: var(--macos-classic-selection-text);
|
|
867
986
|
}
|
|
868
|
-
:root
|
|
987
|
+
:root rui-table,
|
|
869
988
|
:root .rui-grid {
|
|
989
|
+
border-radius: 0;
|
|
990
|
+
border-color: var(--macos-classic-dark);
|
|
991
|
+
box-shadow: none;
|
|
992
|
+
}
|
|
993
|
+
:root .rui-table__cell,
|
|
994
|
+
:root .rui-table__selection-cell,
|
|
995
|
+
:root .rui-table__empty-state,
|
|
996
|
+
:root .rui-table__empty-state-spacer,
|
|
997
|
+
:root .rui-grid__cell {
|
|
998
|
+
border-color: var(--macos-classic-mid);
|
|
870
999
|
background-color: var(--macos-classic-field);
|
|
871
1000
|
color: var(--macos-classic-field-text);
|
|
872
1001
|
}
|
|
873
|
-
:root .rui-
|
|
874
|
-
:root .rui-
|
|
875
|
-
:root .rui-
|
|
1002
|
+
:root .rui-table__column,
|
|
1003
|
+
:root .rui-grid__row:first-child .rui-grid__cell,
|
|
1004
|
+
:root .rui-treegrid__row--header .rui-treegrid__cell {
|
|
1005
|
+
--tw-font-weight: var(--font-weight-normal, 400);
|
|
1006
|
+
font-weight: var(--font-weight-normal, 400);
|
|
1007
|
+
border-right: 1px solid var(--macos-classic-shadow);
|
|
1008
|
+
border-bottom: 1px solid var(--macos-classic-dark);
|
|
1009
|
+
background-color: var(--macos-classic-face);
|
|
1010
|
+
color: var(--macos-classic-text);
|
|
1011
|
+
box-shadow: var(--macos-classic-bevel);
|
|
1012
|
+
}
|
|
1013
|
+
:root .rui-table__column .rui-table__sort {
|
|
1014
|
+
--tw-font-weight: var(--font-weight-normal, 400);
|
|
1015
|
+
font-weight: var(--font-weight-normal, 400);
|
|
1016
|
+
color: var(--macos-classic-text);
|
|
1017
|
+
}
|
|
1018
|
+
:root .rui-calendar__weekdays {
|
|
876
1019
|
--tw-font-weight: var(--font-weight-normal, 400);
|
|
877
1020
|
font-weight: var(--font-weight-normal, 400);
|
|
878
1021
|
background-color: var(--macos-classic-face);
|
|
879
1022
|
box-shadow: var(--macos-classic-raised);
|
|
880
1023
|
}
|
|
881
|
-
:root .rui-table__row:nth-child(even),
|
|
882
|
-
:root .rui-grid__row:nth-child(even) {
|
|
883
|
-
background-color: var(--macos-classic-light);
|
|
884
|
-
background-image: linear-gradient(var(--macos-classic-container) 0 0);
|
|
885
|
-
background-blend-mode: soft-light;
|
|
886
|
-
}
|
|
887
1024
|
:root .rui-treegrid {
|
|
888
1025
|
border-radius: var(--radius-none);
|
|
889
|
-
border
|
|
890
|
-
border-width: 0px;
|
|
1026
|
+
border: 1px solid var(--macos-classic-dark);
|
|
891
1027
|
background-color: var(--macos-classic-field);
|
|
892
1028
|
color: var(--macos-classic-field-text);
|
|
893
|
-
box-shadow:
|
|
1029
|
+
box-shadow: none;
|
|
894
1030
|
--rui-treegrid-indent: 0.875rem;
|
|
895
1031
|
}
|
|
896
1032
|
:root .rui-treegrid__cell {
|
|
@@ -901,13 +1037,6 @@
|
|
|
901
1037
|
padding-block: calc(var(--spacing, 0.25rem) * 1.5);
|
|
902
1038
|
color: var(--macos-classic-field-text);
|
|
903
1039
|
}
|
|
904
|
-
:root .rui-treegrid__row--header .rui-treegrid__cell {
|
|
905
|
-
--tw-font-weight: var(--font-weight-normal, 400);
|
|
906
|
-
font-weight: var(--font-weight-normal, 400);
|
|
907
|
-
background-color: var(--macos-classic-face);
|
|
908
|
-
color: var(--macos-classic-text);
|
|
909
|
-
box-shadow: var(--macos-classic-raised-thin);
|
|
910
|
-
}
|
|
911
1040
|
:root .rui-treegrid__row:not(.rui-treegrid__row--header):hover .rui-treegrid__cell:not([aria-selected='true']) {
|
|
912
1041
|
background-color: var(--macos-classic-container);
|
|
913
1042
|
}
|
|
@@ -930,7 +1059,7 @@
|
|
|
930
1059
|
transform: rotate(90deg);
|
|
931
1060
|
}
|
|
932
1061
|
:root .rui-alert,
|
|
933
|
-
:root .rui-
|
|
1062
|
+
:root .rui-toast {
|
|
934
1063
|
border-radius: var(--radius-none);
|
|
935
1064
|
color: var(--color-on-surface);
|
|
936
1065
|
border: 1px solid var(--macos-classic-dark);
|
|
@@ -938,6 +1067,27 @@
|
|
|
938
1067
|
box-shadow: var(--macos-classic-bevel),
|
|
939
1068
|
1px 1px 0 var(--macos-classic-dark);
|
|
940
1069
|
}
|
|
1070
|
+
:root .rui-toast {
|
|
1071
|
+
background-image: none;
|
|
1072
|
+
}
|
|
1073
|
+
:root .rui-toast--info .rui-toast__icon {
|
|
1074
|
+
color: var(--macos-classic-blue);
|
|
1075
|
+
}
|
|
1076
|
+
:root .rui-toast--success .rui-toast__icon {
|
|
1077
|
+
color: var(--macos-classic-green);
|
|
1078
|
+
}
|
|
1079
|
+
:root .rui-toast--warning .rui-toast__icon {
|
|
1080
|
+
color: var(--macos-classic-amber);
|
|
1081
|
+
}
|
|
1082
|
+
:root .rui-toast--error .rui-toast__icon {
|
|
1083
|
+
color: var(--macos-classic-red);
|
|
1084
|
+
}
|
|
1085
|
+
:root .rui-toast__close {
|
|
1086
|
+
border-color: var(--macos-classic-dark);
|
|
1087
|
+
background-color: var(--macos-classic-face);
|
|
1088
|
+
color: var(--macos-classic-text);
|
|
1089
|
+
box-shadow: var(--macos-classic-bevel);
|
|
1090
|
+
}
|
|
941
1091
|
:root .rui-alert--inline.rui-alert--dismissible {
|
|
942
1092
|
padding-inline-start: 2.5rem;
|
|
943
1093
|
}
|
|
@@ -969,19 +1119,35 @@
|
|
|
969
1119
|
color: var(--macos-classic-red);
|
|
970
1120
|
}
|
|
971
1121
|
:root .rui-badge,
|
|
972
|
-
:root .rui-chip
|
|
973
|
-
:root .rui-pagination__link {
|
|
1122
|
+
:root .rui-chip {
|
|
974
1123
|
border-radius: var(--radius-sm);
|
|
975
1124
|
color: var(--color-on-surface);
|
|
976
1125
|
border: 1px solid var(--macos-classic-dark);
|
|
977
1126
|
background-color: var(--macos-classic-face);
|
|
978
1127
|
box-shadow: var(--macos-classic-raised);
|
|
979
1128
|
}
|
|
1129
|
+
:root .rui-pagination__link {
|
|
1130
|
+
min-width: 0;
|
|
1131
|
+
}
|
|
1132
|
+
:root .rui-calendar {
|
|
1133
|
+
--radius-control: 0;
|
|
1134
|
+
}
|
|
980
1135
|
:root .rui-separator,
|
|
981
1136
|
:root .rui-sidebar__separator {
|
|
982
1137
|
background-color: var(--macos-classic-shadow);
|
|
983
1138
|
box-shadow: 0 1px 0 var(--macos-classic-light);
|
|
984
1139
|
}
|
|
1140
|
+
:root .rui-slider {
|
|
1141
|
+
--rui-slider-track-size: 0.3125rem;
|
|
1142
|
+
}
|
|
1143
|
+
:root .rui-slider__thumb {
|
|
1144
|
+
inline-size: 0.6875rem;
|
|
1145
|
+
block-size: 1.125rem;
|
|
1146
|
+
}
|
|
1147
|
+
:root .rui-slider--vertical .rui-slider__thumb {
|
|
1148
|
+
inline-size: 1.125rem;
|
|
1149
|
+
block-size: 0.6875rem;
|
|
1150
|
+
}
|
|
985
1151
|
:root .rui-slider__thumb,
|
|
986
1152
|
:root .rui-number-field__stepper {
|
|
987
1153
|
border-radius: var(--radius-sm);
|
|
@@ -997,9 +1163,15 @@
|
|
|
997
1163
|
background-color: var(--macos-classic-field);
|
|
998
1164
|
box-shadow: var(--macos-classic-well);
|
|
999
1165
|
}
|
|
1166
|
+
:root .rui-meter__track {
|
|
1167
|
+
background-color: var(--macos-classic-container);
|
|
1168
|
+
}
|
|
1000
1169
|
:root .rui-meter__fill {
|
|
1001
1170
|
border-radius: var(--radius-none);
|
|
1002
1171
|
background-color: var(--macos-classic-selection);
|
|
1172
|
+
box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.45),
|
|
1173
|
+
inset 0 -1px 0 rgb(0 0 0 / 0.3),
|
|
1174
|
+
1px 0 0 var(--macos-classic-dark);
|
|
1003
1175
|
}
|
|
1004
1176
|
:root .rui-slider__range-fill {
|
|
1005
1177
|
border-radius: var(--radius-none);
|