@carbon/ibm-products 2.29.0-alpha.10 → 2.30.0-alpha.9

Sign up to get free protection for your applications and to get access to all the features.
Files changed (68) hide show
  1. package/css/index-full-carbon.css +1405 -3
  2. package/css/index-full-carbon.css.map +1 -1
  3. package/css/index-full-carbon.min.css +1 -1
  4. package/css/index-full-carbon.min.css.map +1 -1
  5. package/css/index-without-carbon-released-only.css +39 -3
  6. package/css/index-without-carbon-released-only.css.map +1 -1
  7. package/css/index-without-carbon-released-only.min.css +1 -1
  8. package/css/index-without-carbon-released-only.min.css.map +1 -1
  9. package/css/index-without-carbon.css +1405 -3
  10. package/css/index-without-carbon.css.map +1 -1
  11. package/css/index-without-carbon.min.css +1 -1
  12. package/css/index-without-carbon.min.css.map +1 -1
  13. package/css/index.css +1405 -3
  14. package/css/index.css.map +1 -1
  15. package/css/index.min.css +1 -1
  16. package/css/index.min.css.map +1 -1
  17. package/es/components/AboutModal/AboutModal.d.ts +73 -2
  18. package/es/components/AboutModal/AboutModal.js +10 -28
  19. package/es/components/DataSpreadsheet/DataSpreadsheet.js +120 -145
  20. package/es/components/Datagrid/Datagrid/DatagridRow.js +1 -1
  21. package/es/components/Datagrid/Datagrid/addons/Filtering/hooks/useFilters.js +6 -3
  22. package/es/components/Datagrid/useActionsColumn.js +6 -2
  23. package/es/components/Decorator/Decorator.d.ts +5 -0
  24. package/es/components/Decorator/Decorator.js +348 -0
  25. package/es/components/Decorator/DecoratorIcon.d.ts +5 -0
  26. package/es/components/Decorator/DecoratorIcon.js +95 -0
  27. package/es/components/Decorator/index.d.ts +1 -0
  28. package/es/components/Decorator/utils.d.ts +8 -0
  29. package/es/components/Decorator/utils.js +43 -0
  30. package/es/components/Toolbar/ToolbarButton.d.ts +24 -3
  31. package/es/components/Toolbar/ToolbarButton.js +2 -2
  32. package/es/components/index.d.ts +1 -0
  33. package/es/global/js/package-settings.d.ts +1 -0
  34. package/es/global/js/package-settings.js +1 -0
  35. package/es/index.js +1 -0
  36. package/es/settings.d.ts +1 -0
  37. package/lib/components/AboutModal/AboutModal.d.ts +73 -2
  38. package/lib/components/AboutModal/AboutModal.js +8 -26
  39. package/lib/components/DataSpreadsheet/DataSpreadsheet.js +120 -145
  40. package/lib/components/Datagrid/Datagrid/DatagridRow.js +1 -1
  41. package/lib/components/Datagrid/Datagrid/addons/Filtering/hooks/useFilters.js +6 -3
  42. package/lib/components/Datagrid/useActionsColumn.js +6 -2
  43. package/lib/components/Decorator/Decorator.d.ts +5 -0
  44. package/lib/components/Decorator/Decorator.js +355 -0
  45. package/lib/components/Decorator/DecoratorIcon.d.ts +5 -0
  46. package/lib/components/Decorator/DecoratorIcon.js +102 -0
  47. package/lib/components/Decorator/index.d.ts +1 -0
  48. package/lib/components/Decorator/utils.d.ts +8 -0
  49. package/lib/components/Decorator/utils.js +48 -0
  50. package/lib/components/Toolbar/ToolbarButton.d.ts +24 -3
  51. package/lib/components/Toolbar/ToolbarButton.js +2 -2
  52. package/lib/components/index.d.ts +1 -0
  53. package/lib/global/js/package-settings.d.ts +1 -0
  54. package/lib/global/js/package-settings.js +1 -0
  55. package/lib/index.js +5 -0
  56. package/lib/settings.d.ts +1 -0
  57. package/package.json +5 -5
  58. package/scss/components/AboutModal/_about-modal.scss +7 -2
  59. package/scss/components/Datagrid/styles/_useExpandedRow.scss +8 -0
  60. package/scss/components/Datagrid/styles/_useNestedRows.scss +54 -0
  61. package/scss/components/Datagrid/styles/addons/_FilterPanel.scss +1 -1
  62. package/scss/components/Decorator/_carbon-imports.scss +9 -0
  63. package/scss/components/Decorator/_decorator.scss +400 -0
  64. package/scss/components/Decorator/_index-with-carbon.scss +9 -0
  65. package/scss/components/Decorator/_index.scss +8 -0
  66. package/scss/components/TagSet/_tag-set.scss +1 -0
  67. package/scss/components/_index-with-carbon.scss +1 -0
  68. package/scss/components/_index.scss +1 -0
@@ -41,9 +41,14 @@ $block-class: #{c4p-settings.$pkg-prefix}--about-modal;
41
41
 
42
42
  overflow: hidden auto;
43
43
  min-height: $spacing-10;
44
- padding: 0 20% 0 $spacing-05;
45
- margin-bottom: $spacing-06;
46
44
  grid-row: auto;
45
+ padding-block-start: 0;
46
+ padding-inline: $spacing-05 20%;
47
+
48
+ &:not(.#{c4p-settings.$carbon-prefix}--modal-scroll-content) {
49
+ margin-bottom: $spacing-06;
50
+ padding-block-end: 0;
51
+ }
47
52
  }
48
53
 
49
54
  .#{$block-class}
@@ -69,6 +69,7 @@
69
69
  .#{variables.$block-class}
70
70
  .#{variables.$block-class}__expandable-row--hover
71
71
  td {
72
+ border-top: none;
72
73
  background: $layer-hover;
73
74
  }
74
75
 
@@ -87,6 +88,13 @@
87
88
  border: none;
88
89
  }
89
90
 
91
+ .#{variables.$block-class}
92
+ .#{c4p-settings.$carbon-prefix}--data-table
93
+ .#{variables.$block-class}__carbon-row-expanded:hover
94
+ td:not(.#{variables.$block-class}__expandable-row-cell) {
95
+ border-bottom: 1px solid $border-subtle-02;
96
+ }
97
+
90
98
  .#{variables.$block-class}
91
99
  .#{c4p-settings.$carbon-prefix}--data-table
92
100
  td.#{variables.$block-class}__expanded-row-cell-wrapper {
@@ -64,6 +64,60 @@
64
64
  padding-left: $spacing-03;
65
65
  }
66
66
 
67
+ .#{c4p-settings.$carbon-prefix}--data-table
68
+ td.#{$block-class}__expandable-row-cell
69
+ + td,
70
+ .#{c4p-settings.$carbon-prefix}--data-table
71
+ .#{$block-class}__carbon-nested-row:not(
72
+ .#{$block-class}__carbon-row-expandable
73
+ )
74
+ td.#{$block-class}__cell:nth-of-type(2) {
75
+ position: relative;
76
+ }
77
+
78
+ .#{c4p-settings.$carbon-prefix}--data-table
79
+ td.#{$block-class}__expandable-row-cell.#{$block-class}__expandable-row-cell--is-expanded
80
+ + td::before,
81
+ .#{c4p-settings.$carbon-prefix}--data-table
82
+ .#{$block-class}__carbon-nested-row:not(
83
+ .#{$block-class}__carbon-row-expandable
84
+ )
85
+ td.#{$block-class}__cell:nth-of-type(2)::before,
86
+ .#{c4p-settings.$carbon-prefix}--data-table
87
+ .#{$block-class}__carbon-nested-row
88
+ td.#{$block-class}__expandable-row-cell
89
+ + td::before {
90
+ position: absolute;
91
+ /* stylelint-disable-next-line carbon/layout-token-use */
92
+ bottom: -1px;
93
+ left: 0;
94
+ width: 1rem;
95
+ height: 1px;
96
+ background-color: $layer-01;
97
+ content: '';
98
+ transition: background-color $duration-fast-01 motion(entrance, productive);
99
+ }
100
+
101
+ .#{c4p-settings.$carbon-prefix}--data-table
102
+ tr:hover
103
+ td.#{$block-class}__expandable-row-cell.#{$block-class}__expandable-row-cell--is-expanded
104
+ + td::before,
105
+ .#{c4p-settings.$carbon-prefix}--data-table
106
+ .#{$block-class}__carbon-nested-row:hover
107
+ td.#{$block-class}__expandable-row-cell
108
+ + td::before,
109
+ .#{c4p-settings.$carbon-prefix}--data-table
110
+ .#{$block-class}__expandable-row--hover
111
+ td.#{$block-class}__expandable-row-cell
112
+ + td::before,
113
+ .#{c4p-settings.$carbon-prefix}--data-table
114
+ .#{$block-class}__carbon-nested-row:hover:not(
115
+ .#{$block-class}__carbon-row-expandable
116
+ )
117
+ td.#{$block-class}__cell:nth-of-type(2)::before {
118
+ background-color: $layer-hover;
119
+ }
120
+
67
121
  .#{$block-class}__carbon-row-expanded {
68
122
  .#{$block-class}__expandable-row-cell {
69
123
  border-bottom: none;
@@ -41,7 +41,7 @@
41
41
  position: relative;
42
42
  z-index: 0;
43
43
  overflow: auto;
44
- padding: 0 $spacing-05;
44
+ padding: 0 $spacing-05 $spacing-10 $spacing-05;
45
45
  overscroll-behavior: contain;
46
46
  }
47
47
 
@@ -0,0 +1,9 @@
1
+ //
2
+ // Copyright IBM Corp. 2024, 2024
3
+ //
4
+ // This source code is licensed under the Apache-2.0 license found in the
5
+ // LICENSE file in the root directory of this source tree.
6
+ //
7
+
8
+ // Import any Carbon component styles used from Decorator in this file.
9
+ // Decorator uses the following Carbon components:
@@ -0,0 +1,400 @@
1
+ /* stylelint-disable carbon/theme-token-use */
2
+ /* stylelint-disable carbon/type-token-use */
3
+ /* stylelint-disable carbon/layout-token-use */
4
+ /* stylelint-disable function-no-unknown */
5
+
6
+ //
7
+ // Copyright IBM Corp. 2024, 2024
8
+ //
9
+ // This source code is licensed under the Apache-2.0 license found in the
10
+ // LICENSE file in the root directory of this source tree.
11
+ //
12
+
13
+ // Standard imports.
14
+ @use '../../global/styles/project-settings' as c4p-settings;
15
+ @use '../../global/styles/mixins';
16
+
17
+ // Decorator uses the following Carbon for IBM Products components:
18
+ @use '@carbon/layout/scss/convert' as *;
19
+ @use '@carbon/react/scss/colors' as *;
20
+ @use '@carbon/styles/scss/colors' as *;
21
+ @use '@carbon/styles/scss/spacing' as *;
22
+ @use '@carbon/styles/scss/theme' as *;
23
+ @use '@carbon/styles/scss/themes';
24
+ @use '@carbon/styles/scss/type';
25
+
26
+ // The block part of our conventional BEM class names (blockClass__E--M).
27
+ $block-class: #{c4p-settings.$pkg-prefix}--decorator;
28
+ //
29
+ $default: #{$block-class}--default;
30
+ $link: #{$block-class}--link;
31
+ $button: '#{$block-class}--button:not(.#{$block-class}-disabled)';
32
+ $button-disabled: '#{$block-class}--button.#{$block-class}-disabled';
33
+ $buttons: '#{$block-class}--buttons:not(.#{$block-class}-disabled)';
34
+ $buttons-disabled: '#{$block-class}--buttons.#{$block-class}-disabled';
35
+ //
36
+ //
37
+ $icon: #{$block-class}-icon;
38
+ $label: #{$block-class}__label;
39
+ $value: #{$block-class}__value;
40
+
41
+ // Use value-divider() by default for the component's dividing line.
42
+ @mixin value-divider($top: 0, $bottom: 0, $left: 0, $color: $border-subtle-02) {
43
+ &::after {
44
+ position: absolute;
45
+ top: #{$top};
46
+ bottom: #{$bottom};
47
+ left: #{$left};
48
+ border-left: 1px solid #{$color};
49
+ content: '';
50
+ }
51
+ }
52
+ // Use label-divider() only when hovering/focusing the label.
53
+ @mixin label-divider(
54
+ // Nudge the line over so it occupies the same space as the value divider.
55
+ $top: -1px,
56
+ $right: -1px,
57
+ $bottom: -1px,
58
+ $color: $border-strong
59
+ ) {
60
+ &::after {
61
+ position: absolute;
62
+ z-index: 1;
63
+ top: #{$top};
64
+ right: #{$right};
65
+ bottom: #{$bottom};
66
+ border-right: 1px solid #{$color};
67
+ content: '';
68
+ }
69
+ }
70
+
71
+ .#{$block-class}--light {
72
+ @include theme(themes.$g10, true);
73
+ }
74
+ .#{$block-class}--dark {
75
+ @include theme(themes.$g100, true);
76
+ }
77
+
78
+ // BASE STYLING FOR ALL DECORATORS
79
+ .#{$block-class} {
80
+ display: inline-flex;
81
+ max-width: 100%;
82
+ align-items: normal;
83
+ border-radius: $spacing-12;
84
+ }
85
+ .#{$block-class} .#{$label} {
86
+ @include type.type-style('label-01');
87
+
88
+ position: relative;
89
+ display: inline-flex;
90
+ height: $spacing-06;
91
+ align-items: normal;
92
+ padding: 0 $spacing-03;
93
+ border-width: to-rem(1px) 0 to-rem(1px) to-rem(1px);
94
+ border-style: solid;
95
+ border-color: $border-subtle-02;
96
+ border-radius: $spacing-12 0 0 $spacing-12;
97
+ background-color: $layer-01;
98
+ color: $text-secondary;
99
+ line-height: 1.8;
100
+ }
101
+ .#{$block-class} .#{$value} {
102
+ @include type.type-style('label-01');
103
+
104
+ position: relative;
105
+ display: inline-flex;
106
+ overflow: hidden;
107
+ height: $spacing-06;
108
+ align-items: normal;
109
+ padding: 0 $spacing-03;
110
+ border-width: to-rem(1px) to-rem(1px) to-rem(1px) 0;
111
+ border-style: solid;
112
+ border-color: $border-subtle-02;
113
+ border-radius: 0 $spacing-12 $spacing-12 0;
114
+ background-color: $layer-01;
115
+ color: $text-primary;
116
+ line-height: 1.8;
117
+ }
118
+ .#{$block-class} .#{$icon} {
119
+ margin-top: to-rem(3px);
120
+ margin-right: $spacing-02;
121
+ }
122
+
123
+ //
124
+ // STYLING FOR DEFAULT (NON-INTERACTIVE)
125
+ //
126
+ .#{$default} .#{$value} {
127
+ @include value-divider();
128
+ }
129
+
130
+ //
131
+ // STYLING FOR LINK
132
+ //
133
+ .#{$link} {
134
+ cursor: pointer;
135
+ text-decoration: none;
136
+ }
137
+ .#{$link} .#{$label} {
138
+ background-color: $layer-02;
139
+ }
140
+ .#{$link} .#{$value} {
141
+ @include value-divider();
142
+
143
+ background-color: $layer-02;
144
+ color: $link-primary;
145
+ }
146
+ .#{$link}:hover .#{$value} {
147
+ color: $link-primary-hover;
148
+ text-decoration: underline;
149
+ }
150
+ .#{$link}:focus {
151
+ text-decoration: none;
152
+ }
153
+ .#{$link}:focus .#{$value} {
154
+ @include value-divider($color: $focus);
155
+
156
+ border-color: $focus;
157
+ }
158
+ .#{$link}:active .#{$value} {
159
+ color: $text-primary;
160
+ }
161
+
162
+ //
163
+ // STYLING FOR SINGLE BUTTON
164
+ //
165
+ .#{$button} {
166
+ display: flex;
167
+ padding: 0;
168
+ border: 0;
169
+ cursor: pointer;
170
+ }
171
+ .#{$button} .#{$label} {
172
+ background-color: $layer-02;
173
+ }
174
+ .#{$button} .#{$value} {
175
+ @include value-divider();
176
+
177
+ background-color: $layer-02;
178
+ }
179
+ .#{$button}:hover .#{$label} {
180
+ border-color: $border-strong;
181
+ background-color: $layer-hover-02;
182
+ }
183
+ .#{$button}:hover .#{$value} {
184
+ @include value-divider($color: $border-strong);
185
+
186
+ border-color: $border-strong;
187
+ background-color: $layer-hover-02;
188
+ }
189
+ .#{$button}:focus {
190
+ // Disable browser's default "focus" style.
191
+ outline: none;
192
+ }
193
+ .#{$button}:focus .#{$label} {
194
+ border-color: $focus;
195
+ background-color: $layer-02;
196
+ }
197
+ .#{$button}:focus .#{$value} {
198
+ @include value-divider();
199
+
200
+ border-color: $focus;
201
+ background-color: $layer-02;
202
+ }
203
+ .#{$button}:active .#{$label} {
204
+ background-color: $layer-selected-02;
205
+ }
206
+ .#{$button}:active .#{$value} {
207
+ @include value-divider();
208
+
209
+ background-color: $layer-selected-02;
210
+ }
211
+ .#{$button-disabled} {
212
+ padding: 0;
213
+ border: 0;
214
+ cursor: not-allowed;
215
+ }
216
+ .#{$button-disabled} .#{$label} {
217
+ background-color: $layer-02;
218
+ color: $icon-on-color-disabled;
219
+ }
220
+ .#{$button-disabled} .#{$value} {
221
+ @include value-divider();
222
+
223
+ background-color: $layer-02;
224
+ color: $icon-on-color-disabled;
225
+ }
226
+
227
+ //
228
+ // STYLING FOR DUAL BUTTONS
229
+ //
230
+ .#{$buttons} .#{$label} {
231
+ background-color: $layer-02;
232
+ cursor: pointer;
233
+ }
234
+ .#{$buttons}:not(:hover) .#{$value} {
235
+ @include value-divider();
236
+ }
237
+ .#{$buttons} .#{$value} {
238
+ background-color: $layer-02;
239
+ cursor: pointer;
240
+ }
241
+ .#{$buttons} .#{$label}:hover {
242
+ @include label-divider($color: $border-strong);
243
+
244
+ border-color: $border-strong;
245
+ background-color: $layer-hover-02;
246
+ }
247
+ .#{$buttons} .#{$value}:hover {
248
+ @include value-divider($color: $border-strong);
249
+
250
+ border-color: $border-strong;
251
+ background-color: $layer-hover-02;
252
+ }
253
+ .#{$buttons} .#{$label}:focus {
254
+ @include label-divider($color: $focus);
255
+
256
+ border-color: $focus;
257
+ // Disable browser's default "focus" style.
258
+ outline: none;
259
+ }
260
+ .#{$buttons} .#{$value}:focus {
261
+ @include value-divider($color: $focus);
262
+
263
+ border-color: $focus;
264
+ // Disable browser's default "focus" style.
265
+ outline: none;
266
+ }
267
+ .#{$buttons} .#{$label}:active {
268
+ background-color: $layer-hover-02;
269
+ }
270
+ .#{$buttons} .#{$value}:active {
271
+ background-color: $layer-hover-02;
272
+ }
273
+ .#{$buttons-disabled} .#{$label} {
274
+ background-color: $layer-02;
275
+ color: $icon-on-color-disabled;
276
+ }
277
+ .#{$buttons-disabled} .#{$value} {
278
+ @include value-divider();
279
+
280
+ background-color: $layer-02;
281
+ color: $icon-on-color-disabled;
282
+ }
283
+
284
+ //
285
+ // MODIFIER, SMALL
286
+ //
287
+ .#{$block-class}--sm .#{$label} {
288
+ height: to-rem(18px);
289
+ padding: 0 $spacing-02 0 $spacing-03;
290
+ line-height: 1.333;
291
+ }
292
+ .#{$block-class}--sm .#{$value} {
293
+ height: to-rem(18px);
294
+ // When "small", the divider takes up 1px of 4px of the available space: so "+1px".
295
+ padding: 0 $spacing-03 0 calc($spacing-02 + 1px);
296
+ line-height: 1.333;
297
+ }
298
+
299
+ //
300
+ // MODIFIER, TRUNCATION
301
+ //
302
+ .#{$block-class}--truncate-end .#{$value} {
303
+ display: inline;
304
+ overflow: hidden;
305
+ text-overflow: ellipsis;
306
+ white-space: nowrap;
307
+ }
308
+ .#{$block-class}--truncate-start .#{$value} {
309
+ display: inline;
310
+ overflow: hidden;
311
+ direction: rtl;
312
+ text-overflow: ellipsis;
313
+ white-space: nowrap;
314
+ }
315
+
316
+ //
317
+ // MAGNITUDE ICON COLORS AND SIZES
318
+ //
319
+ .#{$icon}__magnitude-unknown {
320
+ fill: $icon-secondary;
321
+ }
322
+ .#{$icon}__magnitude-benign {
323
+ fill: $teal-60;
324
+ }
325
+ .#{$icon}__magnitude-low {
326
+ fill: $support-warning;
327
+ }
328
+ .#{$icon}__magnitude-medium {
329
+ fill: $orange-40;
330
+ }
331
+ .#{$icon}__magnitude-high {
332
+ fill: $support-error;
333
+ }
334
+ .#{$icon}__magnitude-critical {
335
+ fill: $support-error;
336
+ }
337
+ .#{$block-class}-disabled svg {
338
+ fill: $icon-on-color-disabled;
339
+ }
340
+
341
+ // MODIFIER, SMALL ICON
342
+ .#{$block-class} .#{$icon}--sm {
343
+ width: $spacing-04;
344
+ height: $spacing-04;
345
+ margin-top: to-rem(2.5px);
346
+ }
347
+
348
+ // DUAL BUTTONS ICON ENHANCED ACCESSIBILITY
349
+ // Add a border to the icon on hover & active to increase contrast.
350
+ .#{$block-class}--light {
351
+ &.#{$buttons} .#{$label}:hover .#{$icon}__magnitude-low,
352
+ &.#{$buttons} .#{$label}:active .#{$icon}__magnitude-low {
353
+ stroke: $yellow-60;
354
+ stroke-width: 1px;
355
+ }
356
+ // The "diamond-fill/medium" icon has an inner and outer path.
357
+ // Fill the outer path to simulate a 1px border.
358
+ &.#{$buttons} .#{$label}:hover .#{$icon}__magnitude-medium path:first-child,
359
+ &.#{$buttons} .#{$label}:active .#{$icon}__magnitude-medium path:first-child {
360
+ fill: $orange-60;
361
+ }
362
+ }
363
+ .#{$block-class}--dark {
364
+ // The "caution/high" icon has an inner and outer path.
365
+ // Fill the outer path to simulate a 1px border.
366
+ &.#{$buttons} .#{$label}:hover .#{$icon}__magnitude-high path:first-child,
367
+ &.#{$buttons} .#{$label}:active .#{$icon}__magnitude-high path:first-child {
368
+ fill: $red-40;
369
+ }
370
+ &.#{$buttons} .#{$label}:hover .#{$icon}__magnitude-critical,
371
+ &.#{$buttons} .#{$label}:active .#{$icon}__magnitude-critical {
372
+ stroke: $red-40;
373
+ stroke-width: to-rem(0.5px);
374
+ }
375
+ }
376
+
377
+ // SINGLE BUTTON ICON ENHANCED ACCESSIBILITY
378
+ // Add a border to the icon on hover & active to increase contrast.
379
+ .#{$block-class}--light {
380
+ &.#{$button}:hover .#{$icon}__magnitude-low,
381
+ &.#{$button}:active .#{$icon}__magnitude-low {
382
+ stroke: $yellow-60;
383
+ stroke-width: 1px;
384
+ }
385
+ &.#{$button}:hover .#{$icon}__magnitude-medium path:first-child,
386
+ &.#{$button}:active .#{$icon}__magnitude-medium path:first-child {
387
+ fill: $orange-60;
388
+ }
389
+ }
390
+ .#{$block-class}--dark {
391
+ &.#{$button}:hover .#{$icon}__magnitude-high path:first-child,
392
+ &.#{$button}:active .#{$icon}__magnitude-high path:first-child {
393
+ fill: $red-40;
394
+ }
395
+ &.#{$button}:hover .#{$icon}__magnitude-critical,
396
+ &.#{$button}:active .#{$icon}__magnitude-critical {
397
+ stroke: $red-40;
398
+ stroke-width: to-rem(0.5px);
399
+ }
400
+ }
@@ -0,0 +1,9 @@
1
+ //
2
+ // Copyright IBM Corp. 2024, 2024
3
+ //
4
+ // This source code is licensed under the Apache-2.0 license found in the
5
+ // LICENSE file in the root directory of this source tree.
6
+ //
7
+
8
+ @use './carbon-imports';
9
+ @use './decorator';
@@ -0,0 +1,8 @@
1
+ //
2
+ // Copyright IBM Corp. 2024, 2024
3
+ //
4
+ // This source code is licensed under the Apache-2.0 license found in the
5
+ // LICENSE file in the root directory of this source tree.
6
+ //
7
+
8
+ @use './decorator';
@@ -146,6 +146,7 @@ $block-class-modal: #{$_block-class}-modal;
146
146
 
147
147
  .#{$block-class-overflow}__show-all-tags-link {
148
148
  margin-top: $spacing-03;
149
+ color: $link-inverse;
149
150
  }
150
151
 
151
152
  .#{$block-class-overflow}__tag-item.#{$block-class-overflow}__tag-item--tag
@@ -60,6 +60,7 @@
60
60
  @use './CoachmarkOverlayElements/index-with-carbon' as *;
61
61
  @use './CoachmarkStack/index-with-carbon' as *;
62
62
  @use './DelimitedList/index-with-carbon' as *;
63
+ @use './Decorator/index-with-carbon' as *;
63
64
  @use './DescriptionList/index-with-carbon' as *;
64
65
  @use './FullPageError/index-with-carbon' as *;
65
66
  @use './SearchBar/index-with-carbon' as *;
@@ -68,6 +68,7 @@
68
68
  @use './InterstitialScreenView';
69
69
  @use './InterstitialScreenViewModule';
70
70
  @use './DelimitedList';
71
+ @use './Decorator';
71
72
  @use './DescriptionList';
72
73
  @use './FullPageError';
73
74
  @use './SearchBar';