@progressiveui/themes-core 0.4.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 (29) hide show
  1. package/.env +1 -0
  2. package/CHANGELOG.md +435 -0
  3. package/README.md +81 -0
  4. package/dist/json/variables-full.json +19116 -0
  5. package/dist/scss/default-css-theme.scss +761 -0
  6. package/dist/scss/tokens.scss +430 -0
  7. package/dist/scss/tokensMapDeep.scss +1175 -0
  8. package/dist/scss/tokensMapFlat.scss +438 -0
  9. package/distDark/json/variables-full.json +2790 -0
  10. package/distDark/scss/default-css-theme.scss +67 -0
  11. package/distDark/scss/tokens.scss +141 -0
  12. package/distDark/scss/tokensMapDeep.scss +67 -0
  13. package/distDark/scss/tokensMapFlat.scss +68 -0
  14. package/figmaTokenStudio/tokens.json +2425 -0
  15. package/package.json +39 -0
  16. package/scripts/config.js +315 -0
  17. package/scripts/filterJson.js +99 -0
  18. package/scripts/runTheme.js +7 -0
  19. package/scripts/syncTokens.js +46 -0
  20. package/tokens/design-tokens.tokens.json.legacy +2942 -0
  21. package/tokens/design-tokens.tokens.new.json +2542 -0
  22. package/tokens/font-sizes.json +186 -0
  23. package/tokens/spacings.json.legacy +52 -0
  24. package/tokens/typeScale.json +145 -0
  25. package/tokensDark/color/base.json.legacy +13 -0
  26. package/tokensDark/design-tokens.tokens.json +2846 -0
  27. package/tokensDark/tokens.json.raw +2834 -0
  28. package/tokensDark/typeScale.json +133 -0
  29. package/yarn-error.log +61 -0
package/distDark/scss/default-css-theme.scss ADDED
@@ -0,0 +1,67 @@
1
+ /**
2
+ * Do not edit directly
3
+ * Generated on Mon, 27 Feb 2023 09:30:25 GMT
4
+ */
5
+
6
+ @mixin theme-dark () {
7
+ --typography-body-regular-font-weight: regular;
8
+ --typography-body-regular-font-size: 0.75em;
9
+ --typography-story-sub-title-text-transform: uppercase;
10
+ --typography-story-sub-title-letter-spacing: 0.05em;
11
+ --typography-story-sub-title-font-weight: 500;
12
+ --typography-story-sub-title-font-size: 0.75em;
13
+ --typography-story-h6-font-weight: 600;
14
+ --typography-story-h6-font-size: 1em;
15
+ --typography-story-h5-font-weight: 600;
16
+ --typography-story-h5-font-size: 1.125em;
17
+ --typography-story-h4-font-weight: 600;
18
+ --typography-story-h4-font-size: 1.25em;
19
+ --typography-story-h3-font-weight: 600;
20
+ --typography-story-h3-font-size: 1.375em;
21
+ --typography-story-h2-font-weight: 600;
22
+ --typography-story-h2-font-size: 1.5625em;
23
+ --typography-story-h1-font-weight: 600;
24
+ --typography-story-h1-font-size: 1.8125em;
25
+ --typography-story-title-font-weight: 300;
26
+ --typography-story-title-font-size: 3.125em;
27
+ --typography-input-font-weight: regular;
28
+ --typography-input-font-size: 1em;
29
+ --typography-helper-font-weight: regular;
30
+ --typography-helper-font-size: 0.875em;
31
+ --typography-caption-font-weight: regular;
32
+ --typography-caption-font-size: 0.875em;
33
+ --spacing-1000: 6em;
34
+ --spacing-900: 5em;
35
+ --spacing-800: 4em;
36
+ --spacing-700: 3em;
37
+ --spacing-600: 2.5em;
38
+ --spacing-500: 2em;
39
+ --spacing-400: 1.5em;
40
+ --spacing-300: 1em;
41
+ --spacing-200: 0.75em;
42
+ --spacing-100: 0.5em;
43
+ --spacing-75: 0.25em;
44
+ --spacing-50: 0.125em;
45
+ --support-warning-light: #222d32ff;
46
+ --support-error-light: #310d11ff;
47
+ --support-success-light: #143416ff;
48
+ --link-primary: #0779f1ff;
49
+ --link-primary-hover: #369ce3ff;
50
+ --border-strong: #2f3943ff;
51
+ --border-subtle: #1f262eff;
52
+ --button-tertiary-hover: #2e3e4fff;
53
+ --button-tertiary: #263443ff;
54
+ --button-secondary-hover: #2889ccff;
55
+ --button-primary-hover: #2889ccff;
56
+ --button-primary: #0779f1ff;
57
+ --layer-primary: #1b2327ff;
58
+ --text-secondary: #5a6872ff;
59
+ --text-on-color: #fafafaff;
60
+ --text-primary: #ffffffff;
61
+ --background-inverse: #121a1eff;
62
+ --background-inverse-hover: #222b32ff;
63
+ --background-main: #121517ff;
64
+ --field-border: #3e4c54ff;
65
+ --field: #262e34ff;
66
+ --brand: #007dbcff;
67
+ }
package/distDark/scss/tokens.scss ADDED
@@ -0,0 +1,141 @@
1
+ $brand: var(--brand, "#007dbcff") !default;
2
+ $field: var(--field, "#262e34ff") !default;
3
+ $field-border: var(--field-border, "#3e4c54ff") !default;
4
+ $background-main: var(--background-main, "#121517ff") !default;
5
+ $background-inverse-hover: var(
6
+ --background-inverse-hover,
7
+ "#222b32ff"
8
+ ) !default;
9
+ $background-inverse: var(--background-inverse, "#121a1eff") !default;
10
+ $text-body-default: var(--text-primary, "#ffffffff") !default;
11
+ $text-inverse: var(--text-on-color, "#fafafaff") !default;
12
+ $text-body-secondary: var(--text-secondary, "#5a6872ff") !default;
13
+ $layer-primary: var(--layer-primary, "#1b2327ff") !default;
14
+ $button-primary: var(--button-primary, "#0779f1ff") !default;
15
+ $button-primary-hover: var(--button-primary-hover, "#2889ccff") !default;
16
+ $button-secondary-hover: var(--button-secondary-hover, "#2889ccff") !default;
17
+ $button-tertiary: var(--button-tertiary, "#263443ff") !default;
18
+ $button-tertiary-hover: var(--button-tertiary-hover, "#2e3e4fff") !default;
19
+ $border-subtle: var(--border-subtle, "#1f262eff") !default;
20
+ $border-strong: var(--border-strong, "#2f3943ff") !default;
21
+ $action-default-link-default-hover: var(
22
+ --link-primary-hover,
23
+ "#369ce3ff"
24
+ ) !default;
25
+ $action-default-link-default: var(--link-primary, "#0779f1ff") !default;
26
+ $support-success-background: var(--support-success-light, "#143416ff") !default;
27
+ $support-error-background: var(--support-error-light, "#310d11ff") !default;
28
+ $support-warning-background: var(--support-warning-light, "#222d32ff") !default;
29
+ $spacing-50: var(--spacing-50, "0.125em") !default;
30
+ $spacing-75: var(--spacing-75, "0.25em") !default;
31
+ $spacing-100: var(--spacing-100, "0.5em") !default;
32
+ $spacing-200: var(--spacing-200, "0.75em") !default;
33
+ $spacing-300: var(--spacing-300, "1em") !default;
34
+ $spacing-400: var(--spacing-400, "1.5em") !default;
35
+ $spacing-500: var(--spacing-500, "2em") !default;
36
+ $spacing-600: var(--spacing-600, "2.5em") !default;
37
+ $spacing-700: var(--spacing-700, "3em") !default;
38
+ $spacing-800: var(--spacing-800, "4em") !default;
39
+ $spacing-900: var(--spacing-900, "5em") !default;
40
+ $spacing-1000: var(--spacing-1000, "6em") !default;
41
+ $typography-caption-font-size: var(
42
+ --typography-caption-font-size,
43
+ "0.875em"
44
+ ) !default;
45
+ $typography-caption-font-weight: var(
46
+ --typography-caption-font-weight,
47
+ "regular"
48
+ ) !default;
49
+ $typography-helper-font-size: var(
50
+ --typography-helper-font-size,
51
+ "0.875em"
52
+ ) !default;
53
+ $typography-helper-font-weight: var(
54
+ --typography-helper-font-weight,
55
+ "regular"
56
+ ) !default;
57
+ $typography-input-font-size: var(--typography-input-font-size, "1em") !default;
58
+ $typography-input-font-weight: var(
59
+ --typography-input-font-weight,
60
+ "regular"
61
+ ) !default;
62
+ $typography-story-title-font-size: var(
63
+ --typography-story-title-font-size,
64
+ "3.125em"
65
+ ) !default;
66
+ $typography-story-title-font-weight: var(
67
+ --typography-story-title-font-weight,
68
+ "300"
69
+ ) !default;
70
+ $typography-story-h1-font-size: var(
71
+ --typography-story-h1-font-size,
72
+ "1.8125em"
73
+ ) !default;
74
+ $typography-story-h1-font-weight: var(
75
+ --typography-story-h1-font-weight,
76
+ "600"
77
+ ) !default;
78
+ $typography-story-h2-font-size: var(
79
+ --typography-story-h2-font-size,
80
+ "1.5625em"
81
+ ) !default;
82
+ $typography-story-h2-font-weight: var(
83
+ --typography-story-h2-font-weight,
84
+ "600"
85
+ ) !default;
86
+ $typography-story-h3-font-size: var(
87
+ --typography-story-h3-font-size,
88
+ "1.375em"
89
+ ) !default;
90
+ $typography-story-h3-font-weight: var(
91
+ --typography-story-h3-font-weight,
92
+ "600"
93
+ ) !default;
94
+ $typography-story-h4-font-size: var(
95
+ --typography-story-h4-font-size,
96
+ "1.25em"
97
+ ) !default;
98
+ $typography-story-h4-font-weight: var(
99
+ --typography-story-h4-font-weight,
100
+ "600"
101
+ ) !default;
102
+ $typography-story-h5-font-size: var(
103
+ --typography-story-h5-font-size,
104
+ "1.125em"
105
+ ) !default;
106
+ $typography-story-h5-font-weight: var(
107
+ --typography-story-h5-font-weight,
108
+ "600"
109
+ ) !default;
110
+ $typography-story-h6-font-size: var(
111
+ --typography-story-h6-font-size,
112
+ "1em"
113
+ ) !default;
114
+ $typography-story-h6-font-weight: var(
115
+ --typography-story-h6-font-weight,
116
+ "600"
117
+ ) !default;
118
+ $typography-story-sub-title-font-size: var(
119
+ --typography-story-sub-title-font-size,
120
+ "0.75em"
121
+ ) !default;
122
+ $typography-story-sub-title-font-weight: var(
123
+ --typography-story-sub-title-font-weight,
124
+ "500"
125
+ ) !default;
126
+ $typography-story-sub-title-letter-spacing: var(
127
+ --typography-story-sub-title-letter-spacing,
128
+ "0.05em"
129
+ ) !default;
130
+ $typography-story-sub-title-text-transform: var(
131
+ --typography-story-sub-title-text-transform,
132
+ "uppercase"
133
+ ) !default;
134
+ $typography-body-regular-font-size: var(
135
+ --typography-body-regular-font-size,
136
+ "0.75em"
137
+ ) !default;
138
+ $typography-body-regular-font-weight: var(
139
+ --typography-body-regular-font-weight,
140
+ "regular"
141
+ ) !default;
package/distDark/scss/tokensMapDeep.scss ADDED
@@ -0,0 +1,67 @@
1
+ /**
2
+ * Do not edit directly
3
+ * Generated on Mon, 27 Feb 2023 09:30:25 GMT
4
+ */
5
+
6
+ $brand: #007dbcff !default;
7
+ $field: #262e34ff !default;
8
+ $field-border: #3e4c54ff !default;
9
+ $background-main: #121517ff !default;
10
+ $background-inverse-hover: #222b32ff !default;
11
+ $background-inverse: #121a1eff !default;
12
+ $text-body-default: #ffffffff !default;
13
+ $text-inverse: #fafafaff !default;
14
+ $text-body-secondary: #5a6872ff !default;
15
+ $layer-primary: #1b2327ff !default;
16
+ $button-primary: #0779f1ff !default;
17
+ $button-primary-hover: #2889ccff !default;
18
+ $button-secondary-hover: #2889ccff !default;
19
+ $button-tertiary: #263443ff !default;
20
+ $button-tertiary-hover: #2e3e4fff !default;
21
+ $border-subtle: #1f262eff !default;
22
+ $border-strong: #2f3943ff !default;
23
+ $action-default-link-default-hover: #369ce3ff !default;
24
+ $action-default-link-default: #0779f1ff !default;
25
+ $support-success-background: #143416ff !default;
26
+ $support-error-background: #310d11ff !default;
27
+ $support-warning-background: #222d32ff !default;
28
+ $spacing-50: 0.125em !default;
29
+ $spacing-75: 0.25em !default;
30
+ $spacing-100: 0.5em !default;
31
+ $spacing-200: 0.75em !default;
32
+ $spacing-300: 1em !default;
33
+ $spacing-400: 1.5em !default;
34
+ $spacing-500: 2em !default;
35
+ $spacing-600: 2.5em !default;
36
+ $spacing-700: 3em !default;
37
+ $spacing-800: 4em !default;
38
+ $spacing-900: 5em !default;
39
+ $spacing-1000: 6em !default;
40
+ $typography-caption-font-size: 0.875em !default;
41
+ $typography-caption-font-weight: regular !default;
42
+ $typography-helper-font-size: 0.875em !default;
43
+ $typography-helper-font-weight: regular !default;
44
+ $typography-input-font-size: 1em !default;
45
+ $typography-input-font-weight: regular !default;
46
+ $typography-story-title-font-size: 3.125em !default;
47
+ $typography-story-title-font-weight: 300 !default;
48
+ $typography-story-h1-font-size: 1.8125em !default;
49
+ $typography-story-h1-font-weight: 600 !default;
50
+ $typography-story-h2-font-size: 1.5625em !default;
51
+ $typography-story-h2-font-weight: 600 !default;
52
+ $typography-story-h3-font-size: 1.375em !default;
53
+ $typography-story-h3-font-weight: 600 !default;
54
+ $typography-story-h4-font-size: 1.25em !default;
55
+ $typography-story-h4-font-weight: 600 !default;
56
+ $typography-story-h5-font-size: 1.125em !default;
57
+ $typography-story-h5-font-weight: 600 !default;
58
+ $typography-story-h6-font-size: 1em !default;
59
+ $typography-story-h6-font-weight: 600 !default;
60
+ $typography-story-sub-title-font-size: 0.75em !default;
61
+ $typography-story-sub-title-font-weight: 500 !default;
62
+ $typography-story-sub-title-letter-spacing: 0.05em !default;
63
+ $typography-story-sub-title-text-transform: uppercase !default;
64
+ $typography-body-regular-font-size: 0.75em !default;
65
+ $typography-body-regular-font-weight: regular !default;
66
+
67
+ $tokens: $undefined;
package/distDark/scss/tokensMapFlat.scss ADDED
@@ -0,0 +1,68 @@
1
+
2
+ /**
3
+ * Do not edit directly
4
+ * Generated on Mon, 27 Feb 2023 09:30:25 GMT
5
+ */
6
+
7
+ $tokens: (
8
+ 'brand': #007dbcff,
9
+ 'field': #262e34ff,
10
+ 'field-border': #3e4c54ff,
11
+ 'background-main': #121517ff,
12
+ 'background-inverse-hover': #222b32ff,
13
+ 'background-inverse': #121a1eff,
14
+ 'text-primary': #ffffffff,
15
+ 'text-on-color': #fafafaff,
16
+ 'text-secondary': #5a6872ff,
17
+ 'layer-primary': #1b2327ff,
18
+ 'button-primary': #0779f1ff,
19
+ 'button-primary-hover': #2889ccff,
20
+ 'button-secondary-hover': #2889ccff,
21
+ 'button-tertiary': #263443ff,
22
+ 'button-tertiary-hover': #2e3e4fff,
23
+ 'border-subtle': #1f262eff,
24
+ 'border-strong': #2f3943ff,
25
+ 'link-primary-hover': #369ce3ff,
26
+ 'link-primary': #0779f1ff,
27
+ 'support-success-light': #143416ff,
28
+ 'support-error-light': #310d11ff,
29
+ 'support-warning-light': #222d32ff,
30
+ 'spacing-50': 0.125em,
31
+ 'spacing-75': 0.25em,
32
+ 'spacing-100': 0.5em,
33
+ 'spacing-200': 0.75em,
34
+ 'spacing-300': 1em,
35
+ 'spacing-400': 1.5em,
36
+ 'spacing-500': 2em,
37
+ 'spacing-600': 2.5em,
38
+ 'spacing-700': 3em,
39
+ 'spacing-800': 4em,
40
+ 'spacing-900': 5em,
41
+ 'spacing-1000': 6em,
42
+ 'typography-caption-font-size': 0.875em,
43
+ 'typography-caption-font-weight': regular,
44
+ 'typography-helper-font-size': 0.875em,
45
+ 'typography-helper-font-weight': regular,
46
+ 'typography-input-font-size': 1em,
47
+ 'typography-input-font-weight': regular,
48
+ 'typography-story-title-font-size': 3.125em,
49
+ 'typography-story-title-font-weight': 300,
50
+ 'typography-story-h1-font-size': 1.8125em,
51
+ 'typography-story-h1-font-weight': 600,
52
+ 'typography-story-h2-font-size': 1.5625em,
53
+ 'typography-story-h2-font-weight': 600,
54
+ 'typography-story-h3-font-size': 1.375em,
55
+ 'typography-story-h3-font-weight': 600,
56
+ 'typography-story-h4-font-size': 1.25em,
57
+ 'typography-story-h4-font-weight': 600,
58
+ 'typography-story-h5-font-size': 1.125em,
59
+ 'typography-story-h5-font-weight': 600,
60
+ 'typography-story-h6-font-size': 1em,
61
+ 'typography-story-h6-font-weight': 600,
62
+ 'typography-story-sub-title-font-size': 0.75em,
63
+ 'typography-story-sub-title-font-weight': 500,
64
+ 'typography-story-sub-title-letter-spacing': 0.05em,
65
+ 'typography-story-sub-title-text-transform': uppercase,
66
+ 'typography-body-regular-font-size': 0.75em,
67
+ 'typography-body-regular-font-weight': regular
68
+ );