@pantheon-systems/pds-design-tokens 0.7.0-dev.7 → 1.0.0-dev.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 (11) hide show
  1. package/build/css/pds-design-tokens-dark-mode.css +19 -10
  2. package/build/css/pds-design-tokens-light-mode.css +20 -11
  3. package/build/css/pds-design-tokens.css +3 -0
  4. package/build/figma/pds-design-tokens-figma.json +901 -400
  5. package/build/json/pds-design-tokens-dark-mode.json +291 -31
  6. package/build/json/pds-design-tokens-light-mode.json +302 -134
  7. package/build/json/pds-design-tokens.json +67 -0
  8. package/build/scss/_pds-design-tokens-dark-mode.scss +19 -10
  9. package/build/scss/_pds-design-tokens-light-mode.scss +20 -11
  10. package/build/scss/_pds-design-tokens.scss +3 -0
  11. package/package.json +1 -1
package/build/css/pds-design-tokens-dark-mode.css CHANGED
@@ -14,7 +14,16 @@
14
14
  --pds-color-border-default: #504e62;
15
15
  --pds-color-brand-accent-default: #de0093;
16
16
  --pds-color-brand-primary-default: #ffdc28;
17
- --pds-color-brand-secondary-default: #3017a1;
17
+ --pds-color-brand-secondary-default: #785aff;
18
+ --pds-color-button-brand-background-active: #ddbd16;
19
+ --pds-color-button-brand-background-default: #ffdc28;
20
+ --pds-color-button-brand-background-hover: #ffe668;
21
+ --pds-color-button-brand-border-active: #ddbd16;
22
+ --pds-color-button-brand-border-default: #ffdc28;
23
+ --pds-color-button-brand-border-hover: #ffe668;
24
+ --pds-color-button-brand-foreground-active: #121219;
25
+ --pds-color-button-brand-foreground-default: #121219;
26
+ --pds-color-button-brand-foreground-hover: #121219;
18
27
  --pds-color-button-critical-background-active: #9c2f2f;
19
28
  --pds-color-button-critical-background-default: #e05757;
20
29
  --pds-color-button-critical-background-hover: #be4242;
@@ -24,15 +33,15 @@
24
33
  --pds-color-button-critical-foreground-active: #ffffff;
25
34
  --pds-color-button-critical-foreground-default: #ffffff;
26
35
  --pds-color-button-critical-foreground-hover: #ffffff;
27
- --pds-color-button-primary-background-active: #ddbd16;
28
- --pds-color-button-primary-background-default: #ffdc28;
29
- --pds-color-button-primary-background-hover: #ffe668;
30
- --pds-color-button-primary-border-active: #ddbd16;
31
- --pds-color-button-primary-border-default: #ffdc28;
32
- --pds-color-button-primary-border-hover: #ffe668;
33
- --pds-color-button-primary-foreground-active: #121219;
34
- --pds-color-button-primary-foreground-default: #121219;
35
- --pds-color-button-primary-foreground-hover: #121219;
36
+ --pds-color-button-primary-background-active: #785aff;
37
+ --pds-color-button-primary-background-default: #967fff;
38
+ --pds-color-button-primary-background-hover: #b5a4ff;
39
+ --pds-color-button-primary-border-active: #785aff;
40
+ --pds-color-button-primary-border-default: #967fff;
41
+ --pds-color-button-primary-border-hover: #b5a4ff;
42
+ --pds-color-button-primary-foreground-active: #ffffff;
43
+ --pds-color-button-primary-foreground-default: #ffffff;
44
+ --pds-color-button-primary-foreground-hover: #ffffff;
36
45
  --pds-color-button-secondary-background-active: #282839;
37
46
  --pds-color-button-secondary-background-default: rgba(0, 0, 0, 0);
38
47
  --pds-color-button-secondary-background-hover: #504e62;
package/build/css/pds-design-tokens-light-mode.css CHANGED
@@ -15,24 +15,33 @@
15
15
  --pds-color-brand-accent-default: #de0093;
16
16
  --pds-color-brand-primary-default: #ffdc28;
17
17
  --pds-color-brand-secondary-default: #3017a1;
18
- --pds-color-button-critical-background-active: #920303;
18
+ --pds-color-button-brand-background-active: #ddbd16;
19
+ --pds-color-button-brand-background-default: #ffdc28;
20
+ --pds-color-button-brand-background-hover: #ffe668;
21
+ --pds-color-button-brand-border-active: #ddbd16;
22
+ --pds-color-button-brand-border-default: #ffdc28;
23
+ --pds-color-button-brand-border-hover: #ffe668;
24
+ --pds-color-button-brand-foreground-active: #23232d;
25
+ --pds-color-button-brand-foreground-default: #23232d;
26
+ --pds-color-button-brand-foreground-hover: #23232d;
27
+ --pds-color-button-critical-background-active: #700000;
19
28
  --pds-color-button-critical-background-default: #d61f1f;
20
29
  --pds-color-button-critical-background-hover: #f83333;
21
- --pds-color-button-critical-border-active: #920303;
30
+ --pds-color-button-critical-border-active: #700000;
22
31
  --pds-color-button-critical-border-default: #d61f1f;
23
32
  --pds-color-button-critical-border-hover: #f83333;
24
33
  --pds-color-button-critical-foreground-active: #ffffff;
25
34
  --pds-color-button-critical-foreground-default: #ffffff;
26
35
  --pds-color-button-critical-foreground-hover: #ffffff;
27
- --pds-color-button-primary-background-active: #ddbd16;
28
- --pds-color-button-primary-background-default: #ffdc28;
29
- --pds-color-button-primary-background-hover: #ffe668;
30
- --pds-color-button-primary-border-active: #ddbd16;
31
- --pds-color-button-primary-border-default: #ffdc28;
32
- --pds-color-button-primary-border-hover: #ffe668;
33
- --pds-color-button-primary-foreground-active: #23232d;
34
- --pds-color-button-primary-foreground-default: #23232d;
35
- --pds-color-button-primary-foreground-hover: #23232d;
36
+ --pds-color-button-primary-background-active: #11005d;
37
+ --pds-color-button-primary-background-default: #3017a1;
38
+ --pds-color-button-primary-background-hover: #785aff;
39
+ --pds-color-button-primary-border-active: #11005d;
40
+ --pds-color-button-primary-border-default: #3017a1;
41
+ --pds-color-button-primary-border-hover: #785aff;
42
+ --pds-color-button-primary-foreground-active: #ffffff;
43
+ --pds-color-button-primary-foreground-default: #ffffff;
44
+ --pds-color-button-primary-foreground-hover: #ffffff;
36
45
  --pds-color-button-secondary-background-active: #cfcfd3;
37
46
  --pds-color-button-secondary-background-default: rgba(0, 0, 0, 0);
38
47
  --pds-color-button-secondary-background-hover: #f0ecff;
package/build/css/pds-design-tokens.css CHANGED
@@ -10,6 +10,9 @@
10
10
  */
11
11
 
12
12
  :root {
13
+ --pds-animation-transition-delay: 0s;
14
+ --pds-animation-transition-duration: 200ms;
15
+ --pds-animation-transition-timing-function: ease-in-out;
13
16
  --pds-border-radius-default: 0.1875rem;
14
17
  --pds-border-width-default: 1px;
15
18
  --pds-typography-font-default: 'Poppins', sans-serif;