@carbon/styles 1.93.0 → 1.94.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/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@carbon/styles",
|
|
3
3
|
"description": "Styles for the Carbon Design System",
|
|
4
|
-
"version": "1.
|
|
4
|
+
"version": "1.94.0-rc.0",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"repository": {
|
|
7
7
|
"type": "git",
|
|
@@ -41,7 +41,7 @@
|
|
|
41
41
|
},
|
|
42
42
|
"dependencies": {
|
|
43
43
|
"@carbon/colors": "^11.42.0",
|
|
44
|
-
"@carbon/feature-flags": "
|
|
44
|
+
"@carbon/feature-flags": "0.32.0",
|
|
45
45
|
"@carbon/grid": "^11.45.0",
|
|
46
46
|
"@carbon/layout": "^11.43.0",
|
|
47
47
|
"@carbon/motion": "^11.37.0",
|
|
@@ -67,7 +67,7 @@
|
|
|
67
67
|
"postcss": "^8.5.6",
|
|
68
68
|
"postcss-flexbugs-fixes": "^5.0.2",
|
|
69
69
|
"rimraf": "^6.0.1",
|
|
70
|
-
"sass": "^1.
|
|
70
|
+
"sass": "^1.93.2"
|
|
71
71
|
},
|
|
72
72
|
"sideEffects": [
|
|
73
73
|
"index.scss",
|
|
@@ -75,5 +75,5 @@
|
|
|
75
75
|
"scss/**/*.css",
|
|
76
76
|
"css/**/*.css"
|
|
77
77
|
],
|
|
78
|
-
"gitHead": "
|
|
78
|
+
"gitHead": "ba9072cd72b1d664f26a3c984e2f7d694280175b"
|
|
79
79
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
//
|
|
2
|
-
// Copyright IBM Corp. 2016,
|
|
2
|
+
// Copyright IBM Corp. 2016, 2025
|
|
3
3
|
//
|
|
4
4
|
// This source code is licensed under the Apache-2.0 license found in the
|
|
5
5
|
// LICENSE file in the root directory of this source tree.
|
|
@@ -338,7 +338,7 @@ $list-box-menu-width: convert.to-rem(300px);
|
|
|
338
338
|
|
|
339
339
|
// populated input field
|
|
340
340
|
.#{$prefix}--list-box__field .#{$prefix}--text-input {
|
|
341
|
-
padding-inline-end: convert.to-rem(
|
|
341
|
+
padding-inline-end: convert.to-rem(70px);
|
|
342
342
|
}
|
|
343
343
|
|
|
344
344
|
// invalid && populated input field
|
|
@@ -906,16 +906,20 @@ $list-box-menu-width: convert.to-rem(300px);
|
|
|
906
906
|
transform: translateY(-50%);
|
|
907
907
|
}
|
|
908
908
|
|
|
909
|
-
.#{$prefix}--list-box__wrapper--decorator
|
|
909
|
+
.#{$prefix}--list-box__wrapper--decorator:has(
|
|
910
|
+
.#{$prefix}--list-box__invalid-icon
|
|
911
|
+
)
|
|
910
912
|
.#{$prefix}--list-box__inner-wrapper--decorator
|
|
911
|
-
> *::
|
|
913
|
+
> *::before,
|
|
914
|
+
.#{$prefix}--list-box__wrapper--slug:has(.#{$prefix}--list-box__invalid-icon)
|
|
915
|
+
.#{$prefix}--ai-label::before,
|
|
916
|
+
.#{$prefix}--list-box__wrapper--slug:has(.#{$prefix}--list-box__invalid-icon)
|
|
917
|
+
.#{$prefix}--slug::before,
|
|
912
918
|
.#{$prefix}--list-box__wrapper--decorator
|
|
913
919
|
.#{$prefix}--list-box__inner-wrapper--decorator
|
|
914
|
-
> *::
|
|
920
|
+
> *::after,
|
|
915
921
|
.#{$prefix}--list-box__wrapper--slug .#{$prefix}--ai-label::after,
|
|
916
|
-
.#{$prefix}--list-box__wrapper--slug .#{$prefix}--
|
|
917
|
-
.#{$prefix}--list-box__wrapper--slug .#{$prefix}--slug::after,
|
|
918
|
-
.#{$prefix}--list-box__wrapper--slug .#{$prefix}--slug::before {
|
|
922
|
+
.#{$prefix}--list-box__wrapper--slug .#{$prefix}--slug::after {
|
|
919
923
|
position: absolute;
|
|
920
924
|
background-color: $border-subtle-01;
|
|
921
925
|
block-size: convert.to-rem(16px);
|
|
@@ -932,16 +936,31 @@ $list-box-menu-width: convert.to-rem(300px);
|
|
|
932
936
|
inset-inline-start: convert.to-rem(-9px);
|
|
933
937
|
}
|
|
934
938
|
|
|
939
|
+
.#{$prefix}--list-box__wrapper--decorator
|
|
940
|
+
.#{$prefix}--list-box__inner-wrapper--decorator
|
|
941
|
+
> *::before,
|
|
942
|
+
.#{$prefix}--list-box__wrapper--slug .#{$prefix}--ai-label::before,
|
|
943
|
+
.#{$prefix}--list-box__wrapper--slug .#{$prefix}--slug::before,
|
|
944
|
+
.#{$prefix}--list-box__wrapper--decorator
|
|
945
|
+
.#{$prefix}--list-box__inner-wrapper--decorator
|
|
946
|
+
.#{$prefix}--ai-label--revert::before,
|
|
947
|
+
.#{$prefix}--list-box__wrapper--slug .#{$prefix}--ai-label--revert::before,
|
|
948
|
+
.#{$prefix}--list-box__wrapper--slug .#{$prefix}--slug--revert::before,
|
|
935
949
|
.#{$prefix}--list-box__wrapper--decorator
|
|
936
950
|
.#{$prefix}--list-box__inner-wrapper--decorator
|
|
937
951
|
> *::after,
|
|
938
952
|
.#{$prefix}--list-box__wrapper--slug .#{$prefix}--ai-label::after,
|
|
939
953
|
.#{$prefix}--list-box__wrapper--slug .#{$prefix}--slug::after {
|
|
940
954
|
display: block;
|
|
941
|
-
inset-block-start:
|
|
955
|
+
inset-block-start: convert.to-rem(1px);
|
|
942
956
|
inset-inline-end: convert.to-rem(-9px);
|
|
943
957
|
}
|
|
944
958
|
|
|
959
|
+
.#{$prefix}--list-box__wrapper--decorator
|
|
960
|
+
.#{$prefix}--list-box__inner-wrapper--decorator
|
|
961
|
+
.#{$prefix}--ai-label--revert::before,
|
|
962
|
+
.#{$prefix}--list-box__wrapper--slug .#{$prefix}--ai-label--revert::before,
|
|
963
|
+
.#{$prefix}--list-box__wrapper--slug .#{$prefix}--slug--revert::before,
|
|
945
964
|
.#{$prefix}--list-box__wrapper--decorator
|
|
946
965
|
.#{$prefix}--list-box__inner-wrapper--decorator
|
|
947
966
|
.#{$prefix}--ai-label--revert::after,
|
|
@@ -991,7 +1010,7 @@ $list-box-menu-width: convert.to-rem(300px);
|
|
|
991
1010
|
.#{$prefix}--text-input:not(.#{$prefix}--text-input--empty),
|
|
992
1011
|
.#{$prefix}--list-box__wrapper--slug
|
|
993
1012
|
.#{$prefix}--text-input:not(.#{$prefix}--text-input--empty) {
|
|
994
|
-
padding-inline-end:
|
|
1013
|
+
padding-inline-end: convert.to-rem(105px);
|
|
995
1014
|
}
|
|
996
1015
|
|
|
997
1016
|
.#{$prefix}--list-box__wrapper--decorator
|
|
@@ -1033,7 +1052,7 @@ $list-box-menu-width: convert.to-rem(300px);
|
|
|
1033
1052
|
.#{$prefix}--list-box__wrapper--slug
|
|
1034
1053
|
.#{$prefix}--list-box--warning
|
|
1035
1054
|
.#{$prefix}--text-input:not(.#{$prefix}--text-input--empty) {
|
|
1036
|
-
padding-inline-end: convert.to-rem(
|
|
1055
|
+
padding-inline-end: convert.to-rem(137px);
|
|
1037
1056
|
}
|
|
1038
1057
|
|
|
1039
1058
|
.#{$prefix}--list-box__wrapper--decorator
|
|
@@ -1056,7 +1075,7 @@ $list-box-menu-width: convert.to-rem(300px);
|
|
|
1056
1075
|
.#{$prefix}--list-box__wrapper--slug
|
|
1057
1076
|
.#{$prefix}--list-box--warning
|
|
1058
1077
|
.#{$prefix}--list-box__invalid-icon.#{$prefix}--list-box__invalid-icon--warning {
|
|
1059
|
-
inset-inline-end: convert.to-rem(
|
|
1078
|
+
inset-inline-end: convert.to-rem(81px);
|
|
1060
1079
|
}
|
|
1061
1080
|
|
|
1062
1081
|
.#{$prefix}--list-box__wrapper--decorator
|
|
@@ -1112,6 +1131,13 @@ $list-box-menu-width: convert.to-rem(300px);
|
|
|
1112
1131
|
inset-inline-end: calc($spacing-10 + 18px);
|
|
1113
1132
|
}
|
|
1114
1133
|
|
|
1134
|
+
.#{$prefix}--list-box__wrapper--decorator
|
|
1135
|
+
.#{$prefix}--list-box__field:has(.#{$prefix}--list-box__selection)
|
|
1136
|
+
~ .#{$prefix}--list-box__inner-wrapper--decorator
|
|
1137
|
+
> * {
|
|
1138
|
+
inset-inline-end: calc($spacing-10 + 18px);
|
|
1139
|
+
}
|
|
1140
|
+
|
|
1115
1141
|
.#{$prefix}--list-box__wrapper--decorator
|
|
1116
1142
|
.#{$prefix}--list-box--invalid
|
|
1117
1143
|
.#{$prefix}--list-box__field:has(.#{$prefix}--list-box__selection)
|
|
@@ -1128,9 +1154,20 @@ $list-box-menu-width: convert.to-rem(300px);
|
|
|
1128
1154
|
.#{$prefix}--list-box--warning
|
|
1129
1155
|
.#{$prefix}--list-box__field:has(.#{$prefix}--list-box__selection)
|
|
1130
1156
|
.#{$prefix}--list-box__invalid-icon {
|
|
1157
|
+
inset-inline-end: convert.to-rem(114px);
|
|
1158
|
+
}
|
|
1159
|
+
.#{$prefix}--list-box__wrapper--decorator
|
|
1160
|
+
.#{$prefix}--list-box--invalid
|
|
1161
|
+
.#{$prefix}--list-box__field:has(.#{$prefix}--list-box__selection)
|
|
1162
|
+
~ .#{$prefix}--list-box__inner-wrapper--decorator
|
|
1163
|
+
> *,
|
|
1164
|
+
.#{$prefix}--list-box__wrapper--decorator
|
|
1165
|
+
.#{$prefix}--list-box--warning
|
|
1166
|
+
.#{$prefix}--list-box__field:has(.#{$prefix}--list-box__selection)
|
|
1167
|
+
~ .#{$prefix}--list-box__inner-wrapper--decorator
|
|
1168
|
+
> * {
|
|
1131
1169
|
inset-inline-end: convert.to-rem(116px);
|
|
1132
1170
|
}
|
|
1133
|
-
|
|
1134
1171
|
// Windows HCM fix
|
|
1135
1172
|
.#{$prefix}--list-box__field,
|
|
1136
1173
|
.#{$prefix}--list-box__menu,
|
|
@@ -39,6 +39,14 @@
|
|
|
39
39
|
visibility: hidden;
|
|
40
40
|
}
|
|
41
41
|
|
|
42
|
+
.#{$prefix}--menu--border {
|
|
43
|
+
outline: 1px solid $border-subtle;
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
.#{$prefix}--menu--background-token__background {
|
|
47
|
+
background-color: $background;
|
|
48
|
+
}
|
|
49
|
+
|
|
42
50
|
.#{$prefix}--menu--with-icons {
|
|
43
51
|
min-inline-size: 12rem;
|
|
44
52
|
}
|
|
@@ -119,7 +119,7 @@ $popover-caret-height: custom-property.get-var(
|
|
|
119
119
|
|
|
120
120
|
// Border modifier
|
|
121
121
|
.#{$prefix}--popover--border
|
|
122
|
-
.#{$prefix}--popover
|
|
122
|
+
> .#{$prefix}--popover
|
|
123
123
|
> .#{$prefix}--popover-content {
|
|
124
124
|
outline: 1px solid $popover-border-color;
|
|
125
125
|
outline-offset: -1px;
|
|
@@ -175,7 +175,8 @@ $popover-caret-height: custom-property.get-var(
|
|
|
175
175
|
}
|
|
176
176
|
|
|
177
177
|
.#{$prefix}--popover--background-token__background
|
|
178
|
-
.#{$prefix}--popover
|
|
178
|
+
> .#{$prefix}--popover
|
|
179
|
+
> .#{$prefix}--popover-content {
|
|
179
180
|
background-color: theme.$background;
|
|
180
181
|
}
|
|
181
182
|
|
|
@@ -225,7 +226,8 @@ $popover-caret-height: custom-property.get-var(
|
|
|
225
226
|
}
|
|
226
227
|
|
|
227
228
|
.#{$prefix}--popover--background-token__background
|
|
228
|
-
.#{$prefix}--popover
|
|
229
|
+
> .#{$prefix}--popover
|
|
230
|
+
> .#{$prefix}--popover-caret::after {
|
|
229
231
|
background-color: theme.$background;
|
|
230
232
|
}
|
|
231
233
|
|