@pantheon-systems/pds-design-tokens 1.0.0-dev.110 → 1.0.0-dev.112

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/build/css/pds-design-tokens-dark-mode.css +28 -21
  2. package/build/css/pds-design-tokens-light-mode.css +26 -19
  3. package/build/figma/pds-design-tokens-figma.json +2546 -1892
  4. package/build/json/pds-design-tokens-dark-mode.json +760 -563
  5. package/build/json/pds-design-tokens-light-mode.json +759 -556
  6. package/package.json +1 -1
package/build/css/pds-design-tokens-dark-mode.css CHANGED
@@ -14,25 +14,36 @@
14
14
  --pds-color-background-default: #1d1d29;
15
15
  --pds-color-background-default-secondary: #282839;
16
16
  --pds-color-background-reverse: #e7e7eb;
17
- --pds-color-badge-border: #a6a3b4;
18
17
  --pds-color-badge-indicator-diamond-background: #f0fdff;
19
18
  --pds-color-badge-indicator-diamond-foreground: #388bff;
20
- --pds-color-badge-indicator-early-access-background: #2abb7f;
21
- --pds-color-badge-indicator-early-access-foreground: #133527;
22
19
  --pds-color-badge-indicator-gold-background: #fff1a9;
23
20
  --pds-color-badge-indicator-gold-foreground: #705e00;
21
+ --pds-color-badge-indicator-info-background: #388bff;
22
+ --pds-color-badge-indicator-info-foreground: #ffffff;
23
+ --pds-color-badge-indicator-neutral-background: #504e62;
24
+ --pds-color-badge-indicator-neutral-foreground: #ffffff;
24
25
  --pds-color-badge-indicator-platinum-background: #d0c6ff;
25
26
  --pds-color-badge-indicator-platinum-foreground: #4e39a8;
26
- --pds-color-badge-indicator-silver-background: #e7e7eb;
27
- --pds-color-badge-indicator-silver-foreground: #504e62;
28
- --pds-color-badge-label: #e7e7eb;
29
- --pds-color-badge-status-critical: var(--pds-color-semantic-critical-foreground);
30
- --pds-color-badge-status-default: #858299;
31
- --pds-color-badge-status-discovery: var(--pds-color-semantic-discovery-foreground);
32
- --pds-color-badge-status-frozen: #d0c6ff;
33
- --pds-color-badge-status-info: var(--pds-color-semantic-info-foreground);
34
- --pds-color-badge-status-success: var(--pds-color-semantic-success-foreground);
35
- --pds-color-badge-status-warning: var(--pds-color-semantic-warning-foreground);
27
+ --pds-color-badge-indicator-silver-background: #a6a3b4;
28
+ --pds-color-badge-indicator-silver-foreground: var(--pds-color-text-default-secondary);
29
+ --pds-color-badge-indicator-success-background: #2abb7f;
30
+ --pds-color-badge-indicator-success-foreground: #ffffff;
31
+ --pds-color-badge-status-dark-background: var(--pds-color-background-reverse);
32
+ --pds-color-badge-status-dark-border: var(--pds-color-background-reverse);
33
+ --pds-color-badge-status-dark-label: var(--pds-color-text-reverse);
34
+ --pds-color-badge-status-dot-critical: var(--pds-color-semantic-critical-foreground);
35
+ --pds-color-badge-status-dot-default: #858299;
36
+ --pds-color-badge-status-dot-discovery: var(--pds-color-semantic-discovery-foreground);
37
+ --pds-color-badge-status-dot-frozen: #d0c6ff;
38
+ --pds-color-badge-status-dot-info: var(--pds-color-semantic-info-foreground);
39
+ --pds-color-badge-status-dot-success: var(--pds-color-semantic-success-foreground);
40
+ --pds-color-badge-status-dot-warning: var(--pds-color-semantic-warning-foreground);
41
+ --pds-color-badge-status-light-background: var(--pds-color-background-default);
42
+ --pds-color-badge-status-light-border: var(--pds-color-border-default);
43
+ --pds-color-badge-status-light-label: var(--pds-color-text-default-secondary);
44
+ --pds-color-badge-status-transparent-background: rgba(0, 0, 0, 0);
45
+ --pds-color-badge-status-transparent-border: var(--pds-color-border-default);
46
+ --pds-color-badge-status-transparent-label: var(--pds-color-text-default-secondary);
36
47
  --pds-color-banner-critical-background: linear-gradient(135deg, #CA3521 0%, #B95898 100%);
37
48
  --pds-color-banner-critical-foreground: #ffffff;
38
49
  --pds-color-banner-info-background: linear-gradient(315deg, #1265DA 0%, #5F41E5 100%);
@@ -111,14 +122,10 @@
111
122
  --pds-color-gradient-midnight: linear-gradient(228.64deg, #1B0874 46.34%, #00E0C3 100%);
112
123
  --pds-color-gradient-sunrise: linear-gradient(227.79deg, #1B0874 38.28%, #E65F35 100%);
113
124
  --pds-color-gradient-sunset: linear-gradient(48.24deg, #EF13AD 0%, #1B0874 66.25%);
114
- --pds-color-icon-button-critical-background-active: var(--pds-color-button-critical-background-active);
115
- --pds-color-icon-button-critical-background-default: var(--pds-color-button-critical-background-default);
116
- --pds-color-icon-button-critical-background-hover: var(--pds-color-button-critical-background-hover);
117
- --pds-color-icon-button-critical-foreground-default: var(--pds-color-button-critical-foreground-default);
118
- --pds-color-icon-button-standard-background-active: #858299;
119
- --pds-color-icon-button-standard-background-default: rgba(0, 0, 0, 0);
120
- --pds-color-icon-button-standard-background-hover: #a6a3b4;
121
- --pds-color-icon-button-standard-foreground-default: #ffffff;
125
+ --pds-color-icon-button-background-active: #858299;
126
+ --pds-color-icon-button-background-default: rgba(0, 0, 0, 0);
127
+ --pds-color-icon-button-background-hover: #a6a3b4;
128
+ --pds-color-icon-button-foreground-default: #ffffff;
122
129
  --pds-color-input-action-background-hover: #504e62;
123
130
  --pds-color-input-background-critical: #1d1d29;
124
131
  --pds-color-input-background-default: #1d1d29;
package/build/css/pds-design-tokens-light-mode.css CHANGED
@@ -14,25 +14,36 @@
14
14
  --pds-color-background-default: #ffffff;
15
15
  --pds-color-background-default-secondary: #f8f8f8;
16
16
  --pds-color-background-reverse: #23232d;
17
- --pds-color-badge-border: var(--pds-color-border-default);
18
17
  --pds-color-badge-indicator-diamond-background: #f0fdff;
19
18
  --pds-color-badge-indicator-diamond-foreground: #1d7afc;
20
- --pds-color-badge-indicator-early-access-background: #e3fcef;
21
- --pds-color-badge-indicator-early-access-foreground: #218c5f;
22
19
  --pds-color-badge-indicator-gold-background: #fff1a9;
23
20
  --pds-color-badge-indicator-gold-foreground: #705e00;
21
+ --pds-color-badge-indicator-info-background: #1d7afc;
22
+ --pds-color-badge-indicator-info-foreground: #ffffff;
23
+ --pds-color-badge-indicator-neutral-background: #6d6d78;
24
+ --pds-color-badge-indicator-neutral-foreground: #ffffff;
24
25
  --pds-color-badge-indicator-platinum-background: #f0ecff;
25
26
  --pds-color-badge-indicator-platinum-foreground: #3017a1;
26
27
  --pds-color-badge-indicator-silver-background: #f1f1f1;
27
28
  --pds-color-badge-indicator-silver-foreground: var(--pds-color-text-default-secondary);
28
- --pds-color-badge-label: var(--pds-color-text-default-secondary);
29
- --pds-color-badge-status-critical: var(--pds-color-semantic-critical-foreground);
30
- --pds-color-badge-status-default: #cfcfd3;
31
- --pds-color-badge-status-discovery: var(--pds-color-semantic-discovery-foreground);
32
- --pds-color-badge-status-frozen: #e5dbff;
33
- --pds-color-badge-status-info: var(--pds-color-semantic-info-foreground);
34
- --pds-color-badge-status-success: var(--pds-color-semantic-success-foreground);
35
- --pds-color-badge-status-warning: var(--pds-color-semantic-warning-foreground);
29
+ --pds-color-badge-indicator-success-background: #218c5f;
30
+ --pds-color-badge-indicator-success-foreground: #ffffff;
31
+ --pds-color-badge-status-dark-background: var(--pds-color-background-reverse);
32
+ --pds-color-badge-status-dark-border: var(--pds-color-background-reverse);
33
+ --pds-color-badge-status-dark-label: var(--pds-color-text-reverse);
34
+ --pds-color-badge-status-dot-critical: var(--pds-color-semantic-critical-foreground);
35
+ --pds-color-badge-status-dot-default: #cfcfd3;
36
+ --pds-color-badge-status-dot-discovery: var(--pds-color-semantic-discovery-foreground);
37
+ --pds-color-badge-status-dot-frozen: #e5dbff;
38
+ --pds-color-badge-status-dot-info: var(--pds-color-semantic-info-foreground);
39
+ --pds-color-badge-status-dot-success: var(--pds-color-semantic-success-foreground);
40
+ --pds-color-badge-status-dot-warning: var(--pds-color-semantic-warning-foreground);
41
+ --pds-color-badge-status-light-background: var(--pds-color-background-default);
42
+ --pds-color-badge-status-light-border: var(--pds-color-border-default);
43
+ --pds-color-badge-status-light-label: var(--pds-color-text-default-secondary);
44
+ --pds-color-badge-status-transparent-background: rgba(0, 0, 0, 0);
45
+ --pds-color-badge-status-transparent-border: var(--pds-color-border-default);
46
+ --pds-color-badge-status-transparent-label: var(--pds-color-text-default-secondary);
36
47
  --pds-color-banner-critical-background: linear-gradient(135deg, #CA3521 0%, #B95898 100%);
37
48
  --pds-color-banner-critical-foreground: #ffffff;
38
49
  --pds-color-banner-info-background: linear-gradient(315deg, #1265DA 0%, #5F41E5 100%);
@@ -111,14 +122,10 @@
111
122
  --pds-color-gradient-midnight: linear-gradient(228.64deg, #1B0874 46.34%, #00E0C3 100%);
112
123
  --pds-color-gradient-sunrise: linear-gradient(227.79deg, #1B0874 38.28%, #E65F35 100%);
113
124
  --pds-color-gradient-sunset: linear-gradient(48.24deg, #EF13AD 0%, #1B0874 66.25%);
114
- --pds-color-icon-button-critical-background-active: var(--pds-color-button-critical-background-active);
115
- --pds-color-icon-button-critical-background-default: var(--pds-color-button-critical-background-default);
116
- --pds-color-icon-button-critical-background-hover: var(--pds-color-button-critical-background-hover);
117
- --pds-color-icon-button-critical-foreground-default: var(--pds-color-button-critical-foreground-default);
118
- --pds-color-icon-button-standard-background-active: #cfcfd3;
119
- --pds-color-icon-button-standard-background-default: rgba(0, 0, 0, 0);
120
- --pds-color-icon-button-standard-background-hover: #f1f1f1;
121
- --pds-color-icon-button-standard-foreground-default: #23232d;
125
+ --pds-color-icon-button-background-active: #cfcfd3;
126
+ --pds-color-icon-button-background-default: rgba(0, 0, 0, 0);
127
+ --pds-color-icon-button-background-hover: #f1f1f1;
128
+ --pds-color-icon-button-foreground-default: #23232d;
122
129
  --pds-color-input-action-background-hover: #f8f8f8;
123
130
  --pds-color-input-background-critical: #ffedeb;
124
131
  --pds-color-input-background-default: #ffffff;