@carbon/styles 1.12.0 → 1.13.0-rc.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/styles.css +17 -9
- package/css/styles.min.css +1 -1
- package/package.json +10 -10
- package/scss/__tests__/__snapshots__/type-test.js.snap +1448 -1365
- package/scss/__tests__/type-test.js +1 -0
- package/scss/components/form/_form.scss +2 -1
- package/scss/components/notification/_tokens.scss +8 -8
- package/scss/components/popover/_popover.scss +2 -2
- package/scss/components/toggle/_toggle.scss +2 -2
- package/scss/type/_index.scss +1 -0
package/css/styles.css
CHANGED
|
@@ -170,7 +170,7 @@ strong {
|
|
|
170
170
|
}
|
|
171
171
|
}
|
|
172
172
|
h1 {
|
|
173
|
-
font-size: var(--cds-heading-06-font-size,
|
|
173
|
+
font-size: var(--cds-heading-06-font-size, 2.625rem);
|
|
174
174
|
font-weight: var(--cds-heading-06-font-weight, 300);
|
|
175
175
|
line-height: var(--cds-heading-06-line-height, 1.199);
|
|
176
176
|
letter-spacing: var(--cds-heading-06-letter-spacing, 0);
|
|
@@ -3215,6 +3215,10 @@ em {
|
|
|
3215
3215
|
--cds-button-secondary-hover: #5e5e5e;
|
|
3216
3216
|
--cds-button-tertiary-hover: #f4f4f4;
|
|
3217
3217
|
--cds-button-disabled: rgba(141, 141, 141, 0.3);
|
|
3218
|
+
--cds-notification-background-error: #393939;
|
|
3219
|
+
--cds-notification-background-success: #393939;
|
|
3220
|
+
--cds-notification-background-info: #393939;
|
|
3221
|
+
--cds-notification-background-warning: #393939;
|
|
3218
3222
|
--cds-notification-action-tertiary-inverse: #0f62fe;
|
|
3219
3223
|
--cds-notification-action-tertiary-inverse-active: #002d9c;
|
|
3220
3224
|
--cds-notification-action-tertiary-inverse-hover: #0050e6;
|
|
@@ -3379,6 +3383,10 @@ em {
|
|
|
3379
3383
|
--cds-button-secondary-hover: #5e5e5e;
|
|
3380
3384
|
--cds-button-tertiary-hover: #f4f4f4;
|
|
3381
3385
|
--cds-button-disabled: rgba(141, 141, 141, 0.3);
|
|
3386
|
+
--cds-notification-background-error: #262626;
|
|
3387
|
+
--cds-notification-background-success: #262626;
|
|
3388
|
+
--cds-notification-background-info: #262626;
|
|
3389
|
+
--cds-notification-background-warning: #262626;
|
|
3382
3390
|
--cds-notification-action-tertiary-inverse: #0f62fe;
|
|
3383
3391
|
--cds-notification-action-tertiary-inverse-active: #002d9c;
|
|
3384
3392
|
--cds-notification-action-tertiary-inverse-hover: #0050e6;
|
|
@@ -4974,7 +4982,7 @@ input[data-invalid]:not(:focus),
|
|
|
4974
4982
|
.cds--text-area__wrapper[data-invalid] > .cds--text-area--invalid:not(:focus),
|
|
4975
4983
|
.cds--select-input__wrapper[data-invalid] .cds--select-input:not(:focus),
|
|
4976
4984
|
.cds--list-box[data-invalid]:not(:focus),
|
|
4977
|
-
.cds--combo-box[data-invalid] .cds--text-input:not(:focus) {
|
|
4985
|
+
.cds--combo-box[data-invalid]:not(.cds--multi-select--selected) .cds--text-input:not(:focus) {
|
|
4978
4986
|
outline: 2px solid var(--cds-support-error, #da1e28);
|
|
4979
4987
|
outline-offset: -2px;
|
|
4980
4988
|
}
|
|
@@ -4985,7 +4993,7 @@ input[data-invalid]:not(:focus),
|
|
|
4985
4993
|
.cds--text-area__wrapper[data-invalid] > .cds--text-area--invalid:not(:focus),
|
|
4986
4994
|
.cds--select-input__wrapper[data-invalid] .cds--select-input:not(:focus),
|
|
4987
4995
|
.cds--list-box[data-invalid]:not(:focus),
|
|
4988
|
-
.cds--combo-box[data-invalid] .cds--text-input:not(:focus) {
|
|
4996
|
+
.cds--combo-box[data-invalid]:not(.cds--multi-select--selected) .cds--text-input:not(:focus) {
|
|
4989
4997
|
outline-style: dotted;
|
|
4990
4998
|
}
|
|
4991
4999
|
}
|
|
@@ -16482,15 +16490,15 @@ span.cds--pagination__text.cds--pagination__items-count {
|
|
|
16482
16490
|
.cds--popover--left-top .cds--popover-content {
|
|
16483
16491
|
top: -50%;
|
|
16484
16492
|
right: 100%;
|
|
16485
|
-
-webkit-transform: translate(calc(-1 * var(--cds-popover-offset, 0rem)), calc(-0.5 * var(--cds-popover-offset, 0rem)
|
|
16486
|
-
transform: translate(calc(-1 * var(--cds-popover-offset, 0rem)), calc(-0.5 * var(--cds-popover-offset, 0rem)
|
|
16493
|
+
-webkit-transform: translate(calc(-1 * var(--cds-popover-offset, 0rem)), calc(-0.5 * var(--cds-popover-offset, 0rem)));
|
|
16494
|
+
transform: translate(calc(-1 * var(--cds-popover-offset, 0rem)), calc(-0.5 * var(--cds-popover-offset, 0rem)));
|
|
16487
16495
|
}
|
|
16488
16496
|
|
|
16489
16497
|
.cds--popover--left-bottom .cds--popover-content {
|
|
16490
16498
|
right: 100%;
|
|
16491
16499
|
bottom: -50%;
|
|
16492
|
-
-webkit-transform: translate(calc(-1 * var(--cds-popover-offset, 0rem)), calc(0.5 * var(--cds-popover-offset, 0rem)
|
|
16493
|
-
transform: translate(calc(-1 * var(--cds-popover-offset, 0rem)), calc(0.5 * var(--cds-popover-offset, 0rem)
|
|
16500
|
+
-webkit-transform: translate(calc(-1 * var(--cds-popover-offset, 0rem)), calc(0.5 * var(--cds-popover-offset, 0rem)));
|
|
16501
|
+
transform: translate(calc(-1 * var(--cds-popover-offset, 0rem)), calc(0.5 * var(--cds-popover-offset, 0rem)));
|
|
16494
16502
|
}
|
|
16495
16503
|
|
|
16496
16504
|
.cds--popover--left .cds--popover-content::before,
|
|
@@ -19902,7 +19910,7 @@ span.cds--pagination__text.cds--pagination__items-count {
|
|
|
19902
19910
|
}
|
|
19903
19911
|
|
|
19904
19912
|
.cds--toggle__button:focus + .cds--toggle__label .cds--toggle__switch,
|
|
19905
|
-
.cds--toggle__button:active + .cds--toggle__label .cds--toggle__switch {
|
|
19913
|
+
.cds--toggle__button:not(:disabled):active + .cds--toggle__label .cds--toggle__switch {
|
|
19906
19914
|
-webkit-box-shadow: 0 0 0 1px var(--cds-focus-inset, #ffffff), 0 0 0 3px var(--cds-focus, #0f62fe);
|
|
19907
19915
|
box-shadow: 0 0 0 1px var(--cds-focus-inset, #ffffff), 0 0 0 3px var(--cds-focus, #0f62fe);
|
|
19908
19916
|
}
|
|
@@ -19980,7 +19988,7 @@ span.cds--pagination__text.cds--pagination__items-count {
|
|
|
19980
19988
|
|
|
19981
19989
|
@media screen and (-ms-high-contrast: active), (forced-colors: active) {
|
|
19982
19990
|
.cds--toggle__button:focus + .cds--toggle__label .cds--toggle__switch,
|
|
19983
|
-
.cds--toggle__button:active + .cds--toggle__label .cds--toggle__switch {
|
|
19991
|
+
.cds--toggle__button:not(:disabled):active + .cds--toggle__label .cds--toggle__switch {
|
|
19984
19992
|
color: Highlight;
|
|
19985
19993
|
outline: 1px solid Highlight;
|
|
19986
19994
|
}
|