@carbon/styles 1.84.0 → 1.85.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 +50 -0
- package/css/styles.min.css +1 -1
- package/package.json +2 -2
- package/scss/components/data-table/_data-table.scss +39 -1
- package/scss/components/progress-bar/_progress-bar.scss +18 -0
- package/scss/components/text-area/_text-area.scss +6 -1
- package/scss/utilities/_ai-gradient.scss +8 -1
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.85.0",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"repository": {
|
|
7
7
|
"type": "git",
|
|
@@ -75,5 +75,5 @@
|
|
|
75
75
|
"scss/**/*.css",
|
|
76
76
|
"css/**/*.css"
|
|
77
77
|
],
|
|
78
|
-
"gitHead": "
|
|
78
|
+
"gitHead": "62119bab35028f3935a28e7bb09d2c234f061302"
|
|
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.
|
|
@@ -44,6 +44,44 @@
|
|
|
44
44
|
@include focus-outline('outline');
|
|
45
45
|
}
|
|
46
46
|
|
|
47
|
+
//----------------------------------------------------------------------------
|
|
48
|
+
// Container, full table ai
|
|
49
|
+
//----------------------------------------------------------------------------
|
|
50
|
+
.#{$prefix}--data-table-container--ai-enabled {
|
|
51
|
+
position: relative;
|
|
52
|
+
// Allow for pseudo element to show for gradient border effect
|
|
53
|
+
padding: 1px;
|
|
54
|
+
border: none;
|
|
55
|
+
}
|
|
56
|
+
|
|
57
|
+
.#{$prefix}--data-table-container--ai-enabled::after {
|
|
58
|
+
position: absolute;
|
|
59
|
+
z-index: -1;
|
|
60
|
+
// Used for gradient border effect
|
|
61
|
+
background-image: linear-gradient(to top, $ai-border-end, $ai-border-start);
|
|
62
|
+
block-size: 100%;
|
|
63
|
+
content: '';
|
|
64
|
+
inline-size: 100%;
|
|
65
|
+
inset: 0;
|
|
66
|
+
pointer-events: none;
|
|
67
|
+
}
|
|
68
|
+
|
|
69
|
+
.#{$prefix}--data-table-container--ai-enabled tbody {
|
|
70
|
+
position: relative;
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
.#{$prefix}--data-table-container--ai-enabled tbody::before {
|
|
74
|
+
position: absolute;
|
|
75
|
+
block-size: 100%;
|
|
76
|
+
content: '';
|
|
77
|
+
inline-size: 100%;
|
|
78
|
+
inset: 0;
|
|
79
|
+
// Prevents the pseudo element overlay from obstructing click on elements below the overlay
|
|
80
|
+
pointer-events: none;
|
|
81
|
+
|
|
82
|
+
@include ai-table-gradient('full-table');
|
|
83
|
+
}
|
|
84
|
+
|
|
47
85
|
//----------------------------------------------------------------------------
|
|
48
86
|
// Table title text
|
|
49
87
|
//----------------------------------------------------------------------------
|
|
@@ -14,6 +14,7 @@
|
|
|
14
14
|
@use '../../utilities/convert';
|
|
15
15
|
@use '../../utilities/visually-hidden' as *;
|
|
16
16
|
@use '../../utilities/layout';
|
|
17
|
+
@use '../../utilities/high-contrast-mode' as *;
|
|
17
18
|
|
|
18
19
|
/// Progress Bar styles
|
|
19
20
|
/// @access public
|
|
@@ -185,4 +186,21 @@
|
|
|
185
186
|
.#{$prefix}--progress-bar--indented .#{$prefix}--progress-bar__helper-text {
|
|
186
187
|
padding-inline: layout.density('padding-inline');
|
|
187
188
|
}
|
|
189
|
+
|
|
190
|
+
//High Contrast Mode
|
|
191
|
+
//Ensure ProgressBar is visible and animated in Windows HCM
|
|
192
|
+
@include high-contrast-mode {
|
|
193
|
+
.#{$prefix}--progress-bar__track {
|
|
194
|
+
//According to https://developer.mozilla.org/en-US/docs/Web/CSS/system-color, in HCM, the
|
|
195
|
+
//checkbox should be displayed using Canvas and CanvasText.
|
|
196
|
+
background-color: Canvas;
|
|
197
|
+
forced-color-adjust: none;
|
|
198
|
+
outline: 2px solid rgba(0, 0, 0, 0);
|
|
199
|
+
outline-offset: -2px;
|
|
200
|
+
}
|
|
201
|
+
|
|
202
|
+
.#{$prefix}--progress-bar__bar {
|
|
203
|
+
background-color: CanvasText;
|
|
204
|
+
}
|
|
205
|
+
}
|
|
188
206
|
}
|
|
@@ -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.
|
|
@@ -106,6 +106,7 @@
|
|
|
106
106
|
}
|
|
107
107
|
|
|
108
108
|
.#{$prefix}--form-item {
|
|
109
|
+
position: relative;
|
|
109
110
|
&:has(.#{$prefix}--text-area__wrapper--cols) {
|
|
110
111
|
inline-size: fit-content;
|
|
111
112
|
}
|
|
@@ -247,4 +248,8 @@
|
|
|
247
248
|
justify-content: space-between;
|
|
248
249
|
inline-size: 100%;
|
|
249
250
|
}
|
|
251
|
+
.#{$prefix}--form-requirement {
|
|
252
|
+
position: absolute;
|
|
253
|
+
inset-block-start: 100%;
|
|
254
|
+
}
|
|
250
255
|
}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
//
|
|
2
|
-
// Copyright IBM Corp. 2023
|
|
2
|
+
// Copyright IBM Corp. 2023, 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.
|
|
@@ -55,6 +55,13 @@
|
|
|
55
55
|
transparent 50%
|
|
56
56
|
),
|
|
57
57
|
theme.$layer-selected;
|
|
58
|
+
} @else if $type == 'full-table' {
|
|
59
|
+
background: linear-gradient(
|
|
60
|
+
to top,
|
|
61
|
+
theme.$ai-aura-start 0%,
|
|
62
|
+
theme.$ai-aura-end 50%,
|
|
63
|
+
transparent 50%
|
|
64
|
+
);
|
|
58
65
|
} @else {
|
|
59
66
|
background: linear-gradient(
|
|
60
67
|
to right,
|