@lmvz-ds/design-tokens 0.25.0 → 0.26.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.
Files changed (6) hide show
  1. package/CHANGELOG.md +7 -0
  2. package/dist/css/custom-media.css +1 -18
  3. package/dist/css/variables.base.css +46 -23
  4. package/dist/css/variables.light.global.css +2 -1
  5. package/dist/css/variables.light.themed.css +2 -1
  6. package/package.json +1 -1
package/CHANGELOG.md CHANGED
@@ -1,5 +1,12 @@
1
1
  # @lmvz-ds/design-tokens
2
2
 
3
+ ## 0.26.0
4
+
5
+ ### Patch Changes
6
+
7
+ - 1c0f1e5: Design Tokens aktualisiert
8
+ - 72c4ec5: Design Tokens aktualisiert
9
+
3
10
  ## 0.25.0
4
11
 
5
12
  ### Patch Changes
package/dist/css/custom-media.css CHANGED
@@ -1,18 +1 @@
1
- /**
2
- * Generated by @lmvz-ds/design-tokens — do not edit.
3
- * Source: tokens.json `naming.spec-breakpoint-*`
4
- *
5
- * Skipped tokens:
6
- * --lmvz-bp-largest (value "TV" is non-numeric)
7
- */
8
- /* stylelint-disable custom-media-pattern */
9
- /* ... due to double--hyphen separator */
10
-
11
- @custom-media --lmvz-bp--from-large (min-width: 1921px);
12
- @custom-media --lmvz-bp--up-to-large (max-width: 1920px);
13
- @custom-media --lmvz-bp--from-medium (min-width: 1441px);
14
- @custom-media --lmvz-bp--up-to-medium (max-width: 1440px);
15
- @custom-media --lmvz-bp--from-small (min-width: 769px);
16
- @custom-media --lmvz-bp--up-to-small (max-width: 768px);
17
- @custom-media --lmvz-bp--from-smallest (min-width: 403px);
18
- @custom-media --lmvz-bp--up-to-smallest (max-width: 402px);
1
+ /* This file is currently empty, intentionally. */
package/dist/css/variables.base.css CHANGED
@@ -19,7 +19,8 @@
19
19
  --lmvz-component-body-sm-letter-spacing: 0;
20
20
  --lmvz-component-body-xs-letter-spacing: 0;
21
21
  --lmvz-component-body-2xs-letter-spacing: 0;
22
- --lmvz-component-card-lg-overlay-blur: 0.5rem;
22
+ --lmvz-component-modal-overlay-blur: 0.5rem;
23
+ --lmvz-component-card-container-size-query: 20rem;
23
24
  --lmvz-semantic-semantic-digital-layout-col-4: 36.8125rem;
24
25
  --lmvz-semantic-semantic-digital-layout-col-6: 45rem;
25
26
  --lmvz-semantic-semantic-digital-layout-col-8: 74.9375rem;
@@ -110,6 +111,7 @@
110
111
  --lmvz-global-line-height-160: 1.6;
111
112
  --lmvz-global-line-height-100: 1;
112
113
  --lmvz-global-line-height-180: 1.8;
114
+ --lmvz-global-line-height-150: 1.5;
113
115
  --lmvz-global-s128: 128px;
114
116
  --lmvz-global-s33: 112px;
115
117
  --lmvz-global-s96: 96px;
@@ -289,8 +291,9 @@
289
291
  --lmvz-spacing-spec-margin-xxl: 30rem;
290
292
  --lmvz-component-icon-border-width-default: var(--lmvz-global-border-width-2);
291
293
  --lmvz-component-icon-border-width-strong: var(--lmvz-global-border-width-4);
292
- --lmvz-component-line-height-narrow: var(--lmvz-global-line-height-120);
293
- --lmvz-component-line-height-default: var(--lmvz-global-line-height-140);
294
+ --lmvz-component-icon-border-width-bold: var(--lmvz-global-border-width-5);
295
+ --lmvz-component-line-height-narrow: var(--lmvz-global-line-height-140);
296
+ --lmvz-component-line-height-default: var(--lmvz-global-line-height-150);
294
297
  --lmvz-component-line-height-wide: var(--lmvz-global-line-height-160);
295
298
  --lmvz-component-component-spacing-0-default: var(--lmvz-global-s4);
296
299
  --lmvz-component-component-spacing-0-elevated: var(--lmvz-global-s8);
@@ -338,7 +341,7 @@
338
341
  --lmvz-semantic-color-surface-secondary: var(--lmvz-global-color-grey-neutral-100);
339
342
  --lmvz-semantic-color-surface-tertiary: var(--lmvz-global-color-grey-neutral-200);
340
343
  --lmvz-semantic-color-on-surface-primary: var(--lmvz-global-color-neutral-black);
341
- --lmvz-semantic-color-on-surface-secondary: var(--lmvz-global-color-grey-neutral-800);
344
+ --lmvz-semantic-color-on-surface-secondary: var(--lmvz-global-color-grey-neutral-700);
342
345
  --lmvz-semantic-color-on-surface-tertiary: var(--lmvz-global-color-grey-neutral-500);
343
346
  --lmvz-semantic-color-status-on-neutral: var(--lmvz-global-color-grey-neutral-800);
344
347
  --lmvz-semantic-color-status-on-active: var(--lmvz-global-color-brand-blue-950);
@@ -363,6 +366,7 @@
363
366
  --lmvz-semantic-color-border-subtle-hover: var(--lmvz-global-color-grey-neutral-400);
364
367
  --lmvz-semantic-color-on-surface-input-primary: var(--lmvz-global-color-neutral-black);
365
368
  --lmvz-semantic-color-on-surface-input-secondary: var(--lmvz-global-color-grey-neutral-800);
369
+ --lmvz-semantic-color-on-surface-input-tertiary: var(--lmvz-global-color-grey-neutral-700);
366
370
  --lmvz-semantic-color-brand-media1: var(--lmvz-global-color-brand-blue-400);
367
371
  --lmvz-semantic-color-brand-media2: var(--lmvz-global-color-brand-green-400);
368
372
  --lmvz-semantic-color-brand-media3: var(--lmvz-global-color-brand-yellow-300);
@@ -418,12 +422,14 @@
418
422
  --lmvz-component-body-xs-padding-bottom: var(--lmvz-dimension-4-10);
419
423
  --lmvz-component-body-2xs-font-size: var(--lmvz-dimension-8-10);
420
424
  --lmvz-component-body-2xs-line-height: var(--lmvz-component-line-height-default);
421
- --lmvz-component-card-lg-padding-x: var(--lmvz-dimension-24-48);
422
- --lmvz-component-card-lg-padding-y: var(--lmvz-dimension-36-40);
423
- --lmvz-component-card-sm-gap: var(--lmvz-dimension-16-24);
424
- --lmvz-component-card-sm-padding-x: var(--lmvz-dimension-24-28);
425
- --lmvz-component-card-sm-margin-bottom: var(--lmvz-dimension-24-32);
426
- --lmvz-component-card-sm-margin-top: var(--lmvz-dimension-24-28);
425
+ --lmvz-component-form-wrapper-gap-x: var(--lmvz-dimension-4-10);
426
+ --lmvz-component-form-wrapper-gap-y: var(--lmvz-dimension-18-28);
427
+ --lmvz-component-form-wrapper-padding-y: var(--lmvz-dimension-6-10);
428
+ --lmvz-component-wrapper-lg-padding-x: var(--lmvz-dimension-24-48);
429
+ --lmvz-component-wrapper-lg-padding-y: var(--lmvz-dimension-36-40);
430
+ --lmvz-component-buttongroup-wrapper-gap-x: var(--lmvz-dimension-4-10);
431
+ --lmvz-component-buttongroup-wrapper-gap-y: var(--lmvz-dimension-18-28);
432
+ --lmvz-component-buttongroup-wrapper-padding-y: var(--lmvz-dimension-6-10);
427
433
  --lmvz-component-component-typography-display-padding-bottom: var(--lmvz-dimension-10-13);
428
434
  --lmvz-component-component-typography-heading-xl-padding-bottom: var(--lmvz-dimension-10-13);
429
435
  --lmvz-component-component-typography-heading-lg-padding-top: var(--lmvz-dimension-12-16);
@@ -440,12 +446,6 @@
440
446
  --lmvz-component-table-border-color: var(--lmvz-semantic-color-border-default);
441
447
  --lmvz-component-table-bg: var(--lmvz-semantic-color-surface-primary);
442
448
  --lmvz-component-table-header-bg: var(--lmvz-semantic-color-surface-secondary);
443
- --lmvz-component-form-wrapper-gap-x: var(--lmvz-dimension-4-10);
444
- --lmvz-component-form-wrapper-gap-y: var(--lmvz-dimension-18-28);
445
- --lmvz-component-form-wrapper-padding-y: var(--lmvz-dimension-6-10);
446
- --lmvz-component-buttongroup-wrapper-gap-x: var(--lmvz-dimension-4-10);
447
- --lmvz-component-buttongroup-wrapper-gap-y: var(--lmvz-dimension-18-28);
448
- --lmvz-component-buttongroup-wrapper-padding-y: var(--lmvz-dimension-6-10);
449
449
  --lmvz-component-input-sm-padding-x: var(--lmvz-dimension-8-12);
450
450
  --lmvz-component-input-sm-padding-y: var(--lmvz-dimension-8-12);
451
451
  --lmvz-component-input-sm-gap-x: var(--lmvz-dimension-4-10);
@@ -461,12 +461,22 @@
461
461
  --lmvz-component-input-padding-sm: var(--lmvz-dimension-12-14);
462
462
  --lmvz-component-input-padding-md: var(--lmvz-dimension-14-16);
463
463
  --lmvz-component-input-padding-lg: var(--lmvz-dimension-16-20);
464
- --lmvz-component-input-gap-sm: var(--lmvz-dimension-8-12);
465
- --lmvz-component-input-gap-md: var(--lmvz-dimension-12-16);
466
- --lmvz-component-input-gap-lg: var(--lmvz-dimension-16-20);
467
- --lmvz-component-input-wrapper-padding-y-sm: var(--lmvz-dimension-10-12);
468
- --lmvz-component-input-wrapper-padding-y-md: var(--lmvz-dimension-16-20);
464
+ --lmvz-component-input-gap-sm: var(--lmvz-dimension-6-10);
465
+ --lmvz-component-input-gap-md: var(--lmvz-dimension-8-12);
466
+ --lmvz-component-input-gap-lg: var(--lmvz-dimension-12-16);
467
+ --lmvz-component-input-wrapper-padding-sm-y: var(--lmvz-dimension-10-12);
468
+ --lmvz-component-input-wrapper-padding-md-y: var(--lmvz-dimension-16-20);
469
469
  --lmvz-component-input-bg: var(--lmvz-semantic-color-surface-primary);
470
+ --lmvz-component-spacing-lg: var(--lmvz-dimension-16-24);
471
+ --lmvz-component-spacing-5xl: var(--lmvz-dimension-80-128);
472
+ --lmvz-component-spacing-4xl: var(--lmvz-dimension-64-96);
473
+ --lmvz-component-spacing-3xl: var(--lmvz-dimension-48-64);
474
+ --lmvz-component-spacing-2xl: var(--lmvz-dimension-32-48);
475
+ --lmvz-component-spacing-xl: var(--lmvz-dimension-24-32);
476
+ --lmvz-component-spacing-md: var(--lmvz-dimension-12-16);
477
+ --lmvz-component-spacing-sm: var(--lmvz-dimension-8-12);
478
+ --lmvz-component-spacing-xs: var(--lmvz-dimension-4-8);
479
+ --lmvz-component-spacing-2xs: var(--lmvz-dimension-2-4);
470
480
  --lmvz-semantic-border-radius-xl: var(--lmvz-dimension-18-24);
471
481
  --lmvz-semantic-border-radius-lg: var(--lmvz-dimension-14-16);
472
482
  --lmvz-semantic-border-radius-md: var(--lmvz-dimension-6-8);
@@ -475,8 +485,21 @@
475
485
  --lmvz-semantic-color-surface-input-primary: var(--lmvz-semantic-color-surface-primary);
476
486
  --lmvz-semantic-color-gradient-main-1: var(--lmvz-semantic-color-status-on-active);
477
487
  --lmvz-semantic-color-gradient-main-2: var(--lmvz-semantic-color-status-on-active);
478
- --lmvz-component-card-lg-border-radius: var(--lmvz-semantic-border-radius-xl);
479
- --lmvz-component-card-sm-border-radius: var(--lmvz-semantic-border-radius-xl);
488
+ --lmvz-component-wrapper-lg-border-radius: var(--lmvz-semantic-border-radius-xl);
489
+ --lmvz-component-card-lg-grid-gap-x: var(--lmvz-component-spacing-lg);
490
+ --lmvz-component-wrapper-md-padding-x: var(--lmvz-component-spacing-lg);
491
+ --lmvz-component-card-lg-margin-bottom: var(--lmvz-component-spacing-lg);
492
+ --lmvz-component-wrapper-md-padding-y: var(--lmvz-component-spacing-lg);
493
+ --lmvz-component-wrapper-md-border-radius: var(--lmvz-semantic-border-radius-xl);
494
+ --lmvz-component-card-lg-grid-gap-y: var(--lmvz-component-spacing-xl);
495
+ --lmvz-component-wrapper-sm-padding-x: var(--lmvz-component-spacing-md);
496
+ --lmvz-component-wrapper-sm-padding-y: var(--lmvz-component-spacing-md);
497
+ --lmvz-component-card-sm-margin-bottom: var(--lmvz-component-spacing-md);
498
+ --lmvz-component-wrapper-sm-border-radius: var(--lmvz-semantic-border-radius-lg);
499
+ --lmvz-component-card-sm-grid-gap-x: var(--lmvz-component-spacing-md);
500
+ --lmvz-component-card-sm-grid-gap-y: var(--lmvz-component-spacing-lg);
501
+ --lmvz-component-filter-padding-top: var(--lmvz-component-spacing-xs);
502
+ --lmvz-component-filter-padding-bottom: var(--lmvz-component-spacing-xl);
480
503
  }
481
504
  /**
482
505
  * Fluid ramp tokens generated from our global dimension scale tokens.
package/dist/css/variables.light.global.css CHANGED
@@ -56,7 +56,7 @@
56
56
  --lmvz-semantic-color-surface-secondary: var(--lmvz-global-color-grey-neutral-100);
57
57
  --lmvz-semantic-color-surface-tertiary: var(--lmvz-global-color-grey-neutral-200);
58
58
  --lmvz-semantic-color-on-surface-primary: var(--lmvz-global-color-neutral-black);
59
- --lmvz-semantic-color-on-surface-secondary: var(--lmvz-global-color-grey-neutral-800);
59
+ --lmvz-semantic-color-on-surface-secondary: var(--lmvz-global-color-grey-neutral-700);
60
60
  --lmvz-semantic-color-on-surface-tertiary: var(--lmvz-global-color-grey-neutral-500);
61
61
  --lmvz-semantic-color-status-on-neutral: var(--lmvz-global-color-grey-neutral-800);
62
62
  --lmvz-semantic-color-status-on-active: var(--lmvz-global-color-brand-blue-950);
@@ -81,6 +81,7 @@
81
81
  --lmvz-semantic-color-border-subtle-hover: var(--lmvz-global-color-grey-neutral-400);
82
82
  --lmvz-semantic-color-on-surface-input-primary: var(--lmvz-global-color-neutral-black);
83
83
  --lmvz-semantic-color-on-surface-input-secondary: var(--lmvz-global-color-grey-neutral-800);
84
+ --lmvz-semantic-color-on-surface-input-tertiary: var(--lmvz-global-color-grey-neutral-700);
84
85
  --lmvz-semantic-color-brand-media1: var(--lmvz-global-color-brand-blue-400);
85
86
  --lmvz-semantic-color-brand-media2: var(--lmvz-global-color-brand-green-400);
86
87
  --lmvz-semantic-color-brand-media3: var(--lmvz-global-color-brand-yellow-300);
package/dist/css/variables.light.themed.css CHANGED
@@ -56,7 +56,7 @@
56
56
  --lmvz-semantic-color-surface-secondary: var(--lmvz-global-color-grey-neutral-100);
57
57
  --lmvz-semantic-color-surface-tertiary: var(--lmvz-global-color-grey-neutral-200);
58
58
  --lmvz-semantic-color-on-surface-primary: var(--lmvz-global-color-neutral-black);
59
- --lmvz-semantic-color-on-surface-secondary: var(--lmvz-global-color-grey-neutral-800);
59
+ --lmvz-semantic-color-on-surface-secondary: var(--lmvz-global-color-grey-neutral-700);
60
60
  --lmvz-semantic-color-on-surface-tertiary: var(--lmvz-global-color-grey-neutral-500);
61
61
  --lmvz-semantic-color-status-on-neutral: var(--lmvz-global-color-grey-neutral-800);
62
62
  --lmvz-semantic-color-status-on-active: var(--lmvz-global-color-brand-blue-950);
@@ -81,6 +81,7 @@
81
81
  --lmvz-semantic-color-border-subtle-hover: var(--lmvz-global-color-grey-neutral-400);
82
82
  --lmvz-semantic-color-on-surface-input-primary: var(--lmvz-global-color-neutral-black);
83
83
  --lmvz-semantic-color-on-surface-input-secondary: var(--lmvz-global-color-grey-neutral-800);
84
+ --lmvz-semantic-color-on-surface-input-tertiary: var(--lmvz-global-color-grey-neutral-700);
84
85
  --lmvz-semantic-color-brand-media1: var(--lmvz-global-color-brand-blue-400);
85
86
  --lmvz-semantic-color-brand-media2: var(--lmvz-global-color-brand-green-400);
86
87
  --lmvz-semantic-color-brand-media3: var(--lmvz-global-color-brand-yellow-300);
package/package.json CHANGED
@@ -2,7 +2,7 @@
2
2
  "name": "@lmvz-ds/design-tokens",
3
3
  "private": false,
4
4
  "type": "module",
5
- "version": "0.25.0",
5
+ "version": "0.26.0",
6
6
  "author": "Patrick Nemenz <patrick.nemenz@adesso.at>",
7
7
  "license": "UNLICENSED",
8
8
  "publishConfig": {