@carbon/styles 1.19.0-rc.0 → 1.19.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.19.0
|
|
4
|
+
"version": "1.19.0",
|
|
5
5
|
"license": "Apache-2.0",
|
|
6
6
|
"repository": {
|
|
7
7
|
"type": "git",
|
|
@@ -32,13 +32,13 @@
|
|
|
32
32
|
"sass": "^1.33.0"
|
|
33
33
|
},
|
|
34
34
|
"dependencies": {
|
|
35
|
-
"@carbon/colors": "^11.10.0
|
|
36
|
-
"@carbon/feature-flags": "^0.11.0
|
|
37
|
-
"@carbon/grid": "^11.9.0
|
|
38
|
-
"@carbon/layout": "^11.9.0
|
|
39
|
-
"@carbon/motion": "^11.7.0
|
|
40
|
-
"@carbon/themes": "^11.14.0
|
|
41
|
-
"@carbon/type": "^11.13.0
|
|
35
|
+
"@carbon/colors": "^11.10.0",
|
|
36
|
+
"@carbon/feature-flags": "^0.11.0",
|
|
37
|
+
"@carbon/grid": "^11.9.0",
|
|
38
|
+
"@carbon/layout": "^11.9.0",
|
|
39
|
+
"@carbon/motion": "^11.7.0",
|
|
40
|
+
"@carbon/themes": "^11.14.0",
|
|
41
|
+
"@carbon/type": "^11.13.0",
|
|
42
42
|
"@ibm/plex": "6.0.0-next.6"
|
|
43
43
|
},
|
|
44
44
|
"devDependencies": {
|
|
@@ -59,5 +59,5 @@
|
|
|
59
59
|
"scss/**/*.css",
|
|
60
60
|
"css/**/*.css"
|
|
61
61
|
],
|
|
62
|
-
"gitHead": "
|
|
62
|
+
"gitHead": "8206000d08eba6a443d7846b692a3543a47a6e66"
|
|
63
63
|
}
|
|
@@ -87,6 +87,9 @@ describe('@carbon/styles/scss/theme', () => {
|
|
|
87
87
|
"border-strong-01",
|
|
88
88
|
"border-strong-02",
|
|
89
89
|
"border-strong-03",
|
|
90
|
+
"border-tile-01",
|
|
91
|
+
"border-tile-02",
|
|
92
|
+
"border-tile-03",
|
|
90
93
|
"border-inverse",
|
|
91
94
|
"border-interactive",
|
|
92
95
|
"border-disabled",
|
|
@@ -145,6 +148,7 @@ describe('@carbon/styles/scss/theme', () => {
|
|
|
145
148
|
"border-subtle",
|
|
146
149
|
"border-subtle-selected",
|
|
147
150
|
"border-strong",
|
|
151
|
+
"border-tile",
|
|
148
152
|
]
|
|
149
153
|
`);
|
|
150
154
|
});
|
package/scss/_feature-flags.scss
CHANGED
|
@@ -6,6 +6,7 @@
|
|
|
6
6
|
//
|
|
7
7
|
|
|
8
8
|
@use '../../config' as *;
|
|
9
|
+
@use '../../feature-flags' as *;
|
|
9
10
|
@use '../../motion' as *;
|
|
10
11
|
@use '../../spacing' as *;
|
|
11
12
|
@use '../../theme' as *;
|
|
@@ -19,7 +20,7 @@
|
|
|
19
20
|
/// Tile styles
|
|
20
21
|
/// @access public
|
|
21
22
|
/// @group tile
|
|
22
|
-
@mixin tile {
|
|
23
|
+
@mixin tile($local-enable-experimental-tile-contrast: false) {
|
|
23
24
|
.#{$prefix}--tile-group {
|
|
24
25
|
@include reset;
|
|
25
26
|
}
|
|
@@ -62,6 +63,13 @@
|
|
|
62
63
|
color: $text-primary;
|
|
63
64
|
text-decoration: none;
|
|
64
65
|
|
|
66
|
+
@if (
|
|
67
|
+
enabled('enable-experimental-tile-contrast') or
|
|
68
|
+
$local-enable-experimental-tile-contrast
|
|
69
|
+
) {
|
|
70
|
+
border: 1px solid $border-tile;
|
|
71
|
+
}
|
|
72
|
+
|
|
65
73
|
&:focus {
|
|
66
74
|
@include focus-outline('outline');
|
|
67
75
|
}
|
|
@@ -99,6 +107,13 @@
|
|
|
99
107
|
.#{$prefix}--tile--selectable {
|
|
100
108
|
padding-right: $spacing-09;
|
|
101
109
|
border: 1px solid transparent;
|
|
110
|
+
|
|
111
|
+
@if (
|
|
112
|
+
enabled('enable-experimental-tile-contrast') or
|
|
113
|
+
$local-enable-experimental-tile-contrast
|
|
114
|
+
) {
|
|
115
|
+
border: 1px solid $border-tile;
|
|
116
|
+
}
|
|
102
117
|
}
|
|
103
118
|
|
|
104
119
|
.#{$prefix}--tile__checkmark {
|
|
@@ -190,6 +205,13 @@
|
|
|
190
205
|
|
|
191
206
|
@include type-style('body-compact-01');
|
|
192
207
|
|
|
208
|
+
@if (
|
|
209
|
+
enabled('enable-experimental-tile-contrast') or
|
|
210
|
+
$local-enable-experimental-tile-contrast
|
|
211
|
+
) {
|
|
212
|
+
border: 1px solid $border-tile;
|
|
213
|
+
}
|
|
214
|
+
|
|
193
215
|
&:hover {
|
|
194
216
|
background: $layer-hover;
|
|
195
217
|
}
|
|
@@ -74,6 +74,11 @@ $-default-layer-sets: (
|
|
|
74
74
|
theme.$border-strong-02,
|
|
75
75
|
theme.$border-strong-03,
|
|
76
76
|
),
|
|
77
|
+
border-tile: (
|
|
78
|
+
theme.$border-tile-01,
|
|
79
|
+
theme.$border-tile-02,
|
|
80
|
+
theme.$border-tile-03,
|
|
81
|
+
),
|
|
77
82
|
);
|
|
78
83
|
|
|
79
84
|
/// Define a map of layer sets, each set should have values for each layer in
|
package/scss/theme/_theme.scss
CHANGED
|
@@ -38,3 +38,4 @@ $field-hover: custom-property.get-var('field-hover');
|
|
|
38
38
|
$border-subtle: custom-property.get-var('border-subtle');
|
|
39
39
|
$border-subtle-selected: custom-property.get-var('border-subtle-selected');
|
|
40
40
|
$border-strong: custom-property.get-var('border-strong');
|
|
41
|
+
$border-tile: custom-property.get-var('border-tile');
|