@deque/cauldron-styles 6.5.0 → 6.6.0-canary.8cea8521
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.css +62 -12
- package/package.json +1 -1
package/dist/index.css
CHANGED
|
@@ -915,6 +915,17 @@ textarea.Field--has-error:focus:hover,
|
|
|
915
915
|
appearance: none;
|
|
916
916
|
}
|
|
917
917
|
|
|
918
|
+
.Checkbox input[type='checkbox']:indeterminate ~ .Checkbox__overlay.Icon {
|
|
919
|
+
color: var(--field-icon-checked-color);
|
|
920
|
+
}
|
|
921
|
+
|
|
922
|
+
.Checkbox
|
|
923
|
+
input[type='checkbox']:indeterminate
|
|
924
|
+
~ .Checkbox__overlay--disabled.Icon {
|
|
925
|
+
color: var(--field-icon-checked-disabled-color);
|
|
926
|
+
cursor: default;
|
|
927
|
+
}
|
|
928
|
+
|
|
918
929
|
.Checkbox__overlay.Checkbox__overlay--focused,
|
|
919
930
|
.Radio__overlay.Radio__overlay--focused {
|
|
920
931
|
box-shadow: 0 0 0 2px var(--field-icon-focus-color);
|
|
@@ -942,6 +953,29 @@ textarea.Field--has-error:focus:hover,
|
|
|
942
953
|
border: 1px solid currentColor;
|
|
943
954
|
}
|
|
944
955
|
|
|
956
|
+
.Checkbox input[type='checkbox']:indeterminate ~ .Checkbox__overlay:before {
|
|
957
|
+
content: '';
|
|
958
|
+
display: block;
|
|
959
|
+
position: absolute;
|
|
960
|
+
height: calc(var(--icon-size) - 8px);
|
|
961
|
+
width: calc(var(--icon-size) - 8px);
|
|
962
|
+
background: currentColor;
|
|
963
|
+
transform: translate(4px, 4px);
|
|
964
|
+
}
|
|
965
|
+
|
|
966
|
+
.Checkbox input[type='checkbox']:indeterminate ~ .Checkbox__overlay:after {
|
|
967
|
+
content: '';
|
|
968
|
+
display: block;
|
|
969
|
+
position: absolute;
|
|
970
|
+
height: 3px;
|
|
971
|
+
width: calc(var(--icon-size) / 3);
|
|
972
|
+
background-color: var(--field-background-color);
|
|
973
|
+
transform: translate(
|
|
974
|
+
calc(var(--icon-size) / 3),
|
|
975
|
+
calc(var(--icon-size) / 2 * -1 - 1.5px)
|
|
976
|
+
);
|
|
977
|
+
}
|
|
978
|
+
|
|
945
979
|
.Checkbox input[type='checkbox'] {
|
|
946
980
|
position: absolute;
|
|
947
981
|
opacity: 0;
|
|
@@ -1231,7 +1265,7 @@ button.Link {
|
|
|
1231
1265
|
}
|
|
1232
1266
|
|
|
1233
1267
|
.Button--tag:before {
|
|
1234
|
-
border-radius:
|
|
1268
|
+
border-radius: var(--button-height);
|
|
1235
1269
|
}
|
|
1236
1270
|
|
|
1237
1271
|
.Button--primary:not([disabled]):not([aria-disabled='true']):hover:before {
|
|
@@ -1364,6 +1398,15 @@ button.Link {
|
|
|
1364
1398
|
padding: 0 var(--space-small);
|
|
1365
1399
|
}
|
|
1366
1400
|
|
|
1401
|
+
.Button--condensed {
|
|
1402
|
+
min-width: var(--button-height);
|
|
1403
|
+
padding: 0;
|
|
1404
|
+
}
|
|
1405
|
+
|
|
1406
|
+
.Button--condensed:is(.Button--thin) {
|
|
1407
|
+
min-width: var(--button-thin-height);
|
|
1408
|
+
}
|
|
1409
|
+
|
|
1367
1410
|
[class*='Button--'] + [class*='Button--'] {
|
|
1368
1411
|
margin-left: var(--space-smallest);
|
|
1369
1412
|
}
|
|
@@ -3495,9 +3538,12 @@ button.TooltipTabstop {
|
|
|
3495
3538
|
|
|
3496
3539
|
:root {
|
|
3497
3540
|
--tag-text-color: var(--gray-90);
|
|
3498
|
-
--tag-
|
|
3499
|
-
--tag-
|
|
3500
|
-
|
|
3541
|
+
--tag-background-color: var(--background-light);
|
|
3542
|
+
--tag-border-color: var(--gray-30);
|
|
3543
|
+
|
|
3544
|
+
--tag-height: var(--button-height);
|
|
3545
|
+
--tag-small-height: 1.5rem;
|
|
3546
|
+
--tag-font-size: var(--text-size-body-small);
|
|
3501
3547
|
}
|
|
3502
3548
|
|
|
3503
3549
|
.cauldron--theme-dark {
|
|
@@ -3510,20 +3556,24 @@ button.TooltipTabstop {
|
|
|
3510
3556
|
.Tag {
|
|
3511
3557
|
color: var(--tag-text-color);
|
|
3512
3558
|
background-color: var(--tag-background-color);
|
|
3513
|
-
font-size: var(--text-size-smaller);
|
|
3514
3559
|
border: 1px solid var(--tag-border-color);
|
|
3515
|
-
border-radius:
|
|
3560
|
+
border-radius: var(--tag-height);
|
|
3516
3561
|
display: inline-flex;
|
|
3517
3562
|
justify-content: center;
|
|
3518
3563
|
align-items: center;
|
|
3519
|
-
padding:
|
|
3520
|
-
|
|
3564
|
+
padding: 0 var(--space-smallest);
|
|
3565
|
+
min-height: var(--tag-height);
|
|
3566
|
+
font-size: var(--tag-font-size);
|
|
3567
|
+
}
|
|
3568
|
+
|
|
3569
|
+
.Tag--small {
|
|
3570
|
+
border-radius: var(--tag-small-height);
|
|
3571
|
+
min-height: var(--tag-small-height);
|
|
3521
3572
|
}
|
|
3522
3573
|
|
|
3523
3574
|
.Tag__label {
|
|
3524
|
-
color: var(--tag-label-text-color);
|
|
3525
3575
|
margin-right: 3px;
|
|
3526
|
-
font-weight: var(--font-weight-
|
|
3576
|
+
font-weight: var(--font-weight-medium);
|
|
3527
3577
|
}
|
|
3528
3578
|
|
|
3529
3579
|
:root {
|
|
@@ -5052,7 +5102,7 @@ button.Accordion__trigger {
|
|
|
5052
5102
|
--combobox-option-min-height: 2.625rem;
|
|
5053
5103
|
--combobox-group-label-background-color: var(--gray-20);
|
|
5054
5104
|
--combobox-group-label-font-size: var(--text-size-smaller);
|
|
5055
|
-
--combobox-option-selected-icon-color: var(--accent-
|
|
5105
|
+
--combobox-option-selected-icon-color: var(--accent-primary);
|
|
5056
5106
|
}
|
|
5057
5107
|
|
|
5058
5108
|
.cauldron--theme-dark {
|
|
@@ -5061,7 +5111,7 @@ button.Accordion__trigger {
|
|
|
5061
5111
|
--combobox-option-description-font-color: var(--accent-light);
|
|
5062
5112
|
--combobox-listbox-background-color: var(--accent-medium);
|
|
5063
5113
|
--combobox-group-label-background-color: var(--accent-dark);
|
|
5064
|
-
--combobox-option-selected-icon-color: var(--accent-
|
|
5114
|
+
--combobox-option-selected-icon-color: var(--accent-info);
|
|
5065
5115
|
}
|
|
5066
5116
|
|
|
5067
5117
|
.Combobox :where(.TextFieldWrapper) {
|