@lumx/core 3.9.6 → 3.9.7-alpha.1
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/design-tokens.css +61 -61
- package/js/constants/design-tokens.js +251 -111
- package/js/constants/design-tokens.min.js +1 -1
- package/js/constants/design-tokens.min.js.map +1 -1
- package/js/constants/design-tokens.ts +167 -111
- package/lumx.css +1 -1
- package/lumx.min.css +1 -1
- package/package.json +1 -1
- package/scss/_design-tokens.scss +61 -61
package/package.json
CHANGED
|
@@ -40,7 +40,7 @@
|
|
|
40
40
|
"update-version-changelog": "yarn version-changelog ../../CHANGELOG.md"
|
|
41
41
|
},
|
|
42
42
|
"sideEffects": false,
|
|
43
|
-
"version": "3.9.
|
|
43
|
+
"version": "3.9.7-alpha.1",
|
|
44
44
|
"devDependencies": {
|
|
45
45
|
"@babel/core": "^7.18.13",
|
|
46
46
|
"@babel/plugin-proposal-class-properties": "^7.18.6",
|
package/scss/_design-tokens.scss
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
/**
|
|
4
4
|
* Do not edit directly
|
|
5
|
-
* Generated on
|
|
5
|
+
* Generated on Mon, 16 Dec 2024 14:41:27 GMT
|
|
6
6
|
*/
|
|
7
7
|
|
|
8
8
|
$lumx-button-height: 36px !default;
|
|
@@ -80,44 +80,44 @@ $lumx-button-emphasis-low-state-active-theme-dark-background-color: var(--lumx-c
|
|
|
80
80
|
$lumx-button-emphasis-low-state-active-theme-dark-color: var(--lumx-color-light-L1) !default;
|
|
81
81
|
$lumx-button-emphasis-low-state-active-theme-dark-border-color: transparent !default;
|
|
82
82
|
$lumx-button-emphasis-selected-state-default-padding-horizontal: 16px !default; // deprecated (use base emphasis padding)
|
|
83
|
-
$lumx-button-emphasis-selected-state-default-border-width:
|
|
84
|
-
$lumx-button-emphasis-selected-state-default-theme-light-background-color: var(--lumx-color-primary-
|
|
83
|
+
$lumx-button-emphasis-selected-state-default-border-width: 1px !default;
|
|
84
|
+
$lumx-button-emphasis-selected-state-default-theme-light-background-color: var(--lumx-color-primary-L6) !default;
|
|
85
85
|
$lumx-button-emphasis-selected-state-default-theme-light-color: var(--lumx-color-primary-D2) !default;
|
|
86
|
-
$lumx-button-emphasis-selected-state-default-theme-light-border-color:
|
|
87
|
-
$lumx-button-emphasis-selected-state-default-theme-dark-background-color: var(--lumx-color-light-
|
|
86
|
+
$lumx-button-emphasis-selected-state-default-theme-light-border-color: var(--lumx-color-primary-N) !default;
|
|
87
|
+
$lumx-button-emphasis-selected-state-default-theme-dark-background-color: var(--lumx-color-light-L6) !default;
|
|
88
88
|
$lumx-button-emphasis-selected-state-default-theme-dark-color: var(--lumx-color-light-N) !default;
|
|
89
|
-
$lumx-button-emphasis-selected-state-default-theme-dark-border-color:
|
|
89
|
+
$lumx-button-emphasis-selected-state-default-theme-dark-border-color: var(--lumx-color-light-N) !default;
|
|
90
90
|
$lumx-button-emphasis-selected-state-hover-padding-horizontal: 16px !default; // deprecated (use base emphasis padding)
|
|
91
|
-
$lumx-button-emphasis-selected-state-hover-border-width:
|
|
92
|
-
$lumx-button-emphasis-selected-state-hover-theme-light-background-color: var(--lumx-color-primary-
|
|
91
|
+
$lumx-button-emphasis-selected-state-hover-border-width: 1px !default;
|
|
92
|
+
$lumx-button-emphasis-selected-state-hover-theme-light-background-color: var(--lumx-color-primary-L5) !default;
|
|
93
93
|
$lumx-button-emphasis-selected-state-hover-theme-light-color: var(--lumx-color-primary-D2) !default;
|
|
94
|
-
$lumx-button-emphasis-selected-state-hover-theme-light-border-color:
|
|
95
|
-
$lumx-button-emphasis-selected-state-hover-theme-dark-background-color: var(--lumx-color-light-
|
|
94
|
+
$lumx-button-emphasis-selected-state-hover-theme-light-border-color: var(--lumx-color-primary-N) !default;
|
|
95
|
+
$lumx-button-emphasis-selected-state-hover-theme-dark-background-color: var(--lumx-color-light-L5) !default;
|
|
96
96
|
$lumx-button-emphasis-selected-state-hover-theme-dark-color: var(--lumx-color-light-N) !default;
|
|
97
|
-
$lumx-button-emphasis-selected-state-hover-theme-dark-border-color:
|
|
97
|
+
$lumx-button-emphasis-selected-state-hover-theme-dark-border-color: var(--lumx-color-light-N) !default;
|
|
98
98
|
$lumx-button-emphasis-selected-state-active-padding-horizontal: 16px !default; // deprecated (use base emphasis padding)
|
|
99
|
-
$lumx-button-emphasis-selected-state-active-border-width:
|
|
100
|
-
$lumx-button-emphasis-selected-state-active-theme-light-background-color: var(--lumx-color-primary-
|
|
99
|
+
$lumx-button-emphasis-selected-state-active-border-width: 1px !default;
|
|
100
|
+
$lumx-button-emphasis-selected-state-active-theme-light-background-color: var(--lumx-color-primary-L4) !default;
|
|
101
101
|
$lumx-button-emphasis-selected-state-active-theme-light-color: var(--lumx-color-primary-D2) !default;
|
|
102
|
-
$lumx-button-emphasis-selected-state-active-theme-light-border-color:
|
|
103
|
-
$lumx-button-emphasis-selected-state-active-theme-dark-background-color: var(--lumx-color-light-
|
|
102
|
+
$lumx-button-emphasis-selected-state-active-theme-light-border-color: var(--lumx-color-primary-N) !default;
|
|
103
|
+
$lumx-button-emphasis-selected-state-active-theme-dark-background-color: var(--lumx-color-light-L4) !default;
|
|
104
104
|
$lumx-button-emphasis-selected-state-active-theme-dark-color: var(--lumx-color-light-N) !default;
|
|
105
|
-
$lumx-button-emphasis-selected-state-active-theme-dark-border-color:
|
|
106
|
-
$lumx-chip-emphasis-selected-state-default-border-width:
|
|
107
|
-
$lumx-chip-emphasis-selected-state-default-theme-light-border-color:
|
|
108
|
-
$lumx-chip-emphasis-selected-state-default-theme-light-background-color: var(--lumx-color-primary-
|
|
109
|
-
$lumx-chip-emphasis-selected-state-default-theme-dark-border-color:
|
|
110
|
-
$lumx-chip-emphasis-selected-state-default-theme-dark-background-color: var(--lumx-color-light-
|
|
111
|
-
$lumx-chip-emphasis-selected-state-hover-border-width:
|
|
112
|
-
$lumx-chip-emphasis-selected-state-hover-theme-light-border-color:
|
|
113
|
-
$lumx-chip-emphasis-selected-state-hover-theme-light-background-color: var(--lumx-color-primary-
|
|
105
|
+
$lumx-button-emphasis-selected-state-active-theme-dark-border-color: var(--lumx-color-light-N) !default;
|
|
106
|
+
$lumx-chip-emphasis-selected-state-default-border-width: 1px !default;
|
|
107
|
+
$lumx-chip-emphasis-selected-state-default-theme-light-border-color: var(--lumx-color-primary-N) !default;
|
|
108
|
+
$lumx-chip-emphasis-selected-state-default-theme-light-background-color: var(--lumx-color-primary-L6) !default;
|
|
109
|
+
$lumx-chip-emphasis-selected-state-default-theme-dark-border-color: var(--lumx-color-light-N) !default;
|
|
110
|
+
$lumx-chip-emphasis-selected-state-default-theme-dark-background-color: var(--lumx-color-light-L6) !default;
|
|
111
|
+
$lumx-chip-emphasis-selected-state-hover-border-width: 1px !default;
|
|
112
|
+
$lumx-chip-emphasis-selected-state-hover-theme-light-border-color: var(--lumx-color-primary-N) !default;
|
|
113
|
+
$lumx-chip-emphasis-selected-state-hover-theme-light-background-color: var(--lumx-color-primary-L5) !default;
|
|
114
114
|
$lumx-chip-emphasis-selected-state-hover-theme-dark-border-color: transparent !default;
|
|
115
|
-
$lumx-chip-emphasis-selected-state-hover-theme-dark-background-color: var(--lumx-color-light-
|
|
116
|
-
$lumx-chip-emphasis-selected-state-active-border-width:
|
|
117
|
-
$lumx-chip-emphasis-selected-state-active-theme-light-border-color:
|
|
118
|
-
$lumx-chip-emphasis-selected-state-active-theme-light-background-color: var(--lumx-color-primary-
|
|
119
|
-
$lumx-chip-emphasis-selected-state-active-theme-dark-border-color:
|
|
120
|
-
$lumx-chip-emphasis-selected-state-active-theme-dark-background-color: var(--lumx-color-light-
|
|
115
|
+
$lumx-chip-emphasis-selected-state-hover-theme-dark-background-color: var(--lumx-color-light-L5) !default;
|
|
116
|
+
$lumx-chip-emphasis-selected-state-active-border-width: 1px !default;
|
|
117
|
+
$lumx-chip-emphasis-selected-state-active-theme-light-border-color: var(--lumx-color-primary-N) !default;
|
|
118
|
+
$lumx-chip-emphasis-selected-state-active-theme-light-background-color: var(--lumx-color-primary-L4) !default;
|
|
119
|
+
$lumx-chip-emphasis-selected-state-active-theme-dark-border-color: var(--lumx-color-light-N) !default;
|
|
120
|
+
$lumx-chip-emphasis-selected-state-active-theme-dark-background-color: var(--lumx-color-light-L4) !default;
|
|
121
121
|
$lumx-material-button-text-transform: none !default;
|
|
122
122
|
$lumx-material-checkbox-wrapper-size: 20px !default;
|
|
123
123
|
$lumx-material-checkbox-control-size: 16px !default;
|
|
@@ -204,63 +204,63 @@ $lumx-navigation-item-emphasis-low-state-active-theme-dark-icon-color: var(--lum
|
|
|
204
204
|
$lumx-navigation-item-emphasis-low-state-active-theme-dark-label-color: var(--lumx-color-light-N) !default;
|
|
205
205
|
$lumx-navigation-item-emphasis-low-state-active-theme-dark-chevron-background-color: var(--lumx-color-light-L4) !default;
|
|
206
206
|
$lumx-navigation-item-emphasis-low-state-active-theme-dark-chevron-color: var(--lumx-color-light-L1) !default;
|
|
207
|
-
$lumx-navigation-item-emphasis-selected-state-default-border-top-width:
|
|
208
|
-
$lumx-navigation-item-emphasis-selected-state-default-border-right-width:
|
|
209
|
-
$lumx-navigation-item-emphasis-selected-state-default-border-bottom-width:
|
|
210
|
-
$lumx-navigation-item-emphasis-selected-state-default-border-left-width:
|
|
211
|
-
$lumx-navigation-item-emphasis-selected-state-default-theme-light-background-color: var(--lumx-color-primary-
|
|
207
|
+
$lumx-navigation-item-emphasis-selected-state-default-border-top-width: 1px !default;
|
|
208
|
+
$lumx-navigation-item-emphasis-selected-state-default-border-right-width: 1px !default;
|
|
209
|
+
$lumx-navigation-item-emphasis-selected-state-default-border-bottom-width: 1px !default;
|
|
210
|
+
$lumx-navigation-item-emphasis-selected-state-default-border-left-width: 1px !default;
|
|
211
|
+
$lumx-navigation-item-emphasis-selected-state-default-theme-light-background-color: var(--lumx-color-primary-L6) !default;
|
|
212
212
|
$lumx-navigation-item-emphasis-selected-state-default-theme-light-border-color: var(--lumx-color-primary-N) !default;
|
|
213
213
|
$lumx-navigation-item-emphasis-selected-state-default-theme-light-icon-color: var(--lumx-color-primary-D2) !default;
|
|
214
214
|
$lumx-navigation-item-emphasis-selected-state-default-theme-light-label-color: var(--lumx-color-primary-D2) !default;
|
|
215
215
|
$lumx-navigation-item-emphasis-selected-state-default-theme-light-chevron-background-color: transparent !default;
|
|
216
216
|
$lumx-navigation-item-emphasis-selected-state-default-theme-light-chevron-color: var(--lumx-color-primary-D2) !default;
|
|
217
|
-
$lumx-navigation-item-emphasis-selected-state-default-theme-dark-background-color: var(--lumx-color-light-
|
|
217
|
+
$lumx-navigation-item-emphasis-selected-state-default-theme-dark-background-color: var(--lumx-color-light-L6) !default;
|
|
218
218
|
$lumx-navigation-item-emphasis-selected-state-default-theme-dark-border-color: var(--lumx-color-light-N) !default;
|
|
219
219
|
$lumx-navigation-item-emphasis-selected-state-default-theme-dark-icon-color: var(--lumx-color-light-N) !default;
|
|
220
220
|
$lumx-navigation-item-emphasis-selected-state-default-theme-dark-label-color: var(--lumx-color-light-N) !default;
|
|
221
221
|
$lumx-navigation-item-emphasis-selected-state-default-theme-dark-chevron-background-color: transparent !default;
|
|
222
222
|
$lumx-navigation-item-emphasis-selected-state-default-theme-dark-chevron-color: var(--lumx-color-light-N) !default;
|
|
223
|
-
$lumx-navigation-item-emphasis-selected-state-hover-border-top-width:
|
|
224
|
-
$lumx-navigation-item-emphasis-selected-state-hover-border-right-width:
|
|
225
|
-
$lumx-navigation-item-emphasis-selected-state-hover-border-bottom-width:
|
|
226
|
-
$lumx-navigation-item-emphasis-selected-state-hover-border-left-width:
|
|
227
|
-
$lumx-navigation-item-emphasis-selected-state-hover-theme-light-background-color: var(--lumx-color-primary-
|
|
223
|
+
$lumx-navigation-item-emphasis-selected-state-hover-border-top-width: 1px !default;
|
|
224
|
+
$lumx-navigation-item-emphasis-selected-state-hover-border-right-width: 1px !default;
|
|
225
|
+
$lumx-navigation-item-emphasis-selected-state-hover-border-bottom-width: 1px !default;
|
|
226
|
+
$lumx-navigation-item-emphasis-selected-state-hover-border-left-width: 1px !default;
|
|
227
|
+
$lumx-navigation-item-emphasis-selected-state-hover-theme-light-background-color: var(--lumx-color-primary-L5) !default;
|
|
228
228
|
$lumx-navigation-item-emphasis-selected-state-hover-theme-light-border-color: var(--lumx-color-primary-N) !default;
|
|
229
229
|
$lumx-navigation-item-emphasis-selected-state-hover-theme-light-icon-color: var(--lumx-color-primary-D2) !default;
|
|
230
230
|
$lumx-navigation-item-emphasis-selected-state-hover-theme-light-label-color: var(--lumx-color-primary-D2) !default;
|
|
231
|
-
$lumx-navigation-item-emphasis-selected-state-hover-theme-light-chevron-background-color: var(--lumx-color-primary-
|
|
231
|
+
$lumx-navigation-item-emphasis-selected-state-hover-theme-light-chevron-background-color: var(--lumx-color-primary-L5) !default;
|
|
232
232
|
$lumx-navigation-item-emphasis-selected-state-hover-theme-light-chevron-color: var(--lumx-color-primary-D2) !default;
|
|
233
|
-
$lumx-navigation-item-emphasis-selected-state-hover-theme-dark-background-color: var(--lumx-color-light-
|
|
233
|
+
$lumx-navigation-item-emphasis-selected-state-hover-theme-dark-background-color: var(--lumx-color-light-L5) !default;
|
|
234
234
|
$lumx-navigation-item-emphasis-selected-state-hover-theme-dark-border-color: var(--lumx-color-light-N) !default;
|
|
235
235
|
$lumx-navigation-item-emphasis-selected-state-hover-theme-dark-icon-color: var(--lumx-color-light-N) !default;
|
|
236
236
|
$lumx-navigation-item-emphasis-selected-state-hover-theme-dark-label-color: var(--lumx-color-light-N) !default;
|
|
237
|
-
$lumx-navigation-item-emphasis-selected-state-hover-theme-dark-chevron-background-color: var(--lumx-color-light-
|
|
237
|
+
$lumx-navigation-item-emphasis-selected-state-hover-theme-dark-chevron-background-color: var(--lumx-color-light-L5) !default;
|
|
238
238
|
$lumx-navigation-item-emphasis-selected-state-hover-theme-dark-chevron-color: var(--lumx-color-light-N) !default;
|
|
239
|
-
$lumx-navigation-item-emphasis-selected-state-active-border-top-width:
|
|
240
|
-
$lumx-navigation-item-emphasis-selected-state-active-border-right-width:
|
|
241
|
-
$lumx-navigation-item-emphasis-selected-state-active-border-bottom-width:
|
|
242
|
-
$lumx-navigation-item-emphasis-selected-state-active-border-left-width:
|
|
243
|
-
$lumx-navigation-item-emphasis-selected-state-active-theme-light-background-color: var(--lumx-color-primary-
|
|
239
|
+
$lumx-navigation-item-emphasis-selected-state-active-border-top-width: 1px !default;
|
|
240
|
+
$lumx-navigation-item-emphasis-selected-state-active-border-right-width: 1px !default;
|
|
241
|
+
$lumx-navigation-item-emphasis-selected-state-active-border-bottom-width: 1px !default;
|
|
242
|
+
$lumx-navigation-item-emphasis-selected-state-active-border-left-width: 1px !default;
|
|
243
|
+
$lumx-navigation-item-emphasis-selected-state-active-theme-light-background-color: var(--lumx-color-primary-L4) !default;
|
|
244
244
|
$lumx-navigation-item-emphasis-selected-state-active-theme-light-border-color: var(--lumx-color-primary-N) !default;
|
|
245
245
|
$lumx-navigation-item-emphasis-selected-state-active-theme-light-icon-color: var(--lumx-color-primary-D2) !default;
|
|
246
246
|
$lumx-navigation-item-emphasis-selected-state-active-theme-light-label-color: var(--lumx-color-primary-D2) !default;
|
|
247
|
-
$lumx-navigation-item-emphasis-selected-state-active-theme-light-chevron-background-color: var(--lumx-color-primary-
|
|
247
|
+
$lumx-navigation-item-emphasis-selected-state-active-theme-light-chevron-background-color: var(--lumx-color-primary-L4) !default;
|
|
248
248
|
$lumx-navigation-item-emphasis-selected-state-active-theme-light-chevron-color: var(--lumx-color-primary-D2) !default;
|
|
249
|
-
$lumx-navigation-item-emphasis-selected-state-active-theme-dark-background-color: var(--lumx-color-light-
|
|
249
|
+
$lumx-navigation-item-emphasis-selected-state-active-theme-dark-background-color: var(--lumx-color-light-L4) !default;
|
|
250
250
|
$lumx-navigation-item-emphasis-selected-state-active-theme-dark-border-color: var(--lumx-color-light-N) !default;
|
|
251
251
|
$lumx-navigation-item-emphasis-selected-state-active-theme-dark-icon-color: var(--lumx-color-light-N) !default;
|
|
252
252
|
$lumx-navigation-item-emphasis-selected-state-active-theme-dark-label-color: var(--lumx-color-light-N) !default;
|
|
253
|
-
$lumx-navigation-item-emphasis-selected-state-active-theme-dark-chevron-background-color: var(--lumx-color-light-
|
|
253
|
+
$lumx-navigation-item-emphasis-selected-state-active-theme-dark-chevron-background-color: var(--lumx-color-light-L4) !default;
|
|
254
254
|
$lumx-navigation-item-emphasis-selected-state-active-theme-dark-chevron-color: var(--lumx-color-light-N) !default;
|
|
255
|
-
$lumx-side-navigation-item-emphasis-selected-state-default-border-width:
|
|
256
|
-
$lumx-side-navigation-item-emphasis-selected-state-default-theme-light-border-color:
|
|
257
|
-
$lumx-side-navigation-item-emphasis-selected-state-default-theme-light-background-color: var(--lumx-color-primary-
|
|
258
|
-
$lumx-side-navigation-item-emphasis-selected-state-hover-border-width:
|
|
259
|
-
$lumx-side-navigation-item-emphasis-selected-state-hover-theme-light-border-color:
|
|
260
|
-
$lumx-side-navigation-item-emphasis-selected-state-hover-theme-light-background-color: var(--lumx-color-primary-
|
|
261
|
-
$lumx-side-navigation-item-emphasis-selected-state-active-border-width:
|
|
262
|
-
$lumx-side-navigation-item-emphasis-selected-state-active-theme-light-border-color:
|
|
263
|
-
$lumx-side-navigation-item-emphasis-selected-state-active-theme-light-background-color: var(--lumx-color-primary-
|
|
255
|
+
$lumx-side-navigation-item-emphasis-selected-state-default-border-width: 1px !default;
|
|
256
|
+
$lumx-side-navigation-item-emphasis-selected-state-default-theme-light-border-color: var(--lumx-color-primary-N) !default;
|
|
257
|
+
$lumx-side-navigation-item-emphasis-selected-state-default-theme-light-background-color: var(--lumx-color-primary-L6) !default;
|
|
258
|
+
$lumx-side-navigation-item-emphasis-selected-state-hover-border-width: 1px !default;
|
|
259
|
+
$lumx-side-navigation-item-emphasis-selected-state-hover-theme-light-border-color: var(--lumx-color-primary-N) !default;
|
|
260
|
+
$lumx-side-navigation-item-emphasis-selected-state-hover-theme-light-background-color: var(--lumx-color-primary-L5) !default;
|
|
261
|
+
$lumx-side-navigation-item-emphasis-selected-state-active-border-width: 1px !default;
|
|
262
|
+
$lumx-side-navigation-item-emphasis-selected-state-active-theme-light-border-color: var(--lumx-color-primary-N) !default;
|
|
263
|
+
$lumx-side-navigation-item-emphasis-selected-state-active-theme-light-background-color: var(--lumx-color-primary-L4) !default;
|
|
264
264
|
$lumx-tabs-link-height: 48px !default;
|
|
265
265
|
$lumx-tabs-link-border-radius: 0 !default;
|
|
266
266
|
$lumx-tabs-link-emphasis-low-state-default-border-top-width: 0 !default;
|