@itwin/itwinui-css 0.45.0 → 0.48.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/css/all.css +699 -710
- package/css/badge.css +4 -2
- package/css/button.css +31 -96
- package/css/color-picker.css +26 -21
- package/css/expandable-block.css +12 -0
- package/css/inputs.css +498 -503
- package/css/popover.css +3 -3
- package/css/side-navigation.css +2 -4
- package/css/skip-to-content.css +51 -0
- package/css/table.css +10 -49
- package/css/tile.css +42 -15
- package/css/tree.css +21 -15
- package/package.json +2 -2
- package/scss/badge/badge.scss +5 -2
- package/scss/button/button-group.scss +19 -41
- package/scss/button/button.scss +19 -1
- package/scss/button/classes.scss +0 -1
- package/scss/button/default.scss +1 -0
- package/scss/classes.scss +1 -0
- package/scss/color-picker/color-picker.scss +57 -52
- package/scss/expandable-block/block.scss +23 -0
- package/scss/index.scss +1 -0
- package/scss/inputs/checkbox-radio.scss +17 -136
- package/scss/inputs/checkbox.scss +77 -43
- package/scss/inputs/classes.scss +15 -9
- package/scss/inputs/index.scss +1 -0
- package/scss/inputs/input-with-icon.scss +36 -0
- package/scss/inputs/input.scss +1 -0
- package/scss/inputs/labeled-inputs.scss +49 -14
- package/scss/inputs/radio.scss +9 -3
- package/scss/inputs/select.scss +44 -93
- package/scss/popover/popover.scss +7 -6
- package/scss/side-navigation/side-navigation.scss +3 -6
- package/scss/skip-to-content/classes.scss +7 -0
- package/scss/skip-to-content/index.scss +3 -0
- package/scss/skip-to-content/skip-to-content.scss +37 -0
- package/scss/style/mixins.scss +29 -4
- package/scss/style/variables.scss +1 -0
- package/scss/table/paginator.scss +5 -10
- package/scss/tile/classes.scss +4 -0
- package/scss/tile/tile.scss +17 -16
- package/scss/tree/classes.scss +4 -0
- package/scss/tree/tree.scss +17 -4
package/css/all.css
CHANGED
|
@@ -483,6 +483,8 @@ html.iui-theme-dark{
|
|
|
483
483
|
outline-color:var(--iui-color-foreground-primary); }
|
|
484
484
|
|
|
485
485
|
.iui-badge{
|
|
486
|
+
--iui-badge-background-color:#C7CCD1;
|
|
487
|
+
--_iui-badge-text-color:rgba(0, 0, 0, 0.6);
|
|
486
488
|
margin:0;
|
|
487
489
|
padding:0;
|
|
488
490
|
border:none;
|
|
@@ -492,8 +494,8 @@ html.iui-theme-dark{
|
|
|
492
494
|
padding:0 6px;
|
|
493
495
|
margin:6px 0;
|
|
494
496
|
border-radius:3px;
|
|
495
|
-
background-color:var(--badge-color
|
|
496
|
-
color:var(--badge-text-color
|
|
497
|
+
background-color:var(--iui-badge-background-color);
|
|
498
|
+
color:var(--_iui-badge-text-color);
|
|
497
499
|
text-transform:uppercase;
|
|
498
500
|
-webkit-user-select:none;
|
|
499
501
|
-moz-user-select:none;
|
|
@@ -643,6 +645,7 @@ html.iui-theme-dark{
|
|
|
643
645
|
fill:var(--iui-icons-color-negative); }
|
|
644
646
|
|
|
645
647
|
.iui-button{
|
|
648
|
+
--_iui-button-active-stripe-inset:initial;
|
|
646
649
|
margin:0;
|
|
647
650
|
padding:0;
|
|
648
651
|
border:none;
|
|
@@ -656,7 +659,6 @@ html.iui-theme-dark{
|
|
|
656
659
|
box-sizing:border-box;
|
|
657
660
|
border-radius:3px;
|
|
658
661
|
line-height:22px;
|
|
659
|
-
outline:none;
|
|
660
662
|
box-shadow:none;
|
|
661
663
|
font-size:14px;
|
|
662
664
|
font-weight:400;
|
|
@@ -698,6 +700,13 @@ html.iui-theme-dark{
|
|
|
698
700
|
background:var(--iui-color-background-disabled);
|
|
699
701
|
border-color:var(--iui-color-background-disabled);
|
|
700
702
|
color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)); }
|
|
703
|
+
.iui-button.iui-active::after{
|
|
704
|
+
content:'';
|
|
705
|
+
position:absolute;
|
|
706
|
+
inset:var(--_iui-button-active-stripe-inset);
|
|
707
|
+
background-color:var(--iui-color-foreground-primary); }
|
|
708
|
+
.iui-button.iui-active[disabled]::after, .iui-button.iui-active:disabled::after{
|
|
709
|
+
background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)); }
|
|
701
710
|
.iui-button.iui-default{
|
|
702
711
|
background-color:#FFF;
|
|
703
712
|
border-color:rgba(0, 0, 0, 0.4);
|
|
@@ -904,133 +913,61 @@ html.iui-theme-dark{
|
|
|
904
913
|
isolation:isolate; }
|
|
905
914
|
.iui-button-group > *{
|
|
906
915
|
display:flex; }
|
|
907
|
-
.iui-button-group > * input, .iui-button-group > * button{
|
|
916
|
+
.iui-button-group > * .iui-input-container, .iui-button-group > * .iui-button, .iui-button-group > * .iui-input:where(:not(.iui-input-container .iui-input)){
|
|
908
917
|
position:relative;
|
|
909
|
-
|
|
910
|
-
.iui-button-group > * input:hover, .iui-button-group > * button:hover{
|
|
918
|
+
--_iui-button-active-stripe-inset:2px 2px calc(100% - 4px); }
|
|
919
|
+
.iui-button-group > * .iui-input-container:hover, .iui-button-group > * .iui-button:hover, .iui-button-group > * .iui-input:where(:not(.iui-input-container .iui-input)):hover{
|
|
911
920
|
z-index:1; }
|
|
912
|
-
.iui-button-group > * input:focus, .iui-button-group > * button:focus{
|
|
921
|
+
.iui-button-group > * .iui-input-container:focus, .iui-button-group > * .iui-input-container:focus-within, .iui-button-group > * .iui-button:focus, .iui-button-group > * .iui-button:focus-within, .iui-button-group > * .iui-input:where(:not(.iui-input-container .iui-input)):focus, .iui-button-group > * .iui-input:where(:not(.iui-input-container .iui-input)):focus-within{
|
|
913
922
|
z-index:2; }
|
|
914
|
-
|
|
915
|
-
z-index:revert; }
|
|
916
|
-
.iui-button-group > * input:disabled, .iui-button-group > * button:disabled{
|
|
923
|
+
.iui-button-group > * .iui-input-container:disabled, .iui-button-group > * .iui-input-container.iui-disabled, .iui-button-group > * .iui-input-container[aria-disabled="true"], .iui-button-group > * .iui-button:disabled, .iui-button-group > * .iui-button.iui-disabled, .iui-button-group > * .iui-button[aria-disabled="true"], .iui-button-group > * .iui-input:where(:not(.iui-input-container .iui-input)):disabled, .iui-button-group > * .iui-input:where(:not(.iui-input-container .iui-input)).iui-disabled, .iui-button-group > * .iui-input:where(:not(.iui-input-container .iui-input))[aria-disabled="true"]{
|
|
917
924
|
z-index:-1; }
|
|
918
|
-
|
|
925
|
+
.iui-button-group > * .iui-input, .iui-button-group > * .iui-button:where(:not(.iui-borderless)){
|
|
926
|
+
border-radius:0;
|
|
927
|
+
transition-duration:0ms; }
|
|
928
|
+
.iui-button-group > * .iui-input:hover, .iui-button-group > * .iui-input:focus, .iui-button-group > * .iui-button:where(:not(.iui-borderless)):hover, .iui-button-group > * .iui-button:where(:not(.iui-borderless)):focus{
|
|
919
929
|
transition-duration:0.2s; }
|
|
920
|
-
|
|
921
|
-
content:'';
|
|
922
|
-
position:absolute;
|
|
923
|
-
height:2px;
|
|
924
|
-
opacity:1;
|
|
925
|
-
top:2px;
|
|
926
|
-
left:2px;
|
|
927
|
-
width:calc(100% - 4px);
|
|
928
|
-
background-color:#008BE1;
|
|
929
|
-
background-color:var(--iui-color-foreground-primary); }
|
|
930
|
-
.iui-button-group > * input.iui-active:disabled::after, .iui-button-group > * button.iui-active:disabled::after{
|
|
931
|
-
background-color:rgba(0, 0, 0, 0.2);
|
|
932
|
-
background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)); }
|
|
933
|
-
.iui-button-group > * input:not(.iui-borderless), .iui-button-group > * button:not(.iui-borderless){
|
|
934
|
-
border-radius:0; }
|
|
935
|
-
.iui-button-group > *:first-child input, .iui-button-group > *:first-child button:not(.iui-borderless){
|
|
930
|
+
.iui-button-group > *:first-child .iui-input, .iui-button-group > *:first-child .iui-button:where(:not(.iui-borderless)){
|
|
936
931
|
border-top-left-radius:3px;
|
|
937
932
|
border-bottom-left-radius:3px; }
|
|
938
|
-
.iui-button-group > *:last-child input, .iui-button-group > *:last-child button:not(.iui-borderless){
|
|
933
|
+
.iui-button-group > *:last-child .iui-input, .iui-button-group > *:last-child .iui-button:where(:not(.iui-borderless)){
|
|
939
934
|
border-top-right-radius:3px;
|
|
940
935
|
border-bottom-right-radius:3px; }
|
|
941
936
|
.iui-button-group > * + *{
|
|
942
937
|
margin-left:-1px; }
|
|
943
|
-
.iui-button-group > *:not(:first-child) .iui-default:disabled{
|
|
938
|
+
.iui-button-group > *:not(:first-child) :where(.iui-button.iui-default):disabled, .iui-button-group > *:not(:first-child) :where(.iui-button.iui-default).iui-disabled, .iui-button-group > *:not(:first-child) :where(.iui-button.iui-default)[aria-disabled="true"]{
|
|
944
939
|
border-left-color:#DCE0E3;
|
|
945
940
|
border-left-color:var(--iui-color-background-4); }
|
|
946
941
|
|
|
947
942
|
.iui-button-split-menu{
|
|
948
|
-
display:inline-flex;
|
|
949
|
-
align-items:center;
|
|
950
|
-
isolation:isolate;
|
|
951
943
|
display:inline-flex;
|
|
952
944
|
align-items:center;
|
|
953
945
|
isolation:isolate; }
|
|
954
946
|
.iui-button-split-menu > *{
|
|
955
947
|
display:flex; }
|
|
956
|
-
.iui-button-split-menu > * input, .iui-button-split-menu > * button{
|
|
948
|
+
.iui-button-split-menu > * .iui-input-container, .iui-button-split-menu > * .iui-button, .iui-button-split-menu > * .iui-input:where(:not(.iui-input-container .iui-input)){
|
|
957
949
|
position:relative;
|
|
958
|
-
|
|
959
|
-
.iui-button-split-menu > * input:hover, .iui-button-split-menu > * button:hover{
|
|
950
|
+
--_iui-button-active-stripe-inset:2px 2px calc(100% - 4px); }
|
|
951
|
+
.iui-button-split-menu > * .iui-input-container:hover, .iui-button-split-menu > * .iui-button:hover, .iui-button-split-menu > * .iui-input:where(:not(.iui-input-container .iui-input)):hover{
|
|
960
952
|
z-index:1; }
|
|
961
|
-
.iui-button-split-menu > * input:focus, .iui-button-split-menu > * button:focus{
|
|
953
|
+
.iui-button-split-menu > * .iui-input-container:focus, .iui-button-split-menu > * .iui-input-container:focus-within, .iui-button-split-menu > * .iui-button:focus, .iui-button-split-menu > * .iui-button:focus-within, .iui-button-split-menu > * .iui-input:where(:not(.iui-input-container .iui-input)):focus, .iui-button-split-menu > * .iui-input:where(:not(.iui-input-container .iui-input)):focus-within{
|
|
962
954
|
z-index:2; }
|
|
963
|
-
|
|
964
|
-
z-index:revert; }
|
|
965
|
-
.iui-button-split-menu > * input:disabled, .iui-button-split-menu > * button:disabled{
|
|
955
|
+
.iui-button-split-menu > * .iui-input-container:disabled, .iui-button-split-menu > * .iui-input-container.iui-disabled, .iui-button-split-menu > * .iui-input-container[aria-disabled="true"], .iui-button-split-menu > * .iui-button:disabled, .iui-button-split-menu > * .iui-button.iui-disabled, .iui-button-split-menu > * .iui-button[aria-disabled="true"], .iui-button-split-menu > * .iui-input:where(:not(.iui-input-container .iui-input)):disabled, .iui-button-split-menu > * .iui-input:where(:not(.iui-input-container .iui-input)).iui-disabled, .iui-button-split-menu > * .iui-input:where(:not(.iui-input-container .iui-input))[aria-disabled="true"]{
|
|
966
956
|
z-index:-1; }
|
|
967
|
-
|
|
968
|
-
|
|
969
|
-
.iui-button-split-menu > * input.iui-active::after, .iui-button-split-menu > * button.iui-active::after{
|
|
970
|
-
content:'';
|
|
971
|
-
position:absolute;
|
|
972
|
-
height:2px;
|
|
973
|
-
opacity:1;
|
|
974
|
-
top:2px;
|
|
975
|
-
left:2px;
|
|
976
|
-
width:calc(100% - 4px);
|
|
977
|
-
background-color:#008BE1;
|
|
978
|
-
background-color:var(--iui-color-foreground-primary); }
|
|
979
|
-
.iui-button-split-menu > * input.iui-active:disabled::after, .iui-button-split-menu > * button.iui-active:disabled::after{
|
|
980
|
-
background-color:rgba(0, 0, 0, 0.2);
|
|
981
|
-
background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)); }
|
|
982
|
-
.iui-button-split-menu > * input:not(.iui-borderless), .iui-button-split-menu > * button:not(.iui-borderless){
|
|
983
|
-
border-radius:0; }
|
|
984
|
-
.iui-button-split-menu > *:first-child input, .iui-button-split-menu > *:first-child button:not(.iui-borderless){
|
|
985
|
-
border-top-left-radius:3px;
|
|
986
|
-
border-bottom-left-radius:3px; }
|
|
987
|
-
.iui-button-split-menu > *:last-child input, .iui-button-split-menu > *:last-child button:not(.iui-borderless){
|
|
988
|
-
border-top-right-radius:3px;
|
|
989
|
-
border-bottom-right-radius:3px; }
|
|
990
|
-
.iui-button-split-menu > * + *{
|
|
991
|
-
margin-left:-1px; }
|
|
992
|
-
.iui-button-split-menu > *:not(:first-child) .iui-default:disabled{
|
|
993
|
-
border-left-color:#DCE0E3;
|
|
994
|
-
border-left-color:var(--iui-color-background-4); }
|
|
995
|
-
.iui-button-split-menu > *{
|
|
996
|
-
display:flex; }
|
|
997
|
-
.iui-button-split-menu > * input, .iui-button-split-menu > * button{
|
|
998
|
-
position:relative;
|
|
957
|
+
.iui-button-split-menu > * .iui-input, .iui-button-split-menu > * .iui-button:where(:not(.iui-borderless)){
|
|
958
|
+
border-radius:0;
|
|
999
959
|
transition-duration:0ms; }
|
|
1000
|
-
.iui-button-split-menu > * input:hover, .iui-button-split-menu > * button:hover{
|
|
1001
|
-
z-index:1; }
|
|
1002
|
-
.iui-button-split-menu > * input:focus, .iui-button-split-menu > * button:focus{
|
|
1003
|
-
z-index:2; }
|
|
1004
|
-
.iui-button-split-menu > * input:focus:where(:not(:focus-visible):not(:hover)), .iui-button-split-menu > * button:focus:where(:not(:focus-visible):not(:hover)){
|
|
1005
|
-
z-index:revert; }
|
|
1006
|
-
.iui-button-split-menu > * input:disabled, .iui-button-split-menu > * button:disabled{
|
|
1007
|
-
z-index:-1; }
|
|
1008
|
-
.iui-button-split-menu > * input:hover, .iui-button-split-menu > * input:focus, .iui-button-split-menu > * button:hover, .iui-button-split-menu > * button:focus{
|
|
960
|
+
.iui-button-split-menu > * .iui-input:hover, .iui-button-split-menu > * .iui-input:focus, .iui-button-split-menu > * .iui-button:where(:not(.iui-borderless)):hover, .iui-button-split-menu > * .iui-button:where(:not(.iui-borderless)):focus{
|
|
1009
961
|
transition-duration:0.2s; }
|
|
1010
|
-
|
|
1011
|
-
content:'';
|
|
1012
|
-
position:absolute;
|
|
1013
|
-
height:2px;
|
|
1014
|
-
opacity:1;
|
|
1015
|
-
top:2px;
|
|
1016
|
-
left:2px;
|
|
1017
|
-
width:calc(100% - 4px);
|
|
1018
|
-
background-color:#008BE1;
|
|
1019
|
-
background-color:var(--iui-color-foreground-primary); }
|
|
1020
|
-
.iui-button-split-menu > * input.iui-active:disabled::after, .iui-button-split-menu > * button.iui-active:disabled::after{
|
|
1021
|
-
background-color:rgba(0, 0, 0, 0.2);
|
|
1022
|
-
background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)); }
|
|
1023
|
-
.iui-button-split-menu > * input:not(.iui-borderless), .iui-button-split-menu > * button:not(.iui-borderless){
|
|
1024
|
-
border-radius:0; }
|
|
1025
|
-
.iui-button-split-menu > *:first-child input, .iui-button-split-menu > *:first-child button:not(.iui-borderless){
|
|
962
|
+
.iui-button-split-menu > *:first-child .iui-input, .iui-button-split-menu > *:first-child .iui-button:where(:not(.iui-borderless)){
|
|
1026
963
|
border-top-left-radius:3px;
|
|
1027
964
|
border-bottom-left-radius:3px; }
|
|
1028
|
-
.iui-button-split-menu > *:last-child input, .iui-button-split-menu > *:last-child button:not(.iui-borderless){
|
|
965
|
+
.iui-button-split-menu > *:last-child .iui-input, .iui-button-split-menu > *:last-child .iui-button:where(:not(.iui-borderless)){
|
|
1029
966
|
border-top-right-radius:3px;
|
|
1030
967
|
border-bottom-right-radius:3px; }
|
|
1031
968
|
.iui-button-split-menu > * + *{
|
|
1032
969
|
margin-left:-1px; }
|
|
1033
|
-
.iui-button-split-menu > *:not(:first-child) .iui-default:disabled{
|
|
970
|
+
.iui-button-split-menu > *:not(:first-child) :where(.iui-button.iui-default):disabled, .iui-button-split-menu > *:not(:first-child) :where(.iui-button.iui-default).iui-disabled, .iui-button-split-menu > *:not(:first-child) :where(.iui-button.iui-default)[aria-disabled="true"]{
|
|
1034
971
|
border-left-color:#DCE0E3;
|
|
1035
972
|
border-left-color:var(--iui-color-background-4); }
|
|
1036
973
|
.iui-button-split-menu:hover{
|
|
@@ -1244,6 +1181,7 @@ html.iui-theme-dark{
|
|
|
1244
1181
|
color:var(--iui-text-color-muted); }
|
|
1245
1182
|
|
|
1246
1183
|
.iui-color-picker{
|
|
1184
|
+
--iui-color-picker-selected-color:initial;
|
|
1247
1185
|
margin:0;
|
|
1248
1186
|
padding:0;
|
|
1249
1187
|
border:none;
|
|
@@ -1324,34 +1262,43 @@ html.iui-theme-dark{
|
|
|
1324
1262
|
appearance:none; }
|
|
1325
1263
|
|
|
1326
1264
|
.iui-color-swatch{
|
|
1265
|
+
--iui-color-swatch-background:initial;
|
|
1327
1266
|
height:24px;
|
|
1328
1267
|
width:24px;
|
|
1329
1268
|
cursor:pointer;
|
|
1330
1269
|
border-radius:5px;
|
|
1331
|
-
background-color:var(--swatch-color);
|
|
1332
1270
|
margin-bottom:4px;
|
|
1333
1271
|
margin-right:4px;
|
|
1334
|
-
|
|
1335
|
-
|
|
1272
|
+
position:relative;
|
|
1273
|
+
background-color:var(--iui-color-swatch-background);
|
|
1274
|
+
background-position:0 0, 8px 8px;
|
|
1275
|
+
background-size:16px 16px;
|
|
1276
|
+
background-image:repeating-linear-gradient(45deg, #EEF0F3 25%, transparent 25%, transparent 75%, #EEF0F3 75%, #EEF0F3), repeating-linear-gradient(45deg, #EEF0F3 25%, #C7CCD1 25%, #C7CCD1 75%, #EEF0F3 75%, #EEF0F3);
|
|
1277
|
+
background-image:repeating-linear-gradient(45deg, var(--iui-color-background-3) 25%, transparent 25%, transparent 75%, var(--iui-color-background-3) 75%, var(--iui-color-background-3)), repeating-linear-gradient(45deg, var(--iui-color-background-3) 25%, var(--iui-color-background-5) 25%, var(--iui-color-background-5) 75%, var(--iui-color-background-3) 75%, var(--iui-color-background-3)); }
|
|
1336
1278
|
@supports (gap: 8px){
|
|
1337
1279
|
.iui-color-swatch{
|
|
1338
1280
|
margin-bottom:0;
|
|
1339
1281
|
margin-right:0; } }
|
|
1282
|
+
.iui-color-swatch::after{
|
|
1283
|
+
content:'';
|
|
1284
|
+
position:absolute;
|
|
1285
|
+
width:inherit;
|
|
1286
|
+
height:inherit;
|
|
1287
|
+
border-radius:inherit;
|
|
1288
|
+
background-color:inherit;
|
|
1289
|
+
box-shadow:inset 0 0 0 1px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)); }
|
|
1340
1290
|
.iui-color-swatch:hover{
|
|
1341
|
-
box-shadow:0 0 1px 3px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)), inset 0 0 0 1px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
|
|
1342
1291
|
box-shadow:0 0 1px 3px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)), inset 0 0 0 1px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)); }
|
|
1343
1292
|
.iui-color-swatch:focus-visible{
|
|
1344
1293
|
outline:2px solid var(--iui-color-foreground-primary);
|
|
1345
|
-
outline-offset:
|
|
1294
|
+
outline-offset:1px; }
|
|
1346
1295
|
@supports not selector(*:focus-visible){
|
|
1347
1296
|
.iui-color-swatch:focus{
|
|
1348
1297
|
outline:2px solid var(--iui-color-foreground-primary);
|
|
1349
|
-
outline-offset:
|
|
1298
|
+
outline-offset:1px; } }
|
|
1350
1299
|
.iui-color-swatch.iui-active{
|
|
1351
|
-
box-shadow:0 0 0 2px rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-3)), inset 0 0 0 1px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
|
|
1352
1300
|
box-shadow:0 0 0 2px rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-3)), inset 0 0 0 1px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)); }
|
|
1353
1301
|
.iui-color-swatch.iui-active:hover{
|
|
1354
|
-
box-shadow:0 0 1px 3px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)), inset 0 0 0 1px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)), 0 0 0 2px rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-3));
|
|
1355
1302
|
box-shadow:0 0 1px 3px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)), inset 0 0 0 1px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)), 0 0 0 2px rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-3)); }
|
|
1356
1303
|
|
|
1357
1304
|
.iui-color-picker-section-label{
|
|
@@ -1367,12 +1314,12 @@ html.iui-theme-dark{
|
|
|
1367
1314
|
min-width:280px; }
|
|
1368
1315
|
|
|
1369
1316
|
.iui-color-field{
|
|
1317
|
+
--iui-color-field-hue:initial;
|
|
1370
1318
|
position:relative;
|
|
1371
1319
|
cursor:crosshair;
|
|
1372
1320
|
width:100%;
|
|
1373
1321
|
height:209px;
|
|
1374
|
-
background-image:linear-gradient(0deg, black, transparent), linear-gradient(90deg, white, var(--hue));
|
|
1375
|
-
background-image:linear-gradient(0deg, black, transparent), linear-gradient(90deg, white, var(--hue)); }
|
|
1322
|
+
background-image:linear-gradient(0deg, black, transparent), linear-gradient(90deg, white, var(--iui-color-field-hue)); }
|
|
1376
1323
|
.iui-color-field:not(:last-child){
|
|
1377
1324
|
margin-bottom:6px; }
|
|
1378
1325
|
|
|
@@ -1386,37 +1333,32 @@ html.iui-theme-dark{
|
|
|
1386
1333
|
|
|
1387
1334
|
.iui-opacity-slider .iui-slider-rail{
|
|
1388
1335
|
height:8px;
|
|
1389
|
-
background-image:repeating-linear-gradient(45deg, #EEF0F3 25%, transparent 25%, transparent 75%, #EEF0F3 75%, #EEF0F3), repeating-linear-gradient(45deg, #EEF0F3 25%, #C7CCD1 25%, #C7CCD1 75%, #EEF0F3 75%, #EEF0F3);
|
|
1390
1336
|
background-position:0 0, 4px 4px;
|
|
1391
1337
|
background-size:8px 8px;
|
|
1392
|
-
background-image:repeating-linear-gradient(45deg,
|
|
1393
|
-
background-
|
|
1394
|
-
background-size:8px 8px; }
|
|
1338
|
+
background-image:repeating-linear-gradient(45deg, #EEF0F3 25%, transparent 25%, transparent 75%, #EEF0F3 75%, #EEF0F3), repeating-linear-gradient(45deg, #EEF0F3 25%, #C7CCD1 25%, #C7CCD1 75%, #EEF0F3 75%, #EEF0F3);
|
|
1339
|
+
background-image:repeating-linear-gradient(45deg, var(--iui-color-background-3) 25%, transparent 25%, transparent 75%, var(--iui-color-background-3) 75%, var(--iui-color-background-3)), repeating-linear-gradient(45deg, var(--iui-color-background-3) 25%, var(--iui-color-background-5) 25%, var(--iui-color-background-5) 75%, var(--iui-color-background-3) 75%, var(--iui-color-background-3)); }
|
|
1395
1340
|
.iui-opacity-slider .iui-slider-rail::before{
|
|
1396
1341
|
display:block;
|
|
1397
1342
|
content:'';
|
|
1398
1343
|
width:100%;
|
|
1399
1344
|
height:100%;
|
|
1400
|
-
background-image:linear-gradient(to right, transparent 0%, var(--selected-color) 100%); }
|
|
1345
|
+
background-image:linear-gradient(to right, transparent 0%, var(--iui-color-picker-selected-color) 100%); }
|
|
1401
1346
|
|
|
1402
1347
|
.iui-opacity-slider .iui-slider-thumb{
|
|
1403
1348
|
top:7px; }
|
|
1404
1349
|
|
|
1405
1350
|
.iui-color-dot{
|
|
1351
|
+
--iui-color-dot-inset:initial;
|
|
1406
1352
|
position:absolute;
|
|
1407
|
-
|
|
1408
|
-
left:var(--left, 0%);
|
|
1353
|
+
inset:var(--iui-color-dot-inset);
|
|
1409
1354
|
width:16px;
|
|
1410
1355
|
height:16px;
|
|
1411
1356
|
border-radius:50%;
|
|
1412
1357
|
transform:translate(-8px, -8px);
|
|
1413
1358
|
cursor:crosshair;
|
|
1414
|
-
box-shadow:white 0 0 0 1px, inset 0 0 0 1px rgba(255, 255, 255, 0.1);
|
|
1415
|
-
background-color:var(--selected-color);
|
|
1416
1359
|
box-shadow:rgba(var(--iui-color-foreground-accessory-rgb), var(--iui-opacity-1)) 0 0 0 1px, inset 0 0 0 1px rgba(var(--iui-color-foreground-accessory-rgb), var(--iui-opacity-6));
|
|
1417
|
-
background-color:var(--selected-color); }
|
|
1360
|
+
background-color:var(--iui-color-picker-selected-color); }
|
|
1418
1361
|
.iui-color-dot:hover{
|
|
1419
|
-
box-shadow:0 0 1px 3px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5));
|
|
1420
1362
|
box-shadow:0 0 1px 3px rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)); }
|
|
1421
1363
|
.iui-color-dot:focus-visible{
|
|
1422
1364
|
outline:2px solid var(--iui-color-foreground-primary);
|
|
@@ -1699,6 +1641,18 @@ html.iui-theme-dark{
|
|
|
1699
1641
|
margin-left:8px; }
|
|
1700
1642
|
.iui-expandable-block.iui-small .iui-header > .iui-status-icon{
|
|
1701
1643
|
margin-left:8px; }
|
|
1644
|
+
.iui-expandable-block.iui-borderless,
|
|
1645
|
+
.iui-expandable-block.iui-borderless .iui-header,
|
|
1646
|
+
.iui-expandable-block.iui-borderless .iui-expandable-content{
|
|
1647
|
+
background-color:transparent;
|
|
1648
|
+
border:initial; }
|
|
1649
|
+
.iui-expandable-block.iui-borderless .iui-header{
|
|
1650
|
+
border-radius:3px; }
|
|
1651
|
+
.iui-expandable-block.iui-borderless .iui-header:hover{
|
|
1652
|
+
background-color:rgba(0, 0, 0, 0.1);
|
|
1653
|
+
background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-6)); }
|
|
1654
|
+
.iui-expandable-block.iui-borderless .iui-expandable-content > div{
|
|
1655
|
+
padding:0; }
|
|
1702
1656
|
|
|
1703
1657
|
.iui-fieldset{
|
|
1704
1658
|
margin:0;
|
|
@@ -2566,9 +2520,9 @@ html.iui-theme-dark{
|
|
|
2566
2520
|
.iui-input-container.iui-with-message:not(.iui-inline-icon) > .iui-input-icon{
|
|
2567
2521
|
margin-top:3px; }
|
|
2568
2522
|
.iui-input-container .iui-input,
|
|
2523
|
+
.iui-input-container .iui-input-with-icon,
|
|
2569
2524
|
.iui-input-container .iui-textarea,
|
|
2570
|
-
.iui-input-container .iui-input-group
|
|
2571
|
-
.iui-input-container .iui-select{
|
|
2525
|
+
.iui-input-container .iui-input-group{
|
|
2572
2526
|
-ms-grid-row:2;
|
|
2573
2527
|
-ms-grid-column:1;
|
|
2574
2528
|
-ms-grid-column-span:2;
|
|
@@ -2582,8 +2536,8 @@ html.iui-theme-dark{
|
|
|
2582
2536
|
cursor:not-allowed; }
|
|
2583
2537
|
.iui-input-container.iui-disabled label{
|
|
2584
2538
|
cursor:not-allowed; }
|
|
2585
|
-
.iui-input-container .iui-checkbox,
|
|
2586
|
-
.iui-input-container .iui-radio{
|
|
2539
|
+
.iui-input-container .iui-checkbox-wrapper,
|
|
2540
|
+
.iui-input-container .iui-radio-wrapper{
|
|
2587
2541
|
min-height:22px; }
|
|
2588
2542
|
.iui-input-container.iui-inline-label{
|
|
2589
2543
|
-ms-grid-rows: auto;
|
|
@@ -2592,9 +2546,9 @@ html.iui-theme-dark{
|
|
|
2592
2546
|
div.iui-input-container.iui-inline-label{
|
|
2593
2547
|
-ms-grid-columns:auto min-content auto; }
|
|
2594
2548
|
.iui-input-container.iui-inline-label .iui-input,
|
|
2549
|
+
.iui-input-container.iui-inline-label .iui-input-with-icon,
|
|
2595
2550
|
.iui-input-container.iui-inline-label .iui-textarea,
|
|
2596
|
-
.iui-input-container.iui-inline-label .iui-input-group
|
|
2597
|
-
.iui-input-container.iui-inline-label .iui-select{
|
|
2551
|
+
.iui-input-container.iui-inline-label .iui-input-group{
|
|
2598
2552
|
-ms-grid-row:1;
|
|
2599
2553
|
-ms-grid-column:2; }
|
|
2600
2554
|
.iui-input-container.iui-inline-label .iui-input-icon{
|
|
@@ -2638,7 +2592,7 @@ html.iui-theme-dark{
|
|
|
2638
2592
|
margin-left:4px;
|
|
2639
2593
|
color:#D30A0A;
|
|
2640
2594
|
color:var(--iui-color-foreground-negative); }
|
|
2641
|
-
.iui-input-container
|
|
2595
|
+
.iui-input-container .iui-input-icon{
|
|
2642
2596
|
-ms-grid-row:3;
|
|
2643
2597
|
-ms-grid-column:1;
|
|
2644
2598
|
display:flex;
|
|
@@ -2649,7 +2603,7 @@ html.iui-theme-dark{
|
|
|
2649
2603
|
align-self:center;
|
|
2650
2604
|
fill:rgba(0, 0, 0, 0.4);
|
|
2651
2605
|
fill:var(--iui-icons-color); }
|
|
2652
|
-
.iui-input-container
|
|
2606
|
+
.iui-input-container .iui-input-icon:not(:last-child){
|
|
2653
2607
|
margin-right:4px; }
|
|
2654
2608
|
.iui-input-container .iui-message{
|
|
2655
2609
|
-ms-grid-row:3;
|
|
@@ -2664,19 +2618,17 @@ html.iui-theme-dark{
|
|
|
2664
2618
|
-moz-user-select:none;
|
|
2665
2619
|
-ms-user-select:none;
|
|
2666
2620
|
user-select:none; }
|
|
2667
|
-
.iui-input-container.iui-inline-label > .iui-label{
|
|
2668
|
-
margin:0 16px 0 0;
|
|
2669
|
-
-ms-grid-column-span:1; }
|
|
2670
|
-
.iui-input-container.iui-inline-label > .iui-label.iui-required{
|
|
2671
|
-
margin-right:6px; }
|
|
2672
2621
|
.iui-input-container.iui-inline-icon > .iui-input-icon{
|
|
2673
2622
|
-ms-grid-row:1;
|
|
2674
2623
|
-ms-grid-column:3;
|
|
2675
2624
|
grid-area:inputs;
|
|
2676
2625
|
-ms-grid-column-align:end;
|
|
2677
2626
|
justify-self:end;
|
|
2678
|
-
margin:0
|
|
2627
|
+
margin:0 14px 0 0;
|
|
2679
2628
|
position:relative; }
|
|
2629
|
+
.iui-input-container.iui-inline-icon > .iui-input-icon svg{
|
|
2630
|
+
width:16px;
|
|
2631
|
+
height:16px; }
|
|
2680
2632
|
.iui-input-container.iui-inline-icon > .iui-input-icon.iui-button{
|
|
2681
2633
|
height:100%;
|
|
2682
2634
|
width:-webkit-fit-content;
|
|
@@ -2684,11 +2636,13 @@ html.iui-theme-dark{
|
|
|
2684
2636
|
width:fit-content;
|
|
2685
2637
|
margin-right:0;
|
|
2686
2638
|
border-top-left-radius:0;
|
|
2687
|
-
border-bottom-left-radius:0;
|
|
2639
|
+
border-bottom-left-radius:0;
|
|
2640
|
+
border-top-right-radius:inherit;
|
|
2641
|
+
border-bottom-right-radius:inherit; }
|
|
2688
2642
|
.iui-input-container.iui-inline-icon > .iui-input-icon.iui-actionable{
|
|
2689
2643
|
align-items:center;
|
|
2690
2644
|
height:90%;
|
|
2691
|
-
margin-right:
|
|
2645
|
+
margin-right:2px;
|
|
2692
2646
|
padding:0 12px;
|
|
2693
2647
|
cursor:pointer;
|
|
2694
2648
|
background-position:center;
|
|
@@ -2700,13 +2654,21 @@ html.iui-theme-dark{
|
|
|
2700
2654
|
background-size:100%;
|
|
2701
2655
|
transition:background 0s; }
|
|
2702
2656
|
.iui-input-container.iui-inline-icon > .iui-input-icon.iui-actionable svg{
|
|
2703
|
-
width:16px;
|
|
2704
|
-
height:16px;
|
|
2705
2657
|
fill:rgba(0, 0, 0, 0.4);
|
|
2706
2658
|
fill:var(--iui-icons-color);
|
|
2707
2659
|
transition:transform 0.2s ease-out; }
|
|
2708
2660
|
.iui-input-container.iui-inline-icon > .iui-input-icon.iui-actionable.iui-open svg{
|
|
2709
2661
|
transform:rotate(180deg); }
|
|
2662
|
+
.iui-input-container.iui-inline-icon > .iui-input-icon.iui-disabled{
|
|
2663
|
+
cursor:not-allowed; }
|
|
2664
|
+
.iui-input-container.iui-inline-icon > .iui-input-icon.iui-disabled svg{
|
|
2665
|
+
fill:rgba(0, 0, 0, 0.2);
|
|
2666
|
+
fill:var(--iui-icons-color-actionable-disabled); }
|
|
2667
|
+
.iui-input-container.iui-inline-label > .iui-label{
|
|
2668
|
+
margin:0 16px 0 0;
|
|
2669
|
+
-ms-grid-column-span:1; }
|
|
2670
|
+
.iui-input-container.iui-inline-label > .iui-label.iui-required{
|
|
2671
|
+
margin-right:6px; }
|
|
2710
2672
|
.iui-input-container.iui-positive *::-moz-selection{
|
|
2711
2673
|
background-color:rgba(83, 162, 26, 0.4);
|
|
2712
2674
|
background-color:rgba(var(--iui-color-foreground-positive-rgb), var(--iui-opacity-4)); }
|
|
@@ -2727,29 +2689,39 @@ html.iui-theme-dark{
|
|
|
2727
2689
|
text-decoration:none;
|
|
2728
2690
|
color:#3c7613;
|
|
2729
2691
|
color:var(--iui-color-foreground-positive-overlay); }
|
|
2730
|
-
.iui-input-container.iui-positive
|
|
2731
|
-
.iui-input-container.iui-positive
|
|
2732
|
-
.iui-input-container.iui-positive > .iui-select > .iui-select-button{
|
|
2692
|
+
.iui-input-container.iui-positive .iui-input,
|
|
2693
|
+
.iui-input-container.iui-positive .iui-textarea{
|
|
2733
2694
|
padding-bottom:6px;
|
|
2734
2695
|
border-bottom:2px solid #53A21A;
|
|
2735
2696
|
border-bottom:2px solid var(--iui-color-foreground-positive); }
|
|
2736
|
-
.iui-input-container.iui-positive
|
|
2737
|
-
.iui-input-container.iui-positive
|
|
2738
|
-
.iui-input-container.iui-positive > .iui-select > .iui-select-button.iui-small{
|
|
2697
|
+
.iui-input-container.iui-positive .iui-input.iui-small,
|
|
2698
|
+
.iui-input-container.iui-positive .iui-textarea.iui-small{
|
|
2739
2699
|
padding-bottom:0.5px; }
|
|
2740
|
-
.iui-input-container.iui-positive
|
|
2741
|
-
.iui-input-container.iui-positive
|
|
2742
|
-
.iui-input-container.iui-positive > .iui-select > .iui-select-button.iui-large{
|
|
2700
|
+
.iui-input-container.iui-positive .iui-input.iui-large,
|
|
2701
|
+
.iui-input-container.iui-positive .iui-textarea.iui-large{
|
|
2743
2702
|
padding-bottom:11.5px; }
|
|
2744
|
-
.iui-input-container.iui-positive
|
|
2745
|
-
.iui-input-container.iui-positive
|
|
2746
|
-
.iui-input-container.iui-positive > .iui-select > .iui-select-button:focus{
|
|
2703
|
+
.iui-input-container.iui-positive .iui-input:focus,
|
|
2704
|
+
.iui-input-container.iui-positive .iui-textarea:focus{
|
|
2747
2705
|
border-bottom:2px solid #53A21A;
|
|
2748
2706
|
outline:2px solid #53A21A;
|
|
2749
2707
|
outline-offset:-2px;
|
|
2750
2708
|
border-bottom:2px solid var(--iui-color-foreground-positive);
|
|
2751
2709
|
outline:2px solid var(--iui-color-foreground-positive);
|
|
2752
2710
|
outline-offset:-2px; }
|
|
2711
|
+
.iui-input-container.iui-positive .iui-input-with-icon{
|
|
2712
|
+
--_hover-color:var(--iui-color-foreground-positive);
|
|
2713
|
+
--_focus-color:var(--iui-color-foreground-positive); }
|
|
2714
|
+
.iui-input-container.iui-positive .iui-select-button{
|
|
2715
|
+
border-bottom:transparent; }
|
|
2716
|
+
.iui-input-container.iui-positive .iui-select-button::after{
|
|
2717
|
+
content:'';
|
|
2718
|
+
width:100%;
|
|
2719
|
+
position:absolute;
|
|
2720
|
+
bottom:0;
|
|
2721
|
+
left:0;
|
|
2722
|
+
height:2px;
|
|
2723
|
+
background-color:#53A21A;
|
|
2724
|
+
background-color:var(--iui-color-foreground-positive); }
|
|
2753
2725
|
.iui-input-container.iui-negative *::-moz-selection{
|
|
2754
2726
|
background-color:rgba(211, 10, 10, 0.4);
|
|
2755
2727
|
background-color:rgba(var(--iui-color-foreground-negative-rgb), var(--iui-opacity-4)); }
|
|
@@ -2770,29 +2742,39 @@ html.iui-theme-dark{
|
|
|
2770
2742
|
text-decoration:none;
|
|
2771
2743
|
color:#a20808;
|
|
2772
2744
|
color:var(--iui-color-foreground-negative-overlay); }
|
|
2773
|
-
.iui-input-container.iui-negative
|
|
2774
|
-
.iui-input-container.iui-negative
|
|
2775
|
-
.iui-input-container.iui-negative > .iui-select > .iui-select-button{
|
|
2745
|
+
.iui-input-container.iui-negative .iui-input,
|
|
2746
|
+
.iui-input-container.iui-negative .iui-textarea{
|
|
2776
2747
|
padding-bottom:6px;
|
|
2777
2748
|
border-bottom:2px solid #D30A0A;
|
|
2778
2749
|
border-bottom:2px solid var(--iui-color-foreground-negative); }
|
|
2779
|
-
.iui-input-container.iui-negative
|
|
2780
|
-
.iui-input-container.iui-negative
|
|
2781
|
-
.iui-input-container.iui-negative > .iui-select > .iui-select-button.iui-small{
|
|
2750
|
+
.iui-input-container.iui-negative .iui-input.iui-small,
|
|
2751
|
+
.iui-input-container.iui-negative .iui-textarea.iui-small{
|
|
2782
2752
|
padding-bottom:0.5px; }
|
|
2783
|
-
.iui-input-container.iui-negative
|
|
2784
|
-
.iui-input-container.iui-negative
|
|
2785
|
-
.iui-input-container.iui-negative > .iui-select > .iui-select-button.iui-large{
|
|
2753
|
+
.iui-input-container.iui-negative .iui-input.iui-large,
|
|
2754
|
+
.iui-input-container.iui-negative .iui-textarea.iui-large{
|
|
2786
2755
|
padding-bottom:11.5px; }
|
|
2787
|
-
.iui-input-container.iui-negative
|
|
2788
|
-
.iui-input-container.iui-negative
|
|
2789
|
-
.iui-input-container.iui-negative > .iui-select > .iui-select-button:focus{
|
|
2756
|
+
.iui-input-container.iui-negative .iui-input:focus,
|
|
2757
|
+
.iui-input-container.iui-negative .iui-textarea:focus{
|
|
2790
2758
|
border-bottom:2px solid #D30A0A;
|
|
2791
2759
|
outline:2px solid #D30A0A;
|
|
2792
2760
|
outline-offset:-2px;
|
|
2793
2761
|
border-bottom:2px solid var(--iui-color-foreground-negative);
|
|
2794
2762
|
outline:2px solid var(--iui-color-foreground-negative);
|
|
2795
2763
|
outline-offset:-2px; }
|
|
2764
|
+
.iui-input-container.iui-negative .iui-input-with-icon{
|
|
2765
|
+
--_hover-color:var(--iui-color-foreground-negative);
|
|
2766
|
+
--_focus-color:var(--iui-color-foreground-negative); }
|
|
2767
|
+
.iui-input-container.iui-negative .iui-select-button{
|
|
2768
|
+
border-bottom:transparent; }
|
|
2769
|
+
.iui-input-container.iui-negative .iui-select-button::after{
|
|
2770
|
+
content:'';
|
|
2771
|
+
width:100%;
|
|
2772
|
+
position:absolute;
|
|
2773
|
+
bottom:0;
|
|
2774
|
+
left:0;
|
|
2775
|
+
height:2px;
|
|
2776
|
+
background-color:#D30A0A;
|
|
2777
|
+
background-color:var(--iui-color-foreground-negative); }
|
|
2796
2778
|
.iui-input-container.iui-warning *::-moz-selection{
|
|
2797
2779
|
background-color:rgba(241, 139, 18, 0.4);
|
|
2798
2780
|
background-color:rgba(var(--iui-color-foreground-warning-rgb), var(--iui-opacity-4)); }
|
|
@@ -2813,29 +2795,39 @@ html.iui-theme-dark{
|
|
|
2813
2795
|
text-decoration:none;
|
|
2814
2796
|
color:#c4700c;
|
|
2815
2797
|
color:var(--iui-color-foreground-warning-overlay); }
|
|
2816
|
-
.iui-input-container.iui-warning
|
|
2817
|
-
.iui-input-container.iui-warning
|
|
2818
|
-
.iui-input-container.iui-warning > .iui-select > .iui-select-button{
|
|
2798
|
+
.iui-input-container.iui-warning .iui-input,
|
|
2799
|
+
.iui-input-container.iui-warning .iui-textarea{
|
|
2819
2800
|
padding-bottom:6px;
|
|
2820
2801
|
border-bottom:2px solid #F18B12;
|
|
2821
2802
|
border-bottom:2px solid var(--iui-color-foreground-warning); }
|
|
2822
|
-
.iui-input-container.iui-warning
|
|
2823
|
-
.iui-input-container.iui-warning
|
|
2824
|
-
.iui-input-container.iui-warning > .iui-select > .iui-select-button.iui-small{
|
|
2803
|
+
.iui-input-container.iui-warning .iui-input.iui-small,
|
|
2804
|
+
.iui-input-container.iui-warning .iui-textarea.iui-small{
|
|
2825
2805
|
padding-bottom:0.5px; }
|
|
2826
|
-
.iui-input-container.iui-warning
|
|
2827
|
-
.iui-input-container.iui-warning
|
|
2828
|
-
.iui-input-container.iui-warning > .iui-select > .iui-select-button.iui-large{
|
|
2806
|
+
.iui-input-container.iui-warning .iui-input.iui-large,
|
|
2807
|
+
.iui-input-container.iui-warning .iui-textarea.iui-large{
|
|
2829
2808
|
padding-bottom:11.5px; }
|
|
2830
|
-
.iui-input-container.iui-warning
|
|
2831
|
-
.iui-input-container.iui-warning
|
|
2832
|
-
.iui-input-container.iui-warning > .iui-select > .iui-select-button:focus{
|
|
2809
|
+
.iui-input-container.iui-warning .iui-input:focus,
|
|
2810
|
+
.iui-input-container.iui-warning .iui-textarea:focus{
|
|
2833
2811
|
border-bottom:2px solid #F18B12;
|
|
2834
2812
|
outline:2px solid #F18B12;
|
|
2835
2813
|
outline-offset:-2px;
|
|
2836
2814
|
border-bottom:2px solid var(--iui-color-foreground-warning);
|
|
2837
2815
|
outline:2px solid var(--iui-color-foreground-warning);
|
|
2838
2816
|
outline-offset:-2px; }
|
|
2817
|
+
.iui-input-container.iui-warning .iui-input-with-icon{
|
|
2818
|
+
--_hover-color:var(--iui-color-foreground-warning);
|
|
2819
|
+
--_focus-color:var(--iui-color-foreground-warning); }
|
|
2820
|
+
.iui-input-container.iui-warning .iui-select-button{
|
|
2821
|
+
border-bottom:transparent; }
|
|
2822
|
+
.iui-input-container.iui-warning .iui-select-button::after{
|
|
2823
|
+
content:'';
|
|
2824
|
+
width:100%;
|
|
2825
|
+
position:absolute;
|
|
2826
|
+
bottom:0;
|
|
2827
|
+
left:0;
|
|
2828
|
+
height:2px;
|
|
2829
|
+
background-color:#F18B12;
|
|
2830
|
+
background-color:var(--iui-color-foreground-warning); }
|
|
2839
2831
|
|
|
2840
2832
|
.iui-input-label{
|
|
2841
2833
|
font-weight:600;
|
|
@@ -2943,7 +2935,70 @@ html.iui-theme-dark{
|
|
|
2943
2935
|
border-color:#EEF0F3;
|
|
2944
2936
|
background-color:var(--iui-color-background-disabled);
|
|
2945
2937
|
border-color:var(--iui-color-background-disabled);
|
|
2938
|
+
cursor:not-allowed;
|
|
2939
|
+
--_hover-color:var(--iui-color-background-disabled); }
|
|
2940
|
+
|
|
2941
|
+
.iui-select-button{
|
|
2942
|
+
width:100%;
|
|
2943
|
+
margin:0;
|
|
2944
|
+
border-radius:3px;
|
|
2945
|
+
box-sizing:border-box;
|
|
2946
|
+
padding:7px 12px;
|
|
2947
|
+
min-height:38px;
|
|
2948
|
+
transition:border-color 0.2s ease-out;
|
|
2949
|
+
display:flex;
|
|
2950
|
+
align-items:center;
|
|
2951
|
+
-webkit-user-select:none;
|
|
2952
|
+
-moz-user-select:none;
|
|
2953
|
+
-ms-user-select:none;
|
|
2954
|
+
user-select:none;
|
|
2955
|
+
position:relative;
|
|
2956
|
+
overflow:hidden;
|
|
2957
|
+
color:rgba(0, 0, 0, 0.8);
|
|
2958
|
+
background-color:#FFF;
|
|
2959
|
+
border:1px solid rgba(0, 0, 0, 0.4);
|
|
2960
|
+
color:var(--iui-text-color);
|
|
2961
|
+
background-color:var(--iui-color-background-1);
|
|
2962
|
+
border:1px solid rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4)); }
|
|
2963
|
+
.iui-select-button:focus-visible{
|
|
2964
|
+
outline:2px solid var(--iui-color-foreground-primary);
|
|
2965
|
+
outline-offset:-2px; }
|
|
2966
|
+
@supports not selector(*:focus-visible){
|
|
2967
|
+
.iui-select-button:focus{
|
|
2968
|
+
outline:2px solid var(--iui-color-foreground-primary);
|
|
2969
|
+
outline-offset:-2px; } }
|
|
2970
|
+
.iui-select-button.iui-small{
|
|
2971
|
+
padding-top:1.5px;
|
|
2972
|
+
padding-bottom:1.5px;
|
|
2973
|
+
min-height:27px; }
|
|
2974
|
+
.iui-select-button.iui-large{
|
|
2975
|
+
padding-top:12.5px;
|
|
2976
|
+
padding-bottom:12.5px;
|
|
2977
|
+
min-height:49px;
|
|
2978
|
+
font-size:16px; }
|
|
2979
|
+
.iui-select-button.iui-disabled{
|
|
2980
|
+
background-color:#EEF0F3;
|
|
2981
|
+
border-color:#EEF0F3;
|
|
2982
|
+
background-color:var(--iui-color-background-disabled);
|
|
2983
|
+
border-color:var(--iui-color-background-disabled);
|
|
2984
|
+
--_hover-color:var(--iui-color-background-disabled);
|
|
2946
2985
|
cursor:not-allowed; }
|
|
2986
|
+
.iui-select-button .iui-icon{
|
|
2987
|
+
width:16px;
|
|
2988
|
+
height:16px;
|
|
2989
|
+
flex:0 0 auto;
|
|
2990
|
+
fill:rgba(0, 0, 0, 0.8);
|
|
2991
|
+
fill:var(--iui-icons-color-actionable);
|
|
2992
|
+
fill:currentColor; }
|
|
2993
|
+
.iui-select-button .iui-icon + .iui-content{
|
|
2994
|
+
margin-left:8px; }
|
|
2995
|
+
.iui-select-button .iui-content{
|
|
2996
|
+
overflow:hidden;
|
|
2997
|
+
white-space:nowrap;
|
|
2998
|
+
text-overflow:ellipsis; }
|
|
2999
|
+
.iui-select-button.iui-placeholder{
|
|
3000
|
+
color:rgba(0, 0, 0, 0.2);
|
|
3001
|
+
color:var(--iui-text-color-placeholder); }
|
|
2947
3002
|
|
|
2948
3003
|
.iui-textarea{
|
|
2949
3004
|
margin:0;
|
|
@@ -3031,487 +3086,381 @@ html.iui-theme-dark{
|
|
|
3031
3086
|
border-color:#EEF0F3;
|
|
3032
3087
|
background-color:var(--iui-color-background-disabled);
|
|
3033
3088
|
border-color:var(--iui-color-background-disabled);
|
|
3034
|
-
cursor:not-allowed;
|
|
3089
|
+
cursor:not-allowed;
|
|
3090
|
+
--_hover-color:var(--iui-color-background-disabled); }
|
|
3035
3091
|
.iui-textarea[disabled], .iui-textarea[readonly]{
|
|
3036
3092
|
resize:none; }
|
|
3037
3093
|
|
|
3038
|
-
.iui-
|
|
3039
|
-
|
|
3040
|
-
|
|
3041
|
-
|
|
3042
|
-
|
|
3094
|
+
.iui-input-with-icon{
|
|
3095
|
+
display:-ms-grid;
|
|
3096
|
+
display:grid;
|
|
3097
|
+
align-items:center;
|
|
3098
|
+
cursor:pointer; }
|
|
3099
|
+
.iui-input-with-icon > :first-child{
|
|
3100
|
+
-ms-grid-row:1;
|
|
3101
|
+
grid-area:1 / -1;
|
|
3102
|
+
padding-right:40px; }
|
|
3103
|
+
.iui-input-with-icon:focus-within > :first-child{
|
|
3104
|
+
outline:2px solid var(--_focus-color, var(--iui-color-foreground-primary));
|
|
3105
|
+
outline-offset:-2px; }
|
|
3106
|
+
.iui-input-with-icon:hover > :first-child{
|
|
3107
|
+
border-color:var(--_hover-color, rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2))); }
|
|
3108
|
+
|
|
3109
|
+
.iui-end-icon{
|
|
3110
|
+
-ms-grid-row:1;
|
|
3111
|
+
-ms-grid-column:3;
|
|
3112
|
+
grid-area:inputs;
|
|
3113
|
+
-ms-grid-column-align:end;
|
|
3114
|
+
justify-self:end;
|
|
3115
|
+
margin:0 14px 0 0;
|
|
3116
|
+
position:relative;
|
|
3043
3117
|
display:flex;
|
|
3044
|
-
|
|
3118
|
+
grid-area:1 / -1; }
|
|
3119
|
+
.iui-end-icon svg{
|
|
3120
|
+
width:16px;
|
|
3121
|
+
height:16px; }
|
|
3122
|
+
.iui-end-icon.iui-button{
|
|
3123
|
+
height:100%;
|
|
3124
|
+
width:-webkit-fit-content;
|
|
3125
|
+
width:-moz-fit-content;
|
|
3126
|
+
width:fit-content;
|
|
3127
|
+
margin-right:0;
|
|
3128
|
+
border-top-left-radius:0;
|
|
3129
|
+
border-bottom-left-radius:0;
|
|
3130
|
+
border-top-right-radius:inherit;
|
|
3131
|
+
border-bottom-right-radius:inherit; }
|
|
3132
|
+
.iui-end-icon.iui-actionable{
|
|
3133
|
+
align-items:center;
|
|
3134
|
+
height:90%;
|
|
3135
|
+
margin-right:2px;
|
|
3136
|
+
padding:0 12px;
|
|
3137
|
+
cursor:pointer;
|
|
3138
|
+
background-position:center;
|
|
3139
|
+
transition:background 0.4s ease-out; }
|
|
3140
|
+
.iui-end-icon.iui-actionable:hover{
|
|
3141
|
+
background:var(--iui-color-background-1) radial-gradient(circle, transparent 1%, var(--iui-color-background-1) 1%) center/15000%; }
|
|
3142
|
+
.iui-end-icon.iui-actionable:active{
|
|
3143
|
+
background-color:var(--iui-color-background-2);
|
|
3144
|
+
background-size:100%;
|
|
3145
|
+
transition:background 0s; }
|
|
3146
|
+
.iui-end-icon.iui-actionable svg{
|
|
3147
|
+
fill:rgba(0, 0, 0, 0.4);
|
|
3148
|
+
fill:var(--iui-icons-color);
|
|
3149
|
+
transition:transform 0.2s ease-out; }
|
|
3150
|
+
.iui-end-icon.iui-actionable.iui-open svg{
|
|
3151
|
+
transform:rotate(180deg); }
|
|
3152
|
+
.iui-end-icon.iui-disabled{
|
|
3153
|
+
cursor:not-allowed; }
|
|
3154
|
+
.iui-end-icon.iui-disabled svg{
|
|
3155
|
+
fill:rgba(0, 0, 0, 0.2);
|
|
3156
|
+
fill:var(--iui-icons-color-actionable-disabled); }
|
|
3157
|
+
|
|
3158
|
+
.iui-checkbox{
|
|
3159
|
+
--_iui-checkbox-checkmark-svg:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m6.5 12.5-4.5-4.5 1.5-1.5 3 3 6-6 1.5 1.5z" /></svg>');
|
|
3160
|
+
--_iui-checkbox-indeterminate-svg:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m2.75 6.875h10.5v2.25h-10.5z" /></svg>');
|
|
3161
|
+
--_iui-checkbox-unchecked-svg:url('data:image/svg+xml;utf8,<svg viewBox="0 0 16 16"></svg>');
|
|
3162
|
+
--_iui-checkbox-svg-color:var(--iui-color-foreground-primary);
|
|
3163
|
+
--_iui-checkbox-border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
|
|
3164
|
+
--_iui-checkbox-background-color:var(--iui-color-background-1);
|
|
3165
|
+
--_iui-checkbox-mask-image:initial;
|
|
3166
|
+
-webkit-appearance:none;
|
|
3167
|
+
-moz-appearance:none;
|
|
3168
|
+
appearance:none;
|
|
3169
|
+
margin:0;
|
|
3170
|
+
width:16px;
|
|
3171
|
+
height:16px;
|
|
3045
3172
|
position:relative;
|
|
3046
|
-
|
|
3047
|
-
|
|
3048
|
-
|
|
3173
|
+
border-radius:3px;
|
|
3174
|
+
background-color:var(--_iui-checkbox-background-color);
|
|
3175
|
+
cursor:pointer; }
|
|
3176
|
+
.iui-checkbox-wrapper{
|
|
3049
3177
|
margin:0;
|
|
3050
3178
|
padding:0;
|
|
3051
3179
|
border:none;
|
|
3052
3180
|
vertical-align:baseline;
|
|
3053
|
-
width:100%;
|
|
3054
|
-
font-family:inherit;
|
|
3055
|
-
font-size:14px;
|
|
3056
|
-
font-weight:400;
|
|
3057
|
-
line-height:22px;
|
|
3058
|
-
border-radius:3px;
|
|
3059
|
-
-webkit-appearance:none;
|
|
3060
|
-
-moz-appearance:none;
|
|
3061
|
-
appearance:none;
|
|
3062
|
-
box-sizing:border-box;
|
|
3063
|
-
padding:7px 12px;
|
|
3064
|
-
min-height:38px;
|
|
3065
|
-
color:rgba(0, 0, 0, 0.8);
|
|
3066
|
-
background-color:#FFF;
|
|
3067
|
-
border:1px solid rgba(0, 0, 0, 0.4);
|
|
3068
|
-
color:var(--iui-text-color);
|
|
3069
|
-
background-color:var(--iui-color-background-1);
|
|
3070
|
-
border:1px solid rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
|
|
3071
3181
|
display:flex;
|
|
3072
3182
|
align-items:center;
|
|
3073
|
-
|
|
3074
|
-
|
|
3183
|
+
font-size:14px;
|
|
3184
|
+
width:-webkit-fit-content;
|
|
3185
|
+
width:-moz-fit-content;
|
|
3186
|
+
width:fit-content;
|
|
3075
3187
|
-webkit-user-select:none;
|
|
3076
3188
|
-moz-user-select:none;
|
|
3077
3189
|
-ms-user-select:none;
|
|
3078
3190
|
user-select:none;
|
|
3079
|
-
position:relative; }
|
|
3080
|
-
.iui-select > .iui-select-button:focus-visible{
|
|
3081
|
-
outline:2px solid var(--iui-color-foreground-primary);
|
|
3082
|
-
outline-offset:-2px; }
|
|
3083
|
-
@supports not selector(*:focus-visible){
|
|
3084
|
-
.iui-select > .iui-select-button:focus{
|
|
3085
|
-
outline:2px solid var(--iui-color-foreground-primary);
|
|
3086
|
-
outline-offset:-2px; } }
|
|
3087
|
-
@media (prefers-reduced-motion: no-preference){
|
|
3088
|
-
.iui-select > .iui-select-button{
|
|
3089
|
-
transition:border-color 0.2s ease-out; } }
|
|
3090
|
-
.iui-select > .iui-select-button.iui-small{
|
|
3091
|
-
padding-top:1.5px;
|
|
3092
|
-
padding-bottom:1.5px;
|
|
3093
|
-
min-height:27px; }
|
|
3094
|
-
.iui-select > .iui-select-button.iui-large{
|
|
3095
|
-
padding-top:12.5px;
|
|
3096
|
-
padding-bottom:12.5px;
|
|
3097
|
-
min-height:49px;
|
|
3098
|
-
font-size:16px; }
|
|
3099
|
-
.iui-select > .iui-select-button::-moz-placeholder{
|
|
3100
|
-
-moz-user-select:none;
|
|
3101
|
-
user-select:none;
|
|
3102
|
-
color:rgba(0, 0, 0, 0.2);
|
|
3103
|
-
color:var(--iui-text-color-placeholder); }
|
|
3104
|
-
.iui-select > .iui-select-button:-ms-input-placeholder{
|
|
3105
|
-
-ms-user-select:none;
|
|
3106
|
-
user-select:none;
|
|
3107
|
-
color:rgba(0, 0, 0, 0.2);
|
|
3108
|
-
color:var(--iui-text-color-placeholder); }
|
|
3109
|
-
.iui-select > .iui-select-button::placeholder{
|
|
3110
|
-
-webkit-user-select:none;
|
|
3111
|
-
-moz-user-select:none;
|
|
3112
|
-
-ms-user-select:none;
|
|
3113
|
-
user-select:none;
|
|
3114
|
-
color:rgba(0, 0, 0, 0.2);
|
|
3115
|
-
color:var(--iui-text-color-placeholder); }
|
|
3116
|
-
.iui-select > .iui-select-button:-webkit-autofill{
|
|
3117
|
-
border-color:#008be1;
|
|
3118
|
-
color:#008be1;
|
|
3119
|
-
background:linear-gradient(rgba(0, 139, 225, 0.1), rgba(0, 139, 225, 0.1)), linear-gradient(#FFF, #FFF);
|
|
3120
|
-
border-color:rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-1));
|
|
3121
|
-
color:rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-1));
|
|
3122
|
-
background:linear-gradient(rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-6)), rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-6))), linear-gradient(var(--iui-color-background-1), var(--iui-color-background-1)); }
|
|
3123
|
-
.iui-select > .iui-select-button:autofill{
|
|
3124
|
-
border-color:#008be1;
|
|
3125
|
-
color:#008be1;
|
|
3126
|
-
background:linear-gradient(rgba(0, 139, 225, 0.1), rgba(0, 139, 225, 0.1)), linear-gradient(#FFF, #FFF);
|
|
3127
|
-
border-color:rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-1));
|
|
3128
|
-
color:rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-1));
|
|
3129
|
-
background:linear-gradient(rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-6)), rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-6))), linear-gradient(var(--iui-color-background-1), var(--iui-color-background-1)); }
|
|
3130
|
-
.iui-select > .iui-select-button:hover{
|
|
3131
|
-
border-color:rgba(0, 0, 0, 0.8);
|
|
3132
|
-
border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2)); }
|
|
3133
|
-
@media (prefers-reduced-motion: no-preference){
|
|
3134
|
-
.iui-select > .iui-select-button:hover{
|
|
3135
|
-
transition:border-color 0.2s ease-out; } }
|
|
3136
|
-
.iui-select > .iui-select-button[disabled]{
|
|
3137
|
-
background-color:#EEF0F3;
|
|
3138
|
-
border-color:#EEF0F3;
|
|
3139
|
-
background-color:var(--iui-color-background-disabled);
|
|
3140
|
-
border-color:var(--iui-color-background-disabled);
|
|
3141
|
-
cursor:not-allowed; }
|
|
3142
|
-
.iui-select > .iui-select-button:focus-visible{
|
|
3143
|
-
outline:2px solid var(--iui-color-foreground-primary);
|
|
3144
|
-
outline-offset:-2px; }
|
|
3145
|
-
@supports not selector(*:focus-visible){
|
|
3146
|
-
.iui-select > .iui-select-button:focus{
|
|
3147
|
-
outline:2px solid var(--iui-color-foreground-primary);
|
|
3148
|
-
outline-offset:-2px; } }
|
|
3149
|
-
@media (prefers-reduced-motion: no-preference){
|
|
3150
|
-
.iui-select > .iui-select-button{
|
|
3151
|
-
transition:border-color 0.2s ease-out; } }
|
|
3152
|
-
.iui-select > .iui-select-button > .iui-icon{
|
|
3153
|
-
width:16px;
|
|
3154
|
-
height:16px;
|
|
3155
|
-
flex:0 0 auto;
|
|
3156
|
-
fill:rgba(0, 0, 0, 0.8);
|
|
3157
|
-
fill:var(--iui-icons-color-actionable); }
|
|
3158
|
-
.iui-select > .iui-select-button > .iui-icon + .iui-content{
|
|
3159
|
-
margin-left:8px; }
|
|
3160
|
-
.iui-select > .iui-select-button > .iui-content{
|
|
3161
|
-
overflow:hidden;
|
|
3162
|
-
white-space:nowrap;
|
|
3163
|
-
text-overflow:ellipsis; }
|
|
3164
|
-
.iui-select > .iui-select-button.iui-placeholder{
|
|
3165
|
-
color:rgba(0, 0, 0, 0.2);
|
|
3166
|
-
color:var(--iui-text-color-placeholder); }
|
|
3167
|
-
.iui-select > .iui-select-button::after{
|
|
3168
|
-
content:'';
|
|
3169
|
-
position:absolute;
|
|
3170
|
-
top:50%;
|
|
3171
|
-
right:16px;
|
|
3172
|
-
transform:translateY(-50%);
|
|
3173
|
-
width:0;
|
|
3174
|
-
height:0;
|
|
3175
|
-
border-left:5px solid transparent;
|
|
3176
|
-
border-right:5px solid transparent;
|
|
3177
|
-
border-top:5px solid rgba(0, 0, 0, 0.8);
|
|
3178
|
-
border-top:5px solid var(--iui-icons-color-actionable); }
|
|
3179
|
-
.iui-select > .iui-select-button:hover{
|
|
3180
|
-
border-color:rgba(0, 0, 0, 0.8);
|
|
3181
|
-
border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2)); }
|
|
3182
|
-
.iui-select > .iui-select-button:hover::after{
|
|
3183
|
-
border-bottom:none;
|
|
3184
|
-
border-top:5px solid black;
|
|
3185
|
-
border-top:5px solid var(--iui-icons-color-actionable-hover); }
|
|
3186
|
-
.iui-select > .iui-select-button.iui-active::after{
|
|
3187
|
-
border-top:none;
|
|
3188
|
-
border-bottom:5px solid rgba(0, 0, 0, 0.8);
|
|
3189
|
-
border-bottom:5px solid var(--iui-icons-color-actionable); }
|
|
3190
|
-
.iui-select > .iui-select-button.iui-active:hover::after{
|
|
3191
|
-
border-bottom:5px solid black;
|
|
3192
|
-
border-bottom:5px solid var(--iui-icons-color-actionable-hover); }
|
|
3193
|
-
.iui-select > .iui-select-button.iui-disabled{
|
|
3194
|
-
cursor:not-allowed;
|
|
3195
|
-
background-color:#EEF0F3;
|
|
3196
|
-
border-color:#EEF0F3;
|
|
3197
|
-
background-color:var(--iui-color-background-disabled);
|
|
3198
|
-
border-color:var(--iui-color-background-disabled); }
|
|
3199
|
-
.iui-select > .iui-select-button.iui-disabled::after{
|
|
3200
|
-
border-top:5px solid rgba(0, 0, 0, 0.2);
|
|
3201
|
-
border-top:5px solid var(--iui-icons-color-actionable-disabled); }
|
|
3202
|
-
.iui-select.iui-small .iui-select-button{
|
|
3203
|
-
padding-top:1.5px;
|
|
3204
|
-
padding-bottom:1.5px;
|
|
3205
|
-
min-height:27px; }
|
|
3206
|
-
.iui-select.iui-large .iui-select-button{
|
|
3207
|
-
padding-top:12.5px;
|
|
3208
|
-
padding-bottom:12.5px;
|
|
3209
|
-
min-height:49px;
|
|
3210
|
-
font-size:16px; }
|
|
3211
|
-
|
|
3212
|
-
.iui-checkbox{
|
|
3213
|
-
margin:0;
|
|
3214
|
-
padding:0;
|
|
3215
|
-
border:none;
|
|
3216
|
-
vertical-align:baseline;
|
|
3217
|
-
display:flex;
|
|
3218
|
-
align-items:center;
|
|
3219
|
-
font-size:14px;
|
|
3220
|
-
width:-webkit-fit-content;
|
|
3221
|
-
width:-moz-fit-content;
|
|
3222
|
-
width:fit-content;
|
|
3223
|
-
-webkit-user-select:none;
|
|
3224
|
-
-moz-user-select:none;
|
|
3225
|
-
-ms-user-select:none;
|
|
3226
|
-
user-select:none;
|
|
3227
|
-
position:relative;
|
|
3228
|
-
cursor:pointer;
|
|
3229
|
-
color:rgba(0, 0, 0, 0.8);
|
|
3230
|
-
color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2)); }
|
|
3231
|
-
.iui-checkbox > input{
|
|
3232
|
-
width:0;
|
|
3233
|
-
height:0;
|
|
3234
|
-
-webkit-appearance:none;
|
|
3235
|
-
-moz-appearance:none;
|
|
3236
|
-
appearance:none;
|
|
3237
|
-
opacity:0;
|
|
3238
|
-
position:absolute; }
|
|
3239
|
-
.iui-checkbox.iui-disabled{
|
|
3240
|
-
cursor:not-allowed; }
|
|
3241
|
-
.iui-checkbox .iui-checkbox-checkmark,
|
|
3242
|
-
.iui-checkbox .iui-radio-dot{
|
|
3243
|
-
width:16px;
|
|
3244
|
-
height:16px;
|
|
3245
|
-
margin:0;
|
|
3246
|
-
display:flex;
|
|
3247
|
-
flex-shrink:0;
|
|
3248
|
-
justify-content:center;
|
|
3249
|
-
align-items:center;
|
|
3250
3191
|
position:relative;
|
|
3251
|
-
|
|
3252
|
-
|
|
3253
|
-
|
|
3254
|
-
|
|
3255
|
-
|
|
3256
|
-
|
|
3257
|
-
|
|
3258
|
-
|
|
3259
|
-
|
|
3260
|
-
|
|
3261
|
-
|
|
3262
|
-
|
|
3263
|
-
|
|
3264
|
-
|
|
3265
|
-
|
|
3266
|
-
|
|
3267
|
-
|
|
3268
|
-
|
|
3269
|
-
|
|
3270
|
-
|
|
3271
|
-
|
|
3272
|
-
|
|
3273
|
-
|
|
3274
|
-
|
|
3275
|
-
|
|
3276
|
-
|
|
3277
|
-
|
|
3278
|
-
|
|
3279
|
-
|
|
3280
|
-
|
|
3281
|
-
|
|
3282
|
-
|
|
3283
|
-
|
|
3284
|
-
.iui-checkbox
|
|
3285
|
-
|
|
3286
|
-
|
|
3287
|
-
|
|
3288
|
-
|
|
3289
|
-
|
|
3290
|
-
|
|
3291
|
-
|
|
3292
|
-
|
|
3293
|
-
|
|
3294
|
-
|
|
3295
|
-
|
|
3296
|
-
|
|
3297
|
-
|
|
3298
|
-
|
|
3299
|
-
|
|
3300
|
-
|
|
3301
|
-
|
|
3302
|
-
|
|
3303
|
-
.iui-checkbox
|
|
3304
|
-
|
|
3305
|
-
.iui-checkbox
|
|
3306
|
-
opacity
|
|
3307
|
-
|
|
3308
|
-
|
|
3309
|
-
|
|
3310
|
-
|
|
3311
|
-
|
|
3312
|
-
|
|
3313
|
-
.iui-checkbox
|
|
3314
|
-
outline:2px solid
|
|
3315
|
-
outline
|
|
3316
|
-
|
|
3317
|
-
|
|
3318
|
-
|
|
3319
|
-
|
|
3320
|
-
.iui-checkbox
|
|
3321
|
-
|
|
3322
|
-
|
|
3323
|
-
|
|
3324
|
-
border-color
|
|
3325
|
-
|
|
3326
|
-
|
|
3327
|
-
|
|
3328
|
-
|
|
3329
|
-
|
|
3330
|
-
|
|
3331
|
-
.iui-checkbox
|
|
3332
|
-
|
|
3333
|
-
color:
|
|
3334
|
-
color:var(--iui-
|
|
3335
|
-
|
|
3336
|
-
fill:rgba(0, 0, 0, 0.2);
|
|
3337
|
-
fill:var(--iui-icons-color-actionable-disabled); }
|
|
3338
|
-
.iui-checkbox.iui-positive{
|
|
3339
|
-
color:#53A21A;
|
|
3340
|
-
color:var(--iui-color-foreground-positive); }
|
|
3341
|
-
.iui-checkbox.iui-warning{
|
|
3342
|
-
color:#F18B12;
|
|
3343
|
-
color:var(--iui-color-foreground-warning); }
|
|
3344
|
-
.iui-checkbox.iui-negative{
|
|
3345
|
-
color:#D30A0A;
|
|
3346
|
-
color:var(--iui-color-foreground-negative); }
|
|
3347
|
-
.iui-checkbox .iui-checkbox-checkmark{
|
|
3348
|
-
border-radius:3px; }
|
|
3192
|
+
cursor:pointer;
|
|
3193
|
+
color:rgba(0, 0, 0, 0.8);
|
|
3194
|
+
color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
|
|
3195
|
+
gap:8px; }
|
|
3196
|
+
.iui-checkbox-wrapper > * + *{
|
|
3197
|
+
margin-left:8px; }
|
|
3198
|
+
@supports (gap: 8px){
|
|
3199
|
+
.iui-checkbox-wrapper > * + *{
|
|
3200
|
+
margin-left:0; } }
|
|
3201
|
+
.iui-checkbox-wrapper.iui-loading{
|
|
3202
|
+
cursor:wait;
|
|
3203
|
+
color:var(--iui-text-color-muted); }
|
|
3204
|
+
.iui-checkbox-wrapper > .iui-checkbox-label,
|
|
3205
|
+
.iui-checkbox-wrapper > .iui-radio-label{
|
|
3206
|
+
display:flex;
|
|
3207
|
+
align-items:center; }
|
|
3208
|
+
.iui-checkbox-wrapper > .iui-checkbox-label svg,
|
|
3209
|
+
.iui-checkbox-wrapper > .iui-radio-label svg{
|
|
3210
|
+
width:16px;
|
|
3211
|
+
height:16px;
|
|
3212
|
+
vertical-align:middle;
|
|
3213
|
+
fill:currentColor; }
|
|
3214
|
+
.iui-checkbox-wrapper.iui-disabled{
|
|
3215
|
+
cursor:not-allowed;
|
|
3216
|
+
color:var(--iui-text-color-muted); }
|
|
3217
|
+
.iui-checkbox-wrapper.iui-disabled svg{
|
|
3218
|
+
fill:var(--iui-icons-color-actionable-disabled); }
|
|
3219
|
+
.iui-checkbox-wrapper.iui-positive{
|
|
3220
|
+
color:#53A21A;
|
|
3221
|
+
color:var(--iui-color-foreground-positive); }
|
|
3222
|
+
.iui-checkbox-wrapper.iui-warning{
|
|
3223
|
+
color:#F18B12;
|
|
3224
|
+
color:var(--iui-color-foreground-warning); }
|
|
3225
|
+
.iui-checkbox-wrapper.iui-negative{
|
|
3226
|
+
color:#D30A0A;
|
|
3227
|
+
color:var(--iui-color-foreground-negative); }
|
|
3228
|
+
.iui-checkbox::before{
|
|
3229
|
+
content:'';
|
|
3230
|
+
position:absolute;
|
|
3231
|
+
inset:0;
|
|
3232
|
+
transition:border-color 0.2s ease-out;
|
|
3233
|
+
border-radius:inherit;
|
|
3234
|
+
border-style:solid;
|
|
3235
|
+
border-width:1px;
|
|
3236
|
+
border-color:var(--_iui-checkbox-border-color); }
|
|
3237
|
+
.iui-checkbox::after{
|
|
3238
|
+
content:'';
|
|
3239
|
+
position:absolute;
|
|
3240
|
+
inset:0;
|
|
3241
|
+
background-color:var(--_iui-checkbox-svg-color);
|
|
3242
|
+
-webkit-mask:var(--_iui-checkbox-mask-image) no-repeat center;
|
|
3243
|
+
mask:var(--_iui-checkbox-mask-image) no-repeat center; }
|
|
3244
|
+
.iui-checkbox:not(:checked){
|
|
3245
|
+
--_iui-checkbox-mask-image:var(--_iui-checkbox-unchecked-svg); }
|
|
3246
|
+
.iui-checkbox:checked{
|
|
3247
|
+
--_iui-checkbox-border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-3));
|
|
3248
|
+
--_iui-checkbox-mask-image:var(--_iui-checkbox-checkmark-svg); }
|
|
3249
|
+
.iui-checkbox:indeterminate{
|
|
3250
|
+
--_iui-checkbox-border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-3));
|
|
3251
|
+
--_iui-checkbox-mask-image:var(--_iui-checkbox-indeterminate-svg); }
|
|
3252
|
+
.iui-checkbox:hover{
|
|
3253
|
+
--_iui-checkbox-border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2)); }
|
|
3254
|
+
.iui-checkbox:focus-visible{
|
|
3255
|
+
outline:2px solid var(--iui-color-foreground-primary);
|
|
3256
|
+
outline-offset:-1px; }
|
|
3257
|
+
@supports not selector(*:focus-visible){
|
|
3258
|
+
.iui-checkbox:focus{
|
|
3259
|
+
outline:2px solid var(--iui-color-foreground-primary);
|
|
3260
|
+
outline-offset:-1px; } }
|
|
3261
|
+
.iui-checkbox.iui-checkbox-visibility{
|
|
3262
|
+
--_iui-checkbox-checkmark-svg:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m8 2.99051a8.81883 8.81883 0 0 0 -8 4.95062 8.74664 8.74664 0 0 0 8 5.06836 8.63266 8.63266 0 0 0 8-5.06836 8.83631 8.83631 0 0 0 -8-4.95062zm-1.31445 1.86981a1.47663 1.47663 0 1 1 -1.47663 1.47668 1.47665 1.47665 0 0 1 1.47663-1.47668zm1.31445 6.64917a7.17486 7.17486 0 0 1 -6.30475-3.55237 7.4952 7.4952 0 0 1 2.81475-2.6336 3.83956 3.83956 0 1 0 6.98126.00244 7.522 7.522 0 0 1 2.81774 2.63916 7.09785 7.09785 0 0 1 -6.309 3.54437z" /></svg>');
|
|
3263
|
+
--_iui-checkbox-indeterminate-svg:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m8 3v7.9a4.01179 4.01179 0 0 0 4-4 6.7509 6.7509 0 0 0 -.2-1.4l.1.1a6.89429 6.89429 0 0 1 2.4 2.4 8.39088 8.39088 0 0 1 -2.3 2.3 6.89412 6.89412 0 0 1 -3.9 1.2c-.03345 0-.06653-.00677-.1-.0072v1.5072a8.90686 8.90686 0 0 0 8-5 8.90686 8.90686 0 0 0 -8-5z" opacity=".33" /><path d="m8 0a1 1 0 0 0 -1 1v2.07135a8.91637 8.91637 0 0 0 -7 4.92865 8.91637 8.91637 0 0 0 7 4.92865v2.07135a1 1 0 0 0 2 0v-14a1 1 0 0 0 -1-1zm-1.5 4.9a1.55426 1.55426 0 0 1 .5.087v2.81451a1.40746 1.40746 0 0 1 -.5.09849 1.538 1.538 0 0 1 -1.5-1.5 1.53794 1.53794 0 0 1 1.5-1.5zm-2.3 5.4a6.97279 6.97279 0 0 1 -2.5-2.3 6.89429 6.89429 0 0 1 2.4-2.4c.1 0 .1-.1.2-.1a3.194 3.194 0 0 0 -.3 1.4 4.0047 4.0047 0 0 0 3 3.857v.65289a6.37491 6.37491 0 0 1 -2.8-1.10989z" /></svg>');
|
|
3264
|
+
--_iui-checkbox-unchecked-svg:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m1.70671 12.879 11.17218-11.17219 1.4142 1.4142-11.17218 11.17218zm.99329-1.679 1.1-1.1a5.06317 5.06317 0 0 1 -2-2.1 7.48268 7.48268 0 0 1 6.2-3.5 4.86877 4.86877 0 0 1 1.2.1l1.3-1.3a10.07431 10.07431 0 0 0 -2.5-.3 8.84129 8.84129 0 0 0 -8 5 8.42455 8.42455 0 0 0 2.7 3.2zm10.7-6.4-1.1 1.1a7.08625 7.08625 0 0 1 2 2.1 7.50323 7.50323 0 0 1 -6.2 3.5 8.31665 8.31665 0 0 1 -1.3-.2l-1.3 1.3a8.909 8.909 0 0 0 6.4-.5 9.04344 9.04344 0 0 0 4.1-4.1 9.168 9.168 0 0 0 -2.6-3.2z" /></svg>');
|
|
3265
|
+
--_iui-checkbox-border-color:transparent;
|
|
3266
|
+
--_iui-checkbox-background-color:transparent; }
|
|
3267
|
+
.iui-checkbox.iui-checkbox-visibility:where(:not(:checked):not(:indeterminate)){
|
|
3268
|
+
--_iui-checkbox-svg-color:var(--iui-icons-color-actionable); }
|
|
3269
|
+
.iui-checkbox.iui-checkbox-visibility:where(:hover){
|
|
3270
|
+
--_iui-checkbox-border-color:transparent;
|
|
3271
|
+
--_iui-checkbox-background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-6)); }
|
|
3272
|
+
.iui-checkbox:disabled{
|
|
3273
|
+
--_iui-checkbox-svg-color:var(--iui-icons-color-actionable-disabled);
|
|
3274
|
+
--_iui-checkbox-border-color:var(--iui-color-background-disabled);
|
|
3275
|
+
--_iui-checkbox-background-color:var(--iui-color-background-disabled);
|
|
3276
|
+
cursor:not-allowed; }
|
|
3349
3277
|
.iui-checkbox.iui-loading{
|
|
3278
|
+
--_iui-checkbox-border-color:transparent;
|
|
3279
|
+
--_iui-checkbox-background-color:transparent;
|
|
3280
|
+
opacity:0;
|
|
3281
|
+
position:absolute;
|
|
3350
3282
|
cursor:wait; }
|
|
3351
|
-
.iui-checkbox.iui-loading input ~ .iui-checkbox-checkmark{
|
|
3352
|
-
border-color:transparent;
|
|
3353
|
-
background-color:transparent; }
|
|
3354
|
-
.iui-checkbox.iui-loading input:disabled ~ .iui-checkbox-checkmark{
|
|
3355
|
-
cursor:wait; }
|
|
3356
|
-
.iui-checkbox.iui-loading input:disabled ~ .iui-label{
|
|
3357
|
-
cursor:wait; }
|
|
3358
|
-
.iui-checkbox-visibility:hover > input:enabled ~ .iui-checkbox-checkmark{
|
|
3359
|
-
background-color:rgba(0, 0, 0, 0.1);
|
|
3360
|
-
background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-6)); }
|
|
3361
|
-
.iui-checkbox-visibility input ~ .iui-checkbox-checkmark::after,
|
|
3362
|
-
.iui-checkbox-visibility:hover > input:enabled ~ .iui-checkbox-checkmark::after{
|
|
3363
|
-
border:none; }
|
|
3364
|
-
.iui-checkbox-visibility input ~ .iui-checkbox-checkmark{
|
|
3365
|
-
background-color:transparent; }
|
|
3366
|
-
.iui-checkbox-visibility input:checked ~ .iui-checkbox-checkmark .iui-uncheck,
|
|
3367
|
-
.iui-checkbox-visibility input:indeterminate ~ .iui-checkbox-checkmark .iui-uncheck{
|
|
3368
|
-
opacity:0; }
|
|
3369
|
-
.iui-checkbox-visibility input ~ .iui-checkbox-checkmark .iui-uncheck{
|
|
3370
|
-
opacity:1;
|
|
3371
|
-
transition:opacity 0.2s ease;
|
|
3372
|
-
fill:rgba(0, 0, 0, 0.8);
|
|
3373
|
-
fill:var(--iui-icons-color-actionable); }
|
|
3374
|
-
.iui-checkbox-visibility input:disabled ~ .iui-checkbox-checkmark .iui-uncheck{
|
|
3375
|
-
fill:rgba(0, 0, 0, 0.2);
|
|
3376
|
-
fill:var(--iui-icons-color-actionable-disabled); }
|
|
3377
3283
|
|
|
3378
3284
|
.iui-radio{
|
|
3285
|
+
--_iui-checkbox-checkmark-svg:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m6.5 12.5-4.5-4.5 1.5-1.5 3 3 6-6 1.5 1.5z" /></svg>');
|
|
3286
|
+
--_iui-checkbox-indeterminate-svg:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m2.75 6.875h10.5v2.25h-10.5z" /></svg>');
|
|
3287
|
+
--_iui-checkbox-unchecked-svg:url('data:image/svg+xml;utf8,<svg viewBox="0 0 16 16"></svg>');
|
|
3288
|
+
--_iui-checkbox-svg-color:var(--iui-color-foreground-primary);
|
|
3289
|
+
--_iui-checkbox-border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-4));
|
|
3290
|
+
--_iui-checkbox-background-color:var(--iui-color-background-1);
|
|
3291
|
+
--_iui-checkbox-mask-image:initial;
|
|
3292
|
+
-webkit-appearance:none;
|
|
3293
|
+
-moz-appearance:none;
|
|
3294
|
+
appearance:none;
|
|
3379
3295
|
margin:0;
|
|
3380
|
-
|
|
3381
|
-
|
|
3382
|
-
vertical-align:baseline;
|
|
3383
|
-
display:flex;
|
|
3384
|
-
align-items:center;
|
|
3385
|
-
font-size:14px;
|
|
3386
|
-
width:-webkit-fit-content;
|
|
3387
|
-
width:-moz-fit-content;
|
|
3388
|
-
width:fit-content;
|
|
3389
|
-
-webkit-user-select:none;
|
|
3390
|
-
-moz-user-select:none;
|
|
3391
|
-
-ms-user-select:none;
|
|
3392
|
-
user-select:none;
|
|
3296
|
+
width:16px;
|
|
3297
|
+
height:16px;
|
|
3393
3298
|
position:relative;
|
|
3299
|
+
border-radius:3px;
|
|
3300
|
+
background-color:var(--_iui-checkbox-background-color);
|
|
3394
3301
|
cursor:pointer;
|
|
3395
|
-
|
|
3396
|
-
|
|
3397
|
-
.iui-radio > input{
|
|
3398
|
-
width:0;
|
|
3399
|
-
height:0;
|
|
3400
|
-
-webkit-appearance:none;
|
|
3401
|
-
-moz-appearance:none;
|
|
3402
|
-
appearance:none;
|
|
3403
|
-
opacity:0;
|
|
3404
|
-
position:absolute; }
|
|
3405
|
-
.iui-radio.iui-disabled{
|
|
3406
|
-
cursor:not-allowed; }
|
|
3407
|
-
.iui-radio .iui-checkbox-checkmark,
|
|
3408
|
-
.iui-radio .iui-radio-dot{
|
|
3409
|
-
width:16px;
|
|
3410
|
-
height:16px;
|
|
3302
|
+
border-radius:50%; }
|
|
3303
|
+
.iui-radio-wrapper{
|
|
3411
3304
|
margin:0;
|
|
3305
|
+
padding:0;
|
|
3306
|
+
border:none;
|
|
3307
|
+
vertical-align:baseline;
|
|
3412
3308
|
display:flex;
|
|
3413
|
-
flex-shrink:0;
|
|
3414
|
-
justify-content:center;
|
|
3415
3309
|
align-items:center;
|
|
3310
|
+
font-size:14px;
|
|
3311
|
+
width:-webkit-fit-content;
|
|
3312
|
+
width:-moz-fit-content;
|
|
3313
|
+
width:fit-content;
|
|
3314
|
+
-webkit-user-select:none;
|
|
3315
|
+
-moz-user-select:none;
|
|
3316
|
+
-ms-user-select:none;
|
|
3317
|
+
user-select:none;
|
|
3416
3318
|
position:relative;
|
|
3417
|
-
|
|
3418
|
-
|
|
3419
|
-
|
|
3420
|
-
|
|
3421
|
-
|
|
3422
|
-
|
|
3423
|
-
|
|
3424
|
-
|
|
3425
|
-
|
|
3426
|
-
|
|
3427
|
-
|
|
3428
|
-
|
|
3429
|
-
|
|
3430
|
-
|
|
3431
|
-
|
|
3432
|
-
|
|
3433
|
-
|
|
3434
|
-
|
|
3435
|
-
|
|
3436
|
-
|
|
3437
|
-
|
|
3438
|
-
|
|
3439
|
-
|
|
3440
|
-
|
|
3441
|
-
|
|
3442
|
-
|
|
3443
|
-
|
|
3444
|
-
|
|
3445
|
-
|
|
3446
|
-
|
|
3447
|
-
|
|
3319
|
+
cursor:pointer;
|
|
3320
|
+
color:rgba(0, 0, 0, 0.8);
|
|
3321
|
+
color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
|
|
3322
|
+
gap:8px; }
|
|
3323
|
+
.iui-radio-wrapper > * + *{
|
|
3324
|
+
margin-left:8px; }
|
|
3325
|
+
@supports (gap: 8px){
|
|
3326
|
+
.iui-radio-wrapper > * + *{
|
|
3327
|
+
margin-left:0; } }
|
|
3328
|
+
.iui-radio-wrapper.iui-loading{
|
|
3329
|
+
cursor:wait;
|
|
3330
|
+
color:var(--iui-text-color-muted); }
|
|
3331
|
+
.iui-radio-wrapper > .iui-checkbox-label,
|
|
3332
|
+
.iui-radio-wrapper > .iui-radio-label{
|
|
3333
|
+
display:flex;
|
|
3334
|
+
align-items:center; }
|
|
3335
|
+
.iui-radio-wrapper > .iui-checkbox-label svg,
|
|
3336
|
+
.iui-radio-wrapper > .iui-radio-label svg{
|
|
3337
|
+
width:16px;
|
|
3338
|
+
height:16px;
|
|
3339
|
+
vertical-align:middle;
|
|
3340
|
+
fill:currentColor; }
|
|
3341
|
+
.iui-radio-wrapper.iui-disabled{
|
|
3342
|
+
cursor:not-allowed;
|
|
3343
|
+
color:var(--iui-text-color-muted); }
|
|
3344
|
+
.iui-radio-wrapper.iui-disabled svg{
|
|
3345
|
+
fill:var(--iui-icons-color-actionable-disabled); }
|
|
3346
|
+
.iui-radio-wrapper.iui-positive{
|
|
3347
|
+
color:#53A21A;
|
|
3348
|
+
color:var(--iui-color-foreground-positive); }
|
|
3349
|
+
.iui-radio-wrapper.iui-warning{
|
|
3350
|
+
color:#F18B12;
|
|
3351
|
+
color:var(--iui-color-foreground-warning); }
|
|
3352
|
+
.iui-radio-wrapper.iui-negative{
|
|
3353
|
+
color:#D30A0A;
|
|
3354
|
+
color:var(--iui-color-foreground-negative); }
|
|
3355
|
+
.iui-radio-wrapper{
|
|
3356
|
+
margin:0;
|
|
3357
|
+
padding:0;
|
|
3358
|
+
border:none;
|
|
3359
|
+
vertical-align:baseline;
|
|
3448
3360
|
display:flex;
|
|
3449
|
-
align-items:center;
|
|
3450
|
-
|
|
3451
|
-
|
|
3452
|
-
|
|
3453
|
-
|
|
3454
|
-
|
|
3455
|
-
|
|
3456
|
-
|
|
3457
|
-
|
|
3458
|
-
|
|
3459
|
-
|
|
3460
|
-
|
|
3461
|
-
|
|
3462
|
-
|
|
3463
|
-
|
|
3464
|
-
|
|
3465
|
-
|
|
3466
|
-
|
|
3467
|
-
|
|
3468
|
-
|
|
3469
|
-
|
|
3470
|
-
|
|
3471
|
-
|
|
3472
|
-
|
|
3473
|
-
|
|
3474
|
-
|
|
3475
|
-
.iui-radio
|
|
3476
|
-
.iui-radio
|
|
3477
|
-
|
|
3478
|
-
|
|
3479
|
-
|
|
3480
|
-
|
|
3361
|
+
align-items:center;
|
|
3362
|
+
font-size:14px;
|
|
3363
|
+
width:-webkit-fit-content;
|
|
3364
|
+
width:-moz-fit-content;
|
|
3365
|
+
width:fit-content;
|
|
3366
|
+
-webkit-user-select:none;
|
|
3367
|
+
-moz-user-select:none;
|
|
3368
|
+
-ms-user-select:none;
|
|
3369
|
+
user-select:none;
|
|
3370
|
+
position:relative;
|
|
3371
|
+
cursor:pointer;
|
|
3372
|
+
color:rgba(0, 0, 0, 0.8);
|
|
3373
|
+
color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2));
|
|
3374
|
+
gap:8px; }
|
|
3375
|
+
.iui-radio-wrapper > * + *{
|
|
3376
|
+
margin-left:8px; }
|
|
3377
|
+
@supports (gap: 8px){
|
|
3378
|
+
.iui-radio-wrapper > * + *{
|
|
3379
|
+
margin-left:0; } }
|
|
3380
|
+
.iui-radio-wrapper.iui-loading{
|
|
3381
|
+
cursor:wait;
|
|
3382
|
+
color:var(--iui-text-color-muted); }
|
|
3383
|
+
.iui-radio-wrapper > .iui-checkbox-label,
|
|
3384
|
+
.iui-radio-wrapper > .iui-radio-label{
|
|
3385
|
+
display:flex;
|
|
3386
|
+
align-items:center; }
|
|
3387
|
+
.iui-radio-wrapper > .iui-checkbox-label svg,
|
|
3388
|
+
.iui-radio-wrapper > .iui-radio-label svg{
|
|
3389
|
+
width:16px;
|
|
3390
|
+
height:16px;
|
|
3391
|
+
vertical-align:middle;
|
|
3392
|
+
fill:currentColor; }
|
|
3393
|
+
.iui-radio-wrapper.iui-disabled{
|
|
3394
|
+
cursor:not-allowed;
|
|
3395
|
+
color:var(--iui-text-color-muted); }
|
|
3396
|
+
.iui-radio-wrapper.iui-disabled svg{
|
|
3397
|
+
fill:var(--iui-icons-color-actionable-disabled); }
|
|
3398
|
+
.iui-radio-wrapper.iui-positive{
|
|
3399
|
+
color:#53A21A;
|
|
3400
|
+
color:var(--iui-color-foreground-positive); }
|
|
3401
|
+
.iui-radio-wrapper.iui-warning{
|
|
3402
|
+
color:#F18B12;
|
|
3403
|
+
color:var(--iui-color-foreground-warning); }
|
|
3404
|
+
.iui-radio-wrapper.iui-negative{
|
|
3405
|
+
color:#D30A0A;
|
|
3406
|
+
color:var(--iui-color-foreground-negative); }
|
|
3407
|
+
.iui-radio::before{
|
|
3408
|
+
content:'';
|
|
3409
|
+
position:absolute;
|
|
3410
|
+
inset:0;
|
|
3411
|
+
transition:border-color 0.2s ease-out;
|
|
3412
|
+
border-radius:inherit;
|
|
3413
|
+
border-style:solid;
|
|
3414
|
+
border-width:1px;
|
|
3415
|
+
border-color:var(--_iui-checkbox-border-color); }
|
|
3416
|
+
.iui-radio::after{
|
|
3417
|
+
content:'';
|
|
3418
|
+
position:absolute;
|
|
3419
|
+
inset:0;
|
|
3420
|
+
background-color:var(--_iui-checkbox-svg-color);
|
|
3421
|
+
-webkit-mask:var(--_iui-checkbox-mask-image) no-repeat center;
|
|
3422
|
+
mask:var(--_iui-checkbox-mask-image) no-repeat center; }
|
|
3423
|
+
.iui-radio:not(:checked){
|
|
3424
|
+
--_iui-checkbox-mask-image:var(--_iui-checkbox-unchecked-svg); }
|
|
3425
|
+
.iui-radio:checked{
|
|
3426
|
+
--_iui-checkbox-border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-3));
|
|
3427
|
+
--_iui-checkbox-mask-image:var(--_iui-checkbox-checkmark-svg); }
|
|
3428
|
+
.iui-radio:indeterminate{
|
|
3429
|
+
--_iui-checkbox-border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-3));
|
|
3430
|
+
--_iui-checkbox-mask-image:var(--_iui-checkbox-indeterminate-svg); }
|
|
3431
|
+
.iui-radio:hover{
|
|
3432
|
+
--_iui-checkbox-border-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-2)); }
|
|
3433
|
+
.iui-radio:focus-visible{
|
|
3481
3434
|
outline:2px solid var(--iui-color-foreground-primary);
|
|
3482
3435
|
outline-offset:-1px; }
|
|
3483
|
-
|
|
3484
|
-
|
|
3485
|
-
|
|
3486
|
-
|
|
3487
|
-
.iui-radio
|
|
3488
|
-
|
|
3489
|
-
|
|
3490
|
-
|
|
3491
|
-
|
|
3492
|
-
|
|
3493
|
-
|
|
3494
|
-
|
|
3495
|
-
|
|
3496
|
-
|
|
3497
|
-
|
|
3498
|
-
|
|
3499
|
-
color:
|
|
3500
|
-
color:var(--iui-
|
|
3501
|
-
|
|
3502
|
-
|
|
3503
|
-
|
|
3504
|
-
|
|
3505
|
-
color
|
|
3506
|
-
|
|
3507
|
-
|
|
3508
|
-
|
|
3509
|
-
|
|
3510
|
-
|
|
3511
|
-
color:#D30A0A;
|
|
3512
|
-
color:var(--iui-color-foreground-negative); }
|
|
3513
|
-
.iui-radio .iui-radio-dot{
|
|
3514
|
-
border-radius:50%; }
|
|
3436
|
+
@supports not selector(*:focus-visible){
|
|
3437
|
+
.iui-radio:focus{
|
|
3438
|
+
outline:2px solid var(--iui-color-foreground-primary);
|
|
3439
|
+
outline-offset:-1px; } }
|
|
3440
|
+
.iui-radio.iui-checkbox-visibility{
|
|
3441
|
+
--_iui-checkbox-checkmark-svg:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m8 2.99051a8.81883 8.81883 0 0 0 -8 4.95062 8.74664 8.74664 0 0 0 8 5.06836 8.63266 8.63266 0 0 0 8-5.06836 8.83631 8.83631 0 0 0 -8-4.95062zm-1.31445 1.86981a1.47663 1.47663 0 1 1 -1.47663 1.47668 1.47665 1.47665 0 0 1 1.47663-1.47668zm1.31445 6.64917a7.17486 7.17486 0 0 1 -6.30475-3.55237 7.4952 7.4952 0 0 1 2.81475-2.6336 3.83956 3.83956 0 1 0 6.98126.00244 7.522 7.522 0 0 1 2.81774 2.63916 7.09785 7.09785 0 0 1 -6.309 3.54437z" /></svg>');
|
|
3442
|
+
--_iui-checkbox-indeterminate-svg:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m8 3v7.9a4.01179 4.01179 0 0 0 4-4 6.7509 6.7509 0 0 0 -.2-1.4l.1.1a6.89429 6.89429 0 0 1 2.4 2.4 8.39088 8.39088 0 0 1 -2.3 2.3 6.89412 6.89412 0 0 1 -3.9 1.2c-.03345 0-.06653-.00677-.1-.0072v1.5072a8.90686 8.90686 0 0 0 8-5 8.90686 8.90686 0 0 0 -8-5z" opacity=".33" /><path d="m8 0a1 1 0 0 0 -1 1v2.07135a8.91637 8.91637 0 0 0 -7 4.92865 8.91637 8.91637 0 0 0 7 4.92865v2.07135a1 1 0 0 0 2 0v-14a1 1 0 0 0 -1-1zm-1.5 4.9a1.55426 1.55426 0 0 1 .5.087v2.81451a1.40746 1.40746 0 0 1 -.5.09849 1.538 1.538 0 0 1 -1.5-1.5 1.53794 1.53794 0 0 1 1.5-1.5zm-2.3 5.4a6.97279 6.97279 0 0 1 -2.5-2.3 6.89429 6.89429 0 0 1 2.4-2.4c.1 0 .1-.1.2-.1a3.194 3.194 0 0 0 -.3 1.4 4.0047 4.0047 0 0 0 3 3.857v.65289a6.37491 6.37491 0 0 1 -2.8-1.10989z" /></svg>');
|
|
3443
|
+
--_iui-checkbox-unchecked-svg:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16"><path d="m1.70671 12.879 11.17218-11.17219 1.4142 1.4142-11.17218 11.17218zm.99329-1.679 1.1-1.1a5.06317 5.06317 0 0 1 -2-2.1 7.48268 7.48268 0 0 1 6.2-3.5 4.86877 4.86877 0 0 1 1.2.1l1.3-1.3a10.07431 10.07431 0 0 0 -2.5-.3 8.84129 8.84129 0 0 0 -8 5 8.42455 8.42455 0 0 0 2.7 3.2zm10.7-6.4-1.1 1.1a7.08625 7.08625 0 0 1 2 2.1 7.50323 7.50323 0 0 1 -6.2 3.5 8.31665 8.31665 0 0 1 -1.3-.2l-1.3 1.3a8.909 8.909 0 0 0 6.4-.5 9.04344 9.04344 0 0 0 4.1-4.1 9.168 9.168 0 0 0 -2.6-3.2z" /></svg>');
|
|
3444
|
+
--_iui-checkbox-border-color:transparent;
|
|
3445
|
+
--_iui-checkbox-background-color:transparent; }
|
|
3446
|
+
.iui-radio.iui-checkbox-visibility:where(:not(:checked):not(:indeterminate)){
|
|
3447
|
+
--_iui-checkbox-svg-color:var(--iui-icons-color-actionable); }
|
|
3448
|
+
.iui-radio.iui-checkbox-visibility:where(:hover){
|
|
3449
|
+
--_iui-checkbox-border-color:transparent;
|
|
3450
|
+
--_iui-checkbox-background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-6)); }
|
|
3451
|
+
.iui-radio:disabled{
|
|
3452
|
+
--_iui-checkbox-svg-color:var(--iui-icons-color-actionable-disabled);
|
|
3453
|
+
--_iui-checkbox-border-color:var(--iui-color-background-disabled);
|
|
3454
|
+
--_iui-checkbox-background-color:var(--iui-color-background-disabled);
|
|
3455
|
+
cursor:not-allowed; }
|
|
3456
|
+
.iui-radio.iui-loading{
|
|
3457
|
+
--_iui-checkbox-border-color:transparent;
|
|
3458
|
+
--_iui-checkbox-background-color:transparent;
|
|
3459
|
+
opacity:0;
|
|
3460
|
+
position:absolute;
|
|
3461
|
+
cursor:wait; }
|
|
3462
|
+
.iui-radio:checked{
|
|
3463
|
+
--_iui-checkbox-mask-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" ><circle cx="8" cy="8" r="4" /></svg>'); }
|
|
3515
3464
|
|
|
3516
3465
|
.iui-radio-tile-container{
|
|
3517
3466
|
display:inline-flex;
|
|
@@ -4218,11 +4167,11 @@ html.iui-theme-dark{
|
|
|
4218
4167
|
box-shadow:0 0 0 0 rgba(var(--iui-color-foreground-accessory-rgb), 0); } } }
|
|
4219
4168
|
|
|
4220
4169
|
.iui-popover{ }
|
|
4221
|
-
.iui-popover[data-reference-hidden]{
|
|
4222
|
-
visibility:hidden;
|
|
4223
|
-
pointer-events:none; }
|
|
4224
4170
|
.iui-popover.tippy-box{
|
|
4225
4171
|
all:revert; }
|
|
4172
|
+
.iui-popover.tippy-box[data-reference-hidden]{
|
|
4173
|
+
visibility:visible;
|
|
4174
|
+
pointer-events:auto; }
|
|
4226
4175
|
.iui-popover .tippy-content{
|
|
4227
4176
|
all:revert; }
|
|
4228
4177
|
|
|
@@ -4591,7 +4540,8 @@ html.iui-theme-dark{
|
|
|
4591
4540
|
border-left:none;
|
|
4592
4541
|
border-right:none;
|
|
4593
4542
|
overflow:hidden;
|
|
4594
|
-
justify-content:flex-start;
|
|
4543
|
+
justify-content:flex-start;
|
|
4544
|
+
--_iui-button-active-stripe-inset:0 calc(100% - 2px) 0 0; }
|
|
4595
4545
|
.iui-side-navigation .iui-sidenav-button:not(.iui-expand){
|
|
4596
4546
|
height:55px; }
|
|
4597
4547
|
@supports (padding: max(0px)){
|
|
@@ -4611,9 +4561,6 @@ html.iui-theme-dark{
|
|
|
4611
4561
|
.iui-side-navigation .iui-sidenav-button.iui-submenu-open .iui-button-icon{
|
|
4612
4562
|
fill:#008BE1;
|
|
4613
4563
|
fill:var(--iui-color-foreground-primary); }
|
|
4614
|
-
.iui-side-navigation .iui-sidenav-button.iui-active{
|
|
4615
|
-
box-shadow:inset 2px 0 0 0 #008BE1;
|
|
4616
|
-
box-shadow:inset 2px 0 0 0 var(--iui-icons-color-primary); }
|
|
4617
4564
|
.iui-side-navigation .iui-sidenav-button[disabled], .iui-side-navigation .iui-sidenav-button:disabled{
|
|
4618
4565
|
background-color:#F8F9FB;
|
|
4619
4566
|
background-color:var(--iui-color-background-2); }
|
|
@@ -5239,56 +5186,10 @@ html.iui-theme-dark{
|
|
|
5239
5186
|
.iui-paginator-pages-group{
|
|
5240
5187
|
display:inline-flex;
|
|
5241
5188
|
align-items:center;
|
|
5242
|
-
isolation:isolate;
|
|
5243
5189
|
margin:0 8px; }
|
|
5244
|
-
.iui-paginator-pages-group > *{
|
|
5245
|
-
display:flex; }
|
|
5246
|
-
.iui-paginator-pages-group > * input, .iui-paginator-pages-group > * button{
|
|
5247
|
-
position:relative;
|
|
5248
|
-
transition-duration:0ms; }
|
|
5249
|
-
.iui-paginator-pages-group > * input:hover, .iui-paginator-pages-group > * button:hover{
|
|
5250
|
-
z-index:1; }
|
|
5251
|
-
.iui-paginator-pages-group > * input:focus, .iui-paginator-pages-group > * button:focus{
|
|
5252
|
-
z-index:2; }
|
|
5253
|
-
.iui-paginator-pages-group > * input:focus:where(:not(:focus-visible):not(:hover)), .iui-paginator-pages-group > * button:focus:where(:not(:focus-visible):not(:hover)){
|
|
5254
|
-
z-index:revert; }
|
|
5255
|
-
.iui-paginator-pages-group > * input:disabled, .iui-paginator-pages-group > * button:disabled{
|
|
5256
|
-
z-index:-1; }
|
|
5257
|
-
.iui-paginator-pages-group > * input:hover, .iui-paginator-pages-group > * input:focus, .iui-paginator-pages-group > * button:hover, .iui-paginator-pages-group > * button:focus{
|
|
5258
|
-
transition-duration:0.2s; }
|
|
5259
|
-
.iui-paginator-pages-group > * input.iui-active::after, .iui-paginator-pages-group > * button.iui-active::after{
|
|
5260
|
-
content:'';
|
|
5261
|
-
position:absolute;
|
|
5262
|
-
height:2px;
|
|
5263
|
-
opacity:1;
|
|
5264
|
-
top:2px;
|
|
5265
|
-
left:2px;
|
|
5266
|
-
width:calc(100% - 4px);
|
|
5267
|
-
background-color:#008BE1;
|
|
5268
|
-
background-color:var(--iui-color-foreground-primary); }
|
|
5269
|
-
.iui-paginator-pages-group > * input.iui-active:disabled::after, .iui-paginator-pages-group > * button.iui-active:disabled::after{
|
|
5270
|
-
background-color:rgba(0, 0, 0, 0.2);
|
|
5271
|
-
background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)); }
|
|
5272
|
-
.iui-paginator-pages-group > * input:not(.iui-borderless), .iui-paginator-pages-group > * button:not(.iui-borderless){
|
|
5273
|
-
border-radius:0; }
|
|
5274
|
-
.iui-paginator-pages-group > *:first-child input, .iui-paginator-pages-group > *:first-child button:not(.iui-borderless){
|
|
5275
|
-
border-top-left-radius:3px;
|
|
5276
|
-
border-bottom-left-radius:3px; }
|
|
5277
|
-
.iui-paginator-pages-group > *:last-child input, .iui-paginator-pages-group > *:last-child button:not(.iui-borderless){
|
|
5278
|
-
border-top-right-radius:3px;
|
|
5279
|
-
border-bottom-right-radius:3px; }
|
|
5280
|
-
.iui-paginator-pages-group > * + *{
|
|
5281
|
-
margin-left:-1px; }
|
|
5282
|
-
.iui-paginator-pages-group > *:not(:first-child) .iui-default:disabled{
|
|
5283
|
-
border-left-color:#DCE0E3;
|
|
5284
|
-
border-left-color:var(--iui-color-background-4); }
|
|
5285
|
-
.iui-paginator-pages-group > * + *{
|
|
5286
|
-
margin-left:0; }
|
|
5287
|
-
.iui-paginator-pages-group button.iui-active::after{
|
|
5288
|
-
top:auto;
|
|
5289
|
-
bottom:2px; }
|
|
5290
5190
|
|
|
5291
5191
|
.iui-paginator-page-button{
|
|
5192
|
+
--_iui-button-active-stripe-inset:initial;
|
|
5292
5193
|
margin:0;
|
|
5293
5194
|
padding:0;
|
|
5294
5195
|
border:none;
|
|
@@ -5302,7 +5203,6 @@ html.iui-theme-dark{
|
|
|
5302
5203
|
box-sizing:border-box;
|
|
5303
5204
|
border-radius:3px;
|
|
5304
5205
|
line-height:22px;
|
|
5305
|
-
outline:none;
|
|
5306
5206
|
box-shadow:none;
|
|
5307
5207
|
font-size:14px;
|
|
5308
5208
|
font-weight:400;
|
|
@@ -5321,7 +5221,8 @@ html.iui-theme-dark{
|
|
|
5321
5221
|
padding:0 8px;
|
|
5322
5222
|
height:38px;
|
|
5323
5223
|
gap:8px;
|
|
5324
|
-
width:38px;
|
|
5224
|
+
width:38px;
|
|
5225
|
+
--_iui-button-active-stripe-inset:calc(100% - 4px) 2px 2px; }
|
|
5325
5226
|
@media (prefers-reduced-motion: no-preference){
|
|
5326
5227
|
.iui-paginator-page-button{
|
|
5327
5228
|
transition:color 0.2s ease-out, background-color 0.2s ease-out, border-color 0.2s ease-out; } }
|
|
@@ -5344,6 +5245,13 @@ html.iui-theme-dark{
|
|
|
5344
5245
|
background:var(--iui-color-background-disabled);
|
|
5345
5246
|
border-color:var(--iui-color-background-disabled);
|
|
5346
5247
|
color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)); }
|
|
5248
|
+
.iui-paginator-page-button.iui-active::after{
|
|
5249
|
+
content:'';
|
|
5250
|
+
position:absolute;
|
|
5251
|
+
inset:var(--_iui-button-active-stripe-inset);
|
|
5252
|
+
background-color:var(--iui-color-foreground-primary); }
|
|
5253
|
+
.iui-paginator-page-button.iui-active[disabled]::after, .iui-paginator-page-button.iui-active:disabled::after{
|
|
5254
|
+
background-color:rgba(var(--iui-color-foreground-body-rgb), var(--iui-opacity-5)); }
|
|
5347
5255
|
.iui-paginator-page-button > .iui-button-icon:only-child{
|
|
5348
5256
|
margin-left:3px;
|
|
5349
5257
|
margin-right:3px; }
|
|
@@ -5879,10 +5787,26 @@ a.iui-tag{
|
|
|
5879
5787
|
color:rgba(0, 0, 0, 0.8);
|
|
5880
5788
|
background-color:var(--iui-color-background-1);
|
|
5881
5789
|
color:var(--iui-text-color); }
|
|
5790
|
+
.iui-tile:focus-visible{
|
|
5791
|
+
outline:2px solid var(--iui-color-foreground-primary);
|
|
5792
|
+
outline-offset:2px; }
|
|
5793
|
+
@supports not selector(*:focus-visible){
|
|
5794
|
+
.iui-tile:focus{
|
|
5795
|
+
outline:2px solid var(--iui-color-foreground-primary);
|
|
5796
|
+
outline-offset:2px; } }
|
|
5797
|
+
.iui-tile:hover .iui-tile-more-options, .iui-tile:focus-within .iui-tile-more-options{
|
|
5798
|
+
-webkit-clip-path:revert;
|
|
5799
|
+
clip-path:revert;
|
|
5800
|
+
overflow:visible;
|
|
5801
|
+
position:static;
|
|
5802
|
+
white-space:normal;
|
|
5803
|
+
height:auto;
|
|
5804
|
+
width:auto;
|
|
5805
|
+
padding:0;
|
|
5806
|
+
margin:0;
|
|
5807
|
+
position:absolute; }
|
|
5882
5808
|
.iui-tile:hover .iui-tile-metadata:not(:last-child), .iui-tile:focus-within .iui-tile-metadata:not(:last-child){
|
|
5883
5809
|
width:calc(100% - 32px); }
|
|
5884
|
-
.iui-tile:hover .iui-tile-more-options, .iui-tile:focus-within .iui-tile-more-options{
|
|
5885
|
-
visibility:visible; }
|
|
5886
5810
|
.iui-tile:hover .iui-tile-thumbnail-picture, .iui-tile:focus-within .iui-tile-thumbnail-picture{
|
|
5887
5811
|
transform:translateZ(0) scale(1.1); }
|
|
5888
5812
|
.iui-tile.iui-new .iui-tile-name,
|
|
@@ -5893,6 +5817,13 @@ a.iui-tag{
|
|
|
5893
5817
|
background:linear-gradient(rgba(0, 139, 225, 0.1), rgba(0, 139, 225, 0.1)), linear-gradient(#FFF, #FFF);
|
|
5894
5818
|
outline:solid 2px var(--iui-color-foreground-primary);
|
|
5895
5819
|
background:linear-gradient(rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-6)), rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-6))), linear-gradient(var(--iui-color-background-1), var(--iui-color-background-1)); }
|
|
5820
|
+
.iui-tile.iui-selected:focus-visible{
|
|
5821
|
+
outline:4px solid var(--iui-color-foreground-primary);
|
|
5822
|
+
outline-offset:0; }
|
|
5823
|
+
@supports not selector(*:focus-visible){
|
|
5824
|
+
.iui-tile.iui-selected:focus{
|
|
5825
|
+
outline:4px solid var(--iui-color-foreground-primary);
|
|
5826
|
+
outline-offset:0; } }
|
|
5896
5827
|
.iui-tile.iui-selected .iui-tile-thumbnail-picture{
|
|
5897
5828
|
transform:translateZ(0) scale(1.1); }
|
|
5898
5829
|
.iui-tile.iui-folder{
|
|
@@ -6104,11 +6035,9 @@ a.iui-tag{
|
|
|
6104
6035
|
@supports ((-webkit-backdrop-filter: blur(5px)) or (backdrop-filter: blur(5px))){
|
|
6105
6036
|
.iui-tile-thumbnail-picture ~ .iui-tile-thumbnail-type-indicator,
|
|
6106
6037
|
.iui-tile-thumbnail-picture ~ .iui-tile-thumbnail-quick-action{
|
|
6107
|
-
background-color:rgba(0, 0, 0, 0.2);
|
|
6108
|
-
-webkit-backdrop-filter:blur(5px);
|
|
6109
|
-
backdrop-filter:blur(5px);
|
|
6110
6038
|
background-color:rgba(0, 0, 0, var(--iui-opacity-5));
|
|
6111
|
-
backdrop-filter:blur(5px);
|
|
6039
|
+
-webkit-backdrop-filter:blur(5px);
|
|
6040
|
+
backdrop-filter:blur(5px); } }
|
|
6112
6041
|
.iui-tile-thumbnail-picture ~ .iui-tile-thumbnail-type-indicator > .iui-button-icon,
|
|
6113
6042
|
.iui-tile-thumbnail-picture ~ .iui-tile-thumbnail-quick-action > .iui-button-icon{
|
|
6114
6043
|
fill:#FFF;
|
|
@@ -6229,16 +6158,22 @@ a.iui-tag{
|
|
|
6229
6158
|
white-space:nowrap;
|
|
6230
6159
|
overflow:hidden;
|
|
6231
6160
|
text-overflow:ellipsis; }
|
|
6232
|
-
|
|
6233
|
-
|
|
6234
|
-
|
|
6235
|
-
|
|
6161
|
+
|
|
6162
|
+
.iui-tile-more-options{
|
|
6163
|
+
position:absolute;
|
|
6164
|
+
bottom:5.5px;
|
|
6165
|
+
right:8px; }
|
|
6166
|
+
.iui-tile-more-options:not(.iui-visible){
|
|
6167
|
+
-webkit-clip-path:inset(50%);
|
|
6168
|
+
clip-path:inset(50%);
|
|
6169
|
+
overflow:hidden;
|
|
6236
6170
|
position:absolute;
|
|
6237
|
-
|
|
6238
|
-
|
|
6239
|
-
|
|
6240
|
-
|
|
6241
|
-
|
|
6171
|
+
white-space:nowrap;
|
|
6172
|
+
height:1px;
|
|
6173
|
+
width:1px;
|
|
6174
|
+
padding:0;
|
|
6175
|
+
margin:-1px;
|
|
6176
|
+
border-width:0; }
|
|
6242
6177
|
|
|
6243
6178
|
.iui-time-picker{
|
|
6244
6179
|
margin:0;
|
|
@@ -6744,10 +6679,30 @@ a.iui-tag{
|
|
|
6744
6679
|
vertical-align:baseline;
|
|
6745
6680
|
list-style:none; }
|
|
6746
6681
|
|
|
6682
|
+
.iui-tree-item:focus-visible{
|
|
6683
|
+
outline:none; }
|
|
6684
|
+
.iui-tree-item:focus-visible > .iui-tree-node{
|
|
6685
|
+
outline:1px solid var(--iui-color-foreground-primary);
|
|
6686
|
+
outline-offset:-1px; }
|
|
6687
|
+
.iui-tree-item:focus-visible > .iui-tree-node.iui-active{
|
|
6688
|
+
outline:2px solid var(--iui-color-foreground-primary);
|
|
6689
|
+
outline-offset:-2px; }
|
|
6690
|
+
|
|
6691
|
+
@supports not selector(*:focus-visible){
|
|
6692
|
+
.iui-tree-item:focus{
|
|
6693
|
+
outline:none; }
|
|
6694
|
+
.iui-tree-item:focus > .iui-tree-node{
|
|
6695
|
+
outline:1px solid var(--iui-color-foreground-primary);
|
|
6696
|
+
outline-offset:-1px; }
|
|
6697
|
+
.iui-tree-item:focus > .iui-tree-node.iui-active{
|
|
6698
|
+
outline:2px solid var(--iui-color-foreground-primary);
|
|
6699
|
+
outline-offset:-2px; } }
|
|
6700
|
+
|
|
6747
6701
|
.iui-tree-node{
|
|
6748
6702
|
display:flex;
|
|
6749
6703
|
cursor:pointer;
|
|
6750
|
-
padding:0 8px;
|
|
6704
|
+
padding:0 8px;
|
|
6705
|
+
align-items:center; }
|
|
6751
6706
|
.iui-tree-node-checkbox{
|
|
6752
6707
|
margin-right:8px; }
|
|
6753
6708
|
.iui-tree-node-content{
|
|
@@ -6800,13 +6755,6 @@ a.iui-tag{
|
|
|
6800
6755
|
font-size:12px;
|
|
6801
6756
|
color:rgba(0, 0, 0, 0.4);
|
|
6802
6757
|
color:var(--iui-text-color-muted); }
|
|
6803
|
-
.iui-tree-node:focus-visible{
|
|
6804
|
-
outline:1px solid var(--iui-color-foreground-primary);
|
|
6805
|
-
outline-offset:-1px; }
|
|
6806
|
-
@supports not selector(*:focus-visible){
|
|
6807
|
-
.iui-tree-node:focus{
|
|
6808
|
-
outline:1px solid var(--iui-color-foreground-primary);
|
|
6809
|
-
outline-offset:-1px; } }
|
|
6810
6758
|
.iui-tree-node:hover{
|
|
6811
6759
|
background-color:rgba(0, 139, 225, 0.1);
|
|
6812
6760
|
background-color:rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-6)); }
|
|
@@ -6821,13 +6769,6 @@ a.iui-tag{
|
|
|
6821
6769
|
background-color:rgba(var(--iui-color-foreground-primary-rgb), var(--iui-opacity-5));
|
|
6822
6770
|
outline:thin solid var(--iui-color-foreground-primary);
|
|
6823
6771
|
outline-offset:-1px; }
|
|
6824
|
-
.iui-tree-node.iui-active:focus-visible{
|
|
6825
|
-
outline:2px solid var(--iui-color-foreground-primary);
|
|
6826
|
-
outline-offset:-2px; }
|
|
6827
|
-
@supports not selector(*:focus-visible){
|
|
6828
|
-
.iui-tree-node.iui-active:focus{
|
|
6829
|
-
outline:2px solid var(--iui-color-foreground-primary);
|
|
6830
|
-
outline-offset:-2px; } }
|
|
6831
6772
|
.iui-tree-node.iui-disabled{
|
|
6832
6773
|
cursor:not-allowed;
|
|
6833
6774
|
outline:none;
|
|
@@ -7178,3 +7119,51 @@ a.iui-tag{
|
|
|
7178
7119
|
user-select:all;
|
|
7179
7120
|
color:#53A21A;
|
|
7180
7121
|
color:var(--iui-color-foreground-positive); }
|
|
7122
|
+
|
|
7123
|
+
.iui-skip-to-content-link{
|
|
7124
|
+
background-color:rgba(0, 0, 0, 0.8);
|
|
7125
|
+
background-color:rgba(0, 0, 0, var(--iui-opacity-2));
|
|
7126
|
+
color:#FFF;
|
|
7127
|
+
color:var(--iui-color-foreground-accessory);
|
|
7128
|
+
border-radius:9999px;
|
|
7129
|
+
text-decoration:none;
|
|
7130
|
+
-webkit-user-select:none;
|
|
7131
|
+
-moz-user-select:none;
|
|
7132
|
+
-ms-user-select:none;
|
|
7133
|
+
user-select:none;
|
|
7134
|
+
padding:8.25px 16px;
|
|
7135
|
+
position:fixed;
|
|
7136
|
+
text-align:center;
|
|
7137
|
+
left:50%;
|
|
7138
|
+
top:22px;
|
|
7139
|
+
transform:translateX(-50%) translateY(-170%);
|
|
7140
|
+
transition:background-color 0.2s ease-in-out; }
|
|
7141
|
+
@supports ((-webkit-backdrop-filter: blur(5px)) or (backdrop-filter: blur(5px))){
|
|
7142
|
+
.iui-skip-to-content-link{
|
|
7143
|
+
background-color:rgba(0, 0, 0, var(--iui-opacity-3));
|
|
7144
|
+
-webkit-backdrop-filter:blur(5px);
|
|
7145
|
+
backdrop-filter:blur(5px); } }
|
|
7146
|
+
.iui-skip-to-content-link:focus-visible{
|
|
7147
|
+
outline:2px solid var(--iui-color-foreground-primary);
|
|
7148
|
+
outline-offset:2px; }
|
|
7149
|
+
@supports not selector(*:focus-visible){
|
|
7150
|
+
.iui-skip-to-content-link:focus{
|
|
7151
|
+
outline:2px solid var(--iui-color-foreground-primary);
|
|
7152
|
+
outline-offset:2px; } }
|
|
7153
|
+
@media (prefers-reduced-motion: no-preference){
|
|
7154
|
+
.iui-skip-to-content-link{
|
|
7155
|
+
transition:background-color 0.2s ease-in-out, transform 0.8s ease-in-out, box-shadow 0.2s ease-in-out; } }
|
|
7156
|
+
.iui-skip-to-content-link:hover{
|
|
7157
|
+
background-color:black;
|
|
7158
|
+
background-color:rgba(0, 0, 0, var(--iui-opacity-1)); }
|
|
7159
|
+
@supports ((-webkit-backdrop-filter: blur(5px)) or (backdrop-filter: blur(5px))){
|
|
7160
|
+
.iui-skip-to-content-link:hover{
|
|
7161
|
+
background-color:rgba(0, 0, 0, var(--iui-opacity-2));
|
|
7162
|
+
-webkit-backdrop-filter:blur(5px);
|
|
7163
|
+
backdrop-filter:blur(5px); } }
|
|
7164
|
+
.iui-skip-to-content-link:focus{
|
|
7165
|
+
transform:translateX(-50%) translateY(0);
|
|
7166
|
+
box-shadow:0 6px 30px rgba(0, 0, 0, 0.25); }
|
|
7167
|
+
@media (prefers-reduced-motion: no-preference){
|
|
7168
|
+
.iui-skip-to-content-link:focus{
|
|
7169
|
+
transition:transform 0.2s ease-in-out; } }
|