@workday/canvas-tokens-web 2.0.0 → 2.0.2

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.
Files changed (29) hide show
  1. package/css/base/_variables.css +1 -1
  2. package/css/brand/_variables.css +1 -1
  3. package/css/system/_variables.css +54 -54
  4. package/dist/common-js/base/index.d.ts +214 -214
  5. package/dist/common-js/base/index.js +1 -1
  6. package/dist/common-js/brand/index.d.ts +15 -15
  7. package/dist/common-js/brand/index.js +1 -1
  8. package/dist/common-js/index.d.ts +1 -1
  9. package/dist/common-js/index.js +1 -1
  10. package/dist/common-js/system/index.d.ts +71 -71
  11. package/dist/common-js/system/index.js +49 -49
  12. package/dist/es6/base/index.d.ts +214 -214
  13. package/dist/es6/base/index.js +1 -1
  14. package/dist/es6/brand/index.d.ts +15 -15
  15. package/dist/es6/brand/index.js +1 -1
  16. package/dist/es6/index.d.ts +1 -1
  17. package/dist/es6/index.js +1 -1
  18. package/dist/es6/system/index.d.ts +71 -71
  19. package/dist/es6/system/index.js +49 -49
  20. package/less/base/_variables.less +1 -1
  21. package/less/brand/_variables.less +1 -1
  22. package/less/system/_variables.less +54 -54
  23. package/package.json +1 -1
  24. package/scss/base/_variables.sass +1 -1
  25. package/scss/base/_variables.scss +1 -1
  26. package/scss/brand/_variables.sass +1 -1
  27. package/scss/brand/_variables.scss +1 -1
  28. package/scss/system/_variables.sass +54 -54
  29. package/scss/system/_variables.scss +54 -54
package/css/base/_variables.css CHANGED
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Fri, 03 May 2024 21:48:34 GMT
3
+ * Generated on Mon, 07 Oct 2024 19:58:20 GMT
4
4
  */
5
5
 
6
6
  :root {
package/css/brand/_variables.css CHANGED
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Fri, 03 May 2024 21:48:34 GMT
3
+ * Generated on Mon, 07 Oct 2024 19:58:20 GMT
4
4
  */
5
5
 
6
6
  :root {
package/css/system/_variables.css CHANGED
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Fri, 03 May 2024 21:48:34 GMT
3
+ * Generated on Mon, 07 Oct 2024 19:58:20 GMT
4
4
  */
5
5
 
6
6
  :root {
@@ -14,7 +14,7 @@
14
14
  --cnvs-sys-shape-zero: 0rem; /* This is the initial shape of every new element. Use this for backgrounds screens and fixed navigation containers such as headers, and side-panels. */
15
15
  --cnvs-sys-opacity-full: 1; /* Dev only */
16
16
  --cnvs-sys-opacity-zero: 0; /* Dev only */
17
- --cnvs-sys-breakpoints-zero: 0; /* Use to set a media query `min-width` below small. */
17
+ --cnvs-sys-breakpoints-zero: 0px; /* Use to set a media query `min-width` below small. */
18
18
  --cnvs-sys-color-bg-critical-stronger: rgba(128,22,14,1); /* Stronger error background */
19
19
  --cnvs-sys-font-weight-bold: var(--cnvs-base-font-weight-700);
20
20
  --cnvs-sys-font-weight-medium: var(--cnvs-base-font-weight-500);
@@ -54,10 +54,10 @@
54
54
  --cnvs-sys-opacity-contrast: var(--cnvs-base-opacity-500); /* Tooltips, Status Indicator */
55
55
  --cnvs-sys-opacity-overlay: var(--cnvs-base-opacity-400); /* Overlay */
56
56
  --cnvs-sys-opacity-disabled: var(--cnvs-base-opacity-300); /* Disabled states */
57
- --cnvs-sys-breakpoints-xl: calc(var(--cnvs-base-unit) * 360); /* Used for extra large screens, such as wide monitors and TVs. */
58
- --cnvs-sys-breakpoints-l: calc(var(--cnvs-base-unit) * 256); /* Large screens, such as desktops. */
59
- --cnvs-sys-breakpoints-m: calc(var(--cnvs-base-unit) * 192); /* Medium screens, such as laptops. */
60
- --cnvs-sys-breakpoints-s: calc(var(--cnvs-base-unit) * 80); /* The `min-width` for mobile devices, such as phones and tablets. */
57
+ --cnvs-sys-breakpoints-xl: 1440px; /* Used for extra large screens, such as wide monitors and TVs. */
58
+ --cnvs-sys-breakpoints-l: 1024px; /* Large screens, such as desktops. */
59
+ --cnvs-sys-breakpoints-m: 768px; /* Medium screens, such as laptops. */
60
+ --cnvs-sys-breakpoints-s: 320px; /* The `min-width` for mobile devices, such as phones and tablets. */
61
61
  --cnvs-sys-color-static-black: var(--cnvs-base-palette-black-pepper-600); /* Just black */
62
62
  --cnvs-sys-color-static-white: var(--cnvs-base-palette-french-vanilla-100); /* Just white */
63
63
  --cnvs-sys-color-static-gray-stronger: var(--cnvs-base-palette-licorice-500); /* Strongerer gray */
@@ -176,89 +176,89 @@
176
176
  }
177
177
 
178
178
  .cnvs-sys-type-subtext-small {
179
- font-family: var(--cnvs-base-font-family-50);
180
- font-weight: var(--cnvs-base-font-weight-400);
181
- line-height: var(--cnvs-base-line-height-50);
182
- font-size: var(--cnvs-base-font-size-25);
179
+ font-family: var(--cnvs-sys-font-family-default);
180
+ font-weight: var(--cnvs-sys-font-weight-normal);
181
+ line-height: var(--cnvs-sys-line-height-subtext-small);
182
+ font-size: var(--cnvs-sys-font-size-subtext-small);
183
183
  letter-spacing: var(--cnvs-base-letter-spacing-50);
184
184
  }
185
185
 
186
186
  .cnvs-sys-type-subtext-medium {
187
- font-family: var(--cnvs-base-font-family-50);
188
- font-weight: var(--cnvs-base-font-weight-400);
189
- line-height: var(--cnvs-base-line-height-50);
190
- font-size: var(--cnvs-base-font-size-50);
187
+ font-family: var(--cnvs-sys-font-family-default);
188
+ font-weight: var(--cnvs-sys-font-weight-normal);
189
+ line-height: var(--cnvs-sys-line-height-subtext-medium);
190
+ font-size: var(--cnvs-sys-font-size-subtext-medium);
191
191
  letter-spacing: var(--cnvs-base-letter-spacing-100);
192
192
  }
193
193
 
194
194
  .cnvs-sys-type-subtext-large {
195
- font-family: var(--cnvs-base-font-family-50);
196
- font-weight: var(--cnvs-base-font-weight-400);
197
- line-height: var(--cnvs-base-line-height-100);
198
- font-size: var(--cnvs-base-font-size-75);
195
+ font-family: var(--cnvs-sys-font-family-default);
196
+ font-weight: var(--cnvs-sys-font-weight-normal);
197
+ line-height: var(--cnvs-sys-line-height-subtext-large);
198
+ font-size: var(--cnvs-sys-font-size-subtext-large);
199
199
  letter-spacing: var(--cnvs-base-letter-spacing-150);
200
200
  }
201
201
 
202
202
  .cnvs-sys-type-body-small {
203
- font-family: var(--cnvs-base-font-family-50);
204
- font-weight: var(--cnvs-base-font-weight-400);
205
- line-height: var(--cnvs-base-line-height-150);
206
- font-size: var(--cnvs-base-font-size-100);
203
+ font-family: var(--cnvs-sys-font-family-default);
204
+ font-weight: var(--cnvs-sys-font-weight-normal);
205
+ line-height: var(--cnvs-sys-line-height-body-small);
206
+ font-size: var(--cnvs-sys-font-size-body-small);
207
207
  letter-spacing: var(--cnvs-base-letter-spacing-200);
208
208
  }
209
209
 
210
210
  .cnvs-sys-type-body-medium {
211
- font-family: var(--cnvs-base-font-family-50);
212
- font-weight: var(--cnvs-base-font-weight-400);
213
- line-height: var(--cnvs-base-line-height-200);
214
- font-size: var(--cnvs-base-font-size-125);
211
+ font-family: var(--cnvs-sys-font-family-default);
212
+ font-weight: var(--cnvs-sys-font-weight-normal);
213
+ line-height: var(--cnvs-sys-line-height-body-medium);
214
+ font-size: var(--cnvs-sys-font-size-body-medium);
215
215
  }
216
216
 
217
217
  .cnvs-sys-type-body-large {
218
- font-family: var(--cnvs-base-font-family-50);
219
- font-weight: var(--cnvs-base-font-weight-400);
220
- line-height: var(--cnvs-base-line-height-200);
221
- font-size: var(--cnvs-base-font-size-150);
218
+ font-family: var(--cnvs-sys-font-family-default);
219
+ font-weight: var(--cnvs-sys-font-weight-normal);
220
+ line-height: var(--cnvs-sys-line-height-body-large);
221
+ font-size: var(--cnvs-sys-font-size-body-large);
222
222
  }
223
223
 
224
224
  .cnvs-sys-type-heading-small {
225
- font-family: var(--cnvs-base-font-family-50);
226
- font-weight: var(--cnvs-base-font-weight-700);
227
- line-height: var(--cnvs-base-line-height-250);
228
- font-size: var(--cnvs-base-font-size-200);
225
+ font-family: var(--cnvs-sys-font-family-default);
226
+ font-weight: var(--cnvs-sys-font-weight-bold);
227
+ line-height: var(--cnvs-sys-line-height-heading-small);
228
+ font-size: var(--cnvs-sys-font-size-heading-small);
229
229
  }
230
230
 
231
231
  .cnvs-sys-type-heading-medium {
232
- font-family: var(--cnvs-base-font-family-50);
233
- font-weight: var(--cnvs-base-font-weight-700);
234
- line-height: var(--cnvs-base-line-height-300);
235
- font-size: var(--cnvs-base-font-size-250);
232
+ font-family: var(--cnvs-sys-font-family-default);
233
+ font-weight: var(--cnvs-sys-font-weight-bold);
234
+ line-height: var(--cnvs-sys-line-height-heading-medium);
235
+ font-size: var(--cnvs-sys-font-size-heading-medium);
236
236
  }
237
237
 
238
238
  .cnvs-sys-type-heading-large {
239
- font-family: var(--cnvs-base-font-family-50);
240
- font-weight: var(--cnvs-base-font-weight-700);
241
- line-height: var(--cnvs-base-line-height-350);
242
- font-size: var(--cnvs-base-font-size-300);
239
+ font-family: var(--cnvs-sys-font-family-default);
240
+ font-weight: var(--cnvs-sys-font-weight-bold);
241
+ line-height: var(--cnvs-sys-line-height-heading-large);
242
+ font-size: var(--cnvs-sys-font-size-heading-large);
243
243
  }
244
244
 
245
245
  .cnvs-sys-type-title-small {
246
- font-family: var(--cnvs-base-font-family-50);
247
- font-weight: var(--cnvs-base-font-weight-700);
248
- line-height: var(--cnvs-base-line-height-400);
249
- font-size: var(--cnvs-base-font-size-400);
246
+ font-family: var(--cnvs-sys-font-family-default);
247
+ font-weight: var(--cnvs-sys-font-weight-bold);
248
+ line-height: var(--cnvs-sys-line-height-title-small);
249
+ font-size: var(--cnvs-sys-font-size-title-small);
250
250
  }
251
251
 
252
252
  .cnvs-sys-type-title-medium {
253
- font-family: var(--cnvs-base-font-family-50);
254
- font-weight: var(--cnvs-base-font-weight-700);
255
- line-height: var(--cnvs-base-line-height-500);
256
- font-size: var(--cnvs-base-font-size-500);
253
+ font-family: var(--cnvs-sys-font-family-default);
254
+ font-weight: var(--cnvs-sys-font-weight-bold);
255
+ line-height: var(--cnvs-sys-line-height-title-medium);
256
+ font-size: var(--cnvs-sys-font-size-title-medium);
257
257
  }
258
258
 
259
259
  .cnvs-sys-type-title-large {
260
- font-family: var(--cnvs-base-font-family-50);
261
- font-weight: var(--cnvs-base-font-weight-700);
262
- line-height: var(--cnvs-base-line-height-600);
263
- font-size: var(--cnvs-base-font-size-600);
260
+ font-family: var(--cnvs-sys-font-family-default);
261
+ font-weight: var(--cnvs-sys-font-weight-bold);
262
+ line-height: var(--cnvs-sys-line-height-title-large);
263
+ font-size: var(--cnvs-sys-font-size-title-large);
264
264
  }