@kofile/gds-foundations 1.4.6 → 1.4.7

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/components/button.module.css +9 -9
  2. package/build/css/components/input.module.css +1 -1
  3. package/build/css/components/link.module.css +2 -2
  4. package/build/css/components/menu.module.css +1 -1
  5. package/build/css/components/navigation.module.css +1 -1
  6. package/build/css/components/segmented-controller.module.css +3 -3
  7. package/build/css/components/tabs.module.css +2 -2
  8. package/build/css/themes/{global.css → branded.css} +45 -45
  9. package/build/css/themes/index.css +1 -1
  10. package/build/css/themes/standard.css +362 -0
  11. package/package.json +1 -1
package/build/css/components/button.module.css CHANGED
@@ -54,15 +54,15 @@
54
54
  }
55
55
 
56
56
  .button[data-background="solid"][data-variant="primary"]:not(:disabled):active {
57
- box-shadow: 0px 0px 0px 6px rgba(12, 87, 205, 0.16);
57
+ box-shadow: 0px 0px 0px 6px var(--shadow-primary);
58
58
  }
59
59
 
60
60
  .button[data-background="outlined"][data-variant="primary"] {
61
- border-color: var(--color-primary-600);
61
+ border-color: var(--color-primary-700);
62
62
  background-color: var(--color-neutral-lightest);
63
63
  border-style: solid;
64
64
  border-width: var(--border-width-sm);
65
- color: var(--color-primary-600);
65
+ color: var(--color-primary-700);
66
66
  transition: background-color 0.25s ease-in-out, box-shadow 0.25s ease-in-out,
67
67
  border-color 0.25s ease-in-out;
68
68
  }
@@ -71,19 +71,19 @@
71
71
  :disabled
72
72
  ):hover {
73
73
  background-color: var(--color-primary-100);
74
- border-color: var(--color-primary-600);
74
+ border-color: var(--color-primary-700);
75
75
  }
76
76
 
77
77
  .button[data-background="outlined"][data-variant="primary"]:not(
78
78
  :disabled
79
79
  ):active {
80
- box-shadow: 0px 0px 0px 6px rgba(12, 87, 205, 0.16);
80
+ box-shadow: 0px 0px 0px 6px var(--shadow-primary);
81
81
  }
82
82
 
83
83
  .button[data-background="transparent"][data-variant="primary"] {
84
84
  background-color: transparent;
85
85
  border-color: transparent;
86
- color: var(--color-primary-600);
86
+ color: var(--color-primary-700);
87
87
  transition: background-color 0.25s ease-in-out, box-shadow 0.25s ease-in-out,
88
88
  border-color 0.25s ease-in-out;
89
89
  }
@@ -271,7 +271,7 @@
271
271
  .button[data-background="solid"][data-variant="primary"]:not(
272
272
  :disabled
273
273
  ):active {
274
- box-shadow: 0px 0px 0px 6px rgba(12, 87, 205, 0.16);
274
+ box-shadow: 0px 0px 0px 6px var(--shadow-primary);
275
275
  }
276
276
 
277
277
  .button[data-background="outlined"][data-variant="primary"] {
@@ -395,7 +395,7 @@
395
395
  .button[data-mode="dark"][data-background="solid"][data-variant="primary"]:not(
396
396
  :disabled
397
397
  ):active {
398
- box-shadow: 0px 0px 0px 6px rgba(12, 87, 205, 0.16);
398
+ box-shadow: 0px 0px 0px 6px var(--shadow-primary);
399
399
  }
400
400
 
401
401
  .button[data-mode="dark"][data-background="outlined"][data-variant="primary"] {
@@ -412,7 +412,7 @@
412
412
  .button[data-mode="dark"][data-background="outlined"][data-variant="primary"]:not(
413
413
  :disabled
414
414
  ):active {
415
- box-shadow: 0px 0px 0px 6px rgba(12, 87, 205, 0.16);
415
+ box-shadow: 0px 0px 0px 6px var(--shadow-primary);
416
416
  }
417
417
 
418
418
  .button[data-mode="dark"][data-background="transparent"][data-variant="primary"] {
package/build/css/components/input.module.css CHANGED
@@ -4,7 +4,7 @@
4
4
  }
5
5
  .root:focus-within {
6
6
  border-radius: var(--border-radius-sm);
7
- box-shadow: 0px 0px 0px 6px rgba(12, 87, 205, 0.16);
7
+ box-shadow: 0px 0px 0px 6px var(--shadow-primary);
8
8
  }
9
9
  .input {
10
10
  background-color: var(--color-neutral-200);
package/build/css/components/link.module.css CHANGED
@@ -1,7 +1,7 @@
1
1
  .link {
2
2
  all: unset;
3
3
  box-sizing: border-box;
4
- color: var(--color-primary-600);
4
+ color: var(--color-primary-700);
5
5
  cursor: pointer;
6
6
  font-family: var(--font-families-default);
7
7
  font-weight: var(--font-weights-bold);
@@ -14,7 +14,7 @@
14
14
  text-decoration: underline;
15
15
  }
16
16
  .link:hover {
17
- color: var(--color-primary-700);
17
+ color: var(--color-primary-800);
18
18
  }
19
19
  .link:active {
20
20
  color: var(--color-primary-900);
package/build/css/components/menu.module.css CHANGED
@@ -35,7 +35,7 @@
35
35
  .trigger:focus-visible,
36
36
  .trigger:focus {
37
37
  border-color: var(--color-primary-400);
38
- box-shadow: 0 0 0 0.375rem rgba(12, 87, 205, 0.16);
38
+ box-shadow: 0 0 0 0.375rem var(--shadow-primary);
39
39
  }
40
40
  .trigger[data-size="md"] {
41
41
  padding-inline: var(--spacing-xs);
package/build/css/components/navigation.module.css CHANGED
@@ -21,7 +21,7 @@
21
21
  .govName {
22
22
  font-family: var(--font-families-default);
23
23
  font-size: var(--font-size-2xl);
24
- font-weight: 480;
24
+ font-weight: var(--font-weights-regular);
25
25
  letter-spacing: -1.5%;
26
26
  line-height: 28.8px;
27
27
  }
package/build/css/components/segmented-controller.module.css CHANGED
@@ -57,8 +57,8 @@
57
57
  .trigger[data-state="active"] {
58
58
  box-sizing: border-box;
59
59
  background-color: var(--color-primary-100);
60
- color: var(--color-primary-600);
61
- border: 1px solid var(--color-primary-600);
60
+ color: var(--color-primary-700);
61
+ border: 1px solid var(--color-primary-700);
62
62
  border-radius: var(--border-radius-xs);
63
63
  margin: -1px;
64
64
  }
@@ -80,7 +80,7 @@
80
80
  .trigger[data-mode="dark"][data-state="active"] {
81
81
  color: var(--color-primary-400);
82
82
  background-color: var(--color-primary-1000);
83
- border-color: var(--color-primary-600);
83
+ border-color: var(--color-primary-700);
84
84
  }
85
85
 
86
86
  .content {
package/build/css/components/tabs.module.css CHANGED
@@ -40,8 +40,8 @@
40
40
  }
41
41
  .trigger[data-state="active"] {
42
42
  box-sizing: border-box;
43
- color: var(--color-primary-600);
44
- border-color: var(--color-primary-600);
43
+ color: var(--color-primary-700);
44
+ border-color: var(--color-primary-700);
45
45
  }
46
46
  .trigger[data-size="xl"] {
47
47
  font-family: var(--font-families-default);
package/build/css/themes/{global.css → branded.css} RENAMED
@@ -1,3 +1,4 @@
1
+ /* This file is the Neumo branded theme for the foundations for the design system. This is the default theme for all Neumo products. */
1
2
  :root,
2
3
  :host {
3
4
  --primitive-0: 0rem;
@@ -44,16 +45,6 @@
44
45
  --primitive-1280: 80rem;
45
46
  --primitive-1600: 100rem;
46
47
  --primitive-1920: 120rem;
47
- --primitive-brand-purple: #775ed3;
48
- --primitive-brand-lilac: #dacdf2;
49
- --primitive-brand-coolwhite: #f7f2f9;
50
- --primitive-brand-navy: #0a1128;
51
- --primitive-brand-sunflower: #efe745;
52
- --color-brand-primary: var(--color-brand-purple);
53
- --color-brand-light: var(--color-brand-lilac);
54
- --color-brand-soft: var(--color-brand-coolwhite);
55
- --color-brand-dark: var(--color-brand-navy);
56
- --color-brand-accent: var(--color-brand-sunflower);
57
48
  --primitive-gray-100: #f7f7f7;
58
49
  --primitive-gray-200: #edeeef;
59
50
  --primitive-gray-300: #d5d7db;
@@ -96,6 +87,7 @@
96
87
  --primitive-blue-800-alpha: rgba(2, 42, 116, 0.99);
97
88
  --primitive-blue-900-alpha: rgba(1, 26, 75, 0.99);
98
89
  --primitive-blue-1000-alpha: rgba(0, 16, 46, 0.99);
90
+ --primitive-blue-shadow: rgba(12, 87, 205, 0.16);
99
91
  --primitive-red-100: #feecec;
100
92
  --primitive-red-200: #fedcdc;
101
93
  --primitive-red-300: #feada9;
@@ -126,6 +118,16 @@
126
118
  --primitive-orange-800: #753c08;
127
119
  --primitive-orange-900: #553008;
128
120
  --primitive-orange-1000: #3c2109;
121
+ --primitive-amber-100: #fdf8cf;
122
+ --primitive-amber-200: #fdeeaf;
123
+ --primitive-amber-300: #fbd974;
124
+ --primitive-amber-400: #f1bc0f;
125
+ --primitive-amber-500: #dda100;
126
+ --primitive-amber-600: #c08700;
127
+ --primitive-amber-700: #976800;
128
+ --primitive-amber-800: #785200;
129
+ --primitive-amber-900: #563e00;
130
+ --primitive-amber-1000: #3c2e00;
129
131
  --primitive-yellow-100: #fbfbb7;
130
132
  --primitive-yellow-200: #f4f587;
131
133
  --primitive-yellow-300: #efe752;
@@ -136,14 +138,14 @@
136
138
  --primitive-yellow-800: #65620a;
137
139
  --primitive-yellow-900: #494606;
138
140
  --primitive-yellow-1000: #2f2c03;
139
- --primitive-purple-100: #f4f0fe;
140
- --primitive-purple-200: #ece2fa;
141
- --primitive-purple-300: #d5c1f4;
142
- --primitive-purple-400: #b897ed;
143
- --primitive-purple-500: #9e76e5;
144
- --primitive-purple-600: #6640c2;
145
- --primitive-purple-700: #52339a;
146
- --primitive-purple-800: #3b2472;
141
+ --primitive-purple-100: #f7f5ff;
142
+ --primitive-purple-200: #e9e5fd;
143
+ --primitive-purple-300: #d1c9fc;
144
+ --primitive-purple-400: #baa8f7;
145
+ --primitive-purple-500: #a485ed;
146
+ --primitive-purple-600: #7c4ccd;
147
+ --primitive-purple-700: #562c9e;
148
+ --primitive-purple-800: #3b2270;
147
149
  --primitive-purple-900: #291753;
148
150
  --primitive-purple-1000: #160a30;
149
151
  --primitive-purple-alpha-100: hsla(257, 96%, 48%, 0.06);
@@ -156,26 +158,17 @@
156
158
  --primitive-purple-alpha-800: hsla(258, 100%, 18%, 0.86);
157
159
  --primitive-purple-alpha-900: hsla(258, 100%, 13%, 0.91);
158
160
  --primitive-purple-alpha-1000: hsla(260, 91%, 9%, 0.97);
159
- --primitive-magenta-100: #ffecf8;
160
- --primitive-magenta-200: #fcc8e9;
161
- --primitive-magenta-300: #f59cd2;
162
- --primitive-magenta-400: #e97dbe;
163
- --primitive-magenta-500: #d45da6;
164
- --primitive-magenta-600: #a64480;
165
- --primitive-magenta-700: #7d3261;
166
- --primitive-magenta-800: #582544;
167
- --primitive-magenta-900: #3f1d31;
168
- --primitive-magenta-1000: #2b1323;
169
- --primitive-teal-100: #d5feff;
170
- --primitive-teal-200: #93fbfa;
171
- --primitive-teal-300: #53e6e4;
172
- --primitive-teal-400: #32c6c6;
173
- --primitive-teal-500: #309d9f;
174
- --primitive-teal-600: #247678;
175
- --primitive-teal-700: #1c4e4f;
176
- --primitive-teal-800: #133636;
177
- --primitive-teal-900: #0d2727;
178
- --primitive-teal-1000: #061615;
161
+ --primitive-purple-shadow: rgba(102, 64, 194, 0.16);
162
+ --primitive-brand-purple: #775ed3;
163
+ --primitive-brand-lilac: #dacdf2;
164
+ --primitive-brand-coolwhite: #f7f2f9;
165
+ --primitive-brand-navy: #0a1128;
166
+ --primitive-brand-sunflower: #efe745;
167
+ --color-brand-primary: var(--primitive-brand-purple);
168
+ --color-brand-light: var(--primitive-brand-lilac);
169
+ --color-brand-soft: var(--primitive-brand-coolwhite);
170
+ --color-brand-dark: var(--primitive-brand-navy);
171
+ --color-brand-accent: var(--primitive-brand-sunflower);
179
172
  --color-neutral-100: var(--primitive-gray-100);
180
173
  --color-neutral-200: var(--primitive-gray-200);
181
174
  --color-neutral-300: var(--primitive-gray-300);
@@ -208,7 +201,6 @@
208
201
  --color-primary-800: var(--primitive-purple-800);
209
202
  --color-primary-900: var(--primitive-purple-900);
210
203
  --color-primary-1000: var(--primitive-purple-1000);
211
-
212
204
  --color-primary-alpha-100: var(--primitive-purple-alpha-100);
213
205
  --color-primary-alpha-200: var(--primitive-purple-alpha-200);
214
206
  --color-primary-alpha-300: var(--primitive-purple-alpha-300);
@@ -259,6 +251,16 @@
259
251
  --color-highlight-800: var(--primitive-yellow-800);
260
252
  --color-highlight-900: var(--primitive-yellow-900);
261
253
  --color-highlight-1000: var(--primitive-yellow-1000);
254
+ --color-info-100: var(--primitive-blue-100);
255
+ --color-info-200: var(--primitive-blue-200);
256
+ --color-info-300: var(--primitive-blue-300);
257
+ --color-info-400: var(--primitive-blue-400);
258
+ --color-info-500: var(--primitive-blue-500);
259
+ --color-info-600: var(--primitive-blue-600);
260
+ --color-info-700: var(--primitive-blue-700);
261
+ --color-info-800: var(--primitive-blue-800);
262
+ --color-info-900: var(--primitive-blue-900);
263
+ --color-info-1000: var(--primitive-blue-1000);
262
264
  --spacing-4xs: var(--primitive-0);
263
265
  --spacing-3xs: var(--primitive-2);
264
266
  --spacing-2xs: var(--primitive-4);
@@ -281,11 +283,8 @@
281
283
  --layout-2xl: var(--primitive-1280);
282
284
  --layout-3xl: var(--primitive-1600);
283
285
  --layout-4xl: var(--primitive-1920);
284
- --font-families-default: "Source Sans 3", -apple-system, BlinkMacSystemFont,
285
- "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue",
286
- sans-serif;
286
+ --font-families-default: "Source Sans 3", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
287
287
  --font-families-mono: "Fira Code", monospace;
288
-
289
288
  --font-size-3xs: var(--primitive-12);
290
289
  --font-size-2xs: var(--primitive-13);
291
290
  --font-size-xs: var(--primitive-14);
@@ -298,7 +297,7 @@
298
297
  --font-size-4xl: var(--primitive-36);
299
298
  --font-size-5xl: var(--primitive-48);
300
299
  --font-size-6xl: var(--primitive-72);
301
- --font-weights-regular: 444;
300
+ --font-weights-regular: 424;
302
301
  --font-weights-semibold: 600;
303
302
  --font-weights-bold: 720;
304
303
  --letter-spacing-3xs: -0.005em;
@@ -339,12 +338,13 @@
339
338
  --opacity-disabled: 0.32;
340
339
  --opacity-sm: 0.48;
341
340
  --opacity-md: 0.64;
342
- --opacity-l: 0.88;
341
+ --opacity-lg: 0.88;
343
342
  --shadow-xs: 0 0 12px 0 rgba(18, 18, 18, 0.08);
344
343
  --shadow-sm: 0 0 12px 0 rgba(18, 18, 18, 0.16);
345
344
  --shadow-md: 0 0 12px 0 rgba(18, 18, 18, 0.24);
346
345
  --shadow-lg: 0 0 12px 0 rgba(18, 18, 18, 0.72);
347
346
  --shadow-xl: 0 0 16px 0 rgba(18, 18, 18, 0.96);
347
+ --shadow-primary: var(--primitive-purple-shadow);
348
348
  --elevation-100: 100;
349
349
  --elevation-150: 150;
350
350
  --elevation-199: 199;
package/build/css/themes/index.css CHANGED
@@ -1 +1 @@
1
- @import "./global.css";
1
+ @import "./branded.css";
package/build/css/themes/standard.css ADDED
@@ -0,0 +1,362 @@
1
+ /* This file is the Standard theme for the foundations for the design system. This was the theme used for GovOS products, pre-Neumo acquisition. */
2
+ :root,
3
+ :host {
4
+ --primitive-0: 0rem;
5
+ --primitive-1: 0.0625rem;
6
+ --primitive-2: 0.125rem;
7
+ --primitive-4: 0.25rem;
8
+ --primitive-6: 0.375rem;
9
+ --primitive-8: 0.5rem;
10
+ --primitive-10: 0.625rem;
11
+ --primitive-11: 0.6875rem;
12
+ --primitive-12: 0.75rem;
13
+ --primitive-13: 0.8125rem;
14
+ --primitive-14: 0.875rem;
15
+ --primitive-15: 0.9375rem;
16
+ --primitive-16: 1rem;
17
+ --primitive-17: 1.0625rem;
18
+ --primitive-18: 1.125rem;
19
+ --primitive-20: 1.25rem;
20
+ --primitive-24: 1.5rem;
21
+ --primitive-28: 1.75rem;
22
+ --primitive-32: 2rem;
23
+ --primitive-36: 2.25rem;
24
+ --primitive-40: 2.5rem;
25
+ --primitive-44: 2.75rem;
26
+ --primitive-48: 3rem;
27
+ --primitive-52: 3.25rem;
28
+ --primitive-56: 3.5rem;
29
+ --primitive-60: 3.75rem;
30
+ --primitive-64: 4rem;
31
+ --primitive-72: 4.5rem;
32
+ --primitive-80: 5rem;
33
+ --primitive-128: 8rem;
34
+ --primitive-160: 10rem;
35
+ --primitive-192: 12rem;
36
+ --primitive-224: 14rem;
37
+ --primitive-256: 16rem;
38
+ --primitive-320: 20rem;
39
+ --primitive-384: 24rem;
40
+ --primitive-448: 28rem;
41
+ --primitive-512: 32rem;
42
+ --primitive-640: 40rem;
43
+ --primitive-768: 48rem;
44
+ --primitive-1024: 64rem;
45
+ --primitive-1280: 80rem;
46
+ --primitive-1600: 100rem;
47
+ --primitive-1920: 120rem;
48
+ --primitive-gray-100: #f7f7f7;
49
+ --primitive-gray-200: #edeeef;
50
+ --primitive-gray-300: #d5d7db;
51
+ --primitive-gray-400: #b7bcc3;
52
+ --primitive-gray-500: #818791;
53
+ --primitive-gray-600: #6b7280;
54
+ --primitive-gray-700: #4f5562;
55
+ --primitive-gray-800: #343944;
56
+ --primitive-gray-900: #242831;
57
+ --primitive-gray-1000: #191b22;
58
+ --primitive-gray-black: #121212;
59
+ --primitive-gray-white: #ffffff;
60
+ --primitive-gray-100-alpha: rgba(56, 56, 56, 0.04);
61
+ --primitive-gray-200-alpha: rgba(31, 44, 56, 0.08);
62
+ --primitive-gray-300-alpha: rgba(8, 20, 43, 0.17);
63
+ --primitive-gray-400-alpha: rgba(7, 25, 49, 0.29);
64
+ --primitive-gray-500-alpha: rgba(2, 17, 44, 0.45);
65
+ --primitive-gray-600-alpha: rgba(4, 17, 42, 0.59);
66
+ --primitive-gray-700-alpha: rgba(4, 12, 32, 0.7);
67
+ --primitive-gray-800-alpha: rgba(1, 7, 19, 0.8);
68
+ --primitive-gray-900-alpha: rgba(0, 5, 15, 0.86);
69
+ --primitive-gray-1000-alpha: rgba(2, 4, 13, 0.91);
70
+ --primitive-blue-100: #f0f7ff;
71
+ --primitive-blue-200: #d9eafe;
72
+ --primitive-blue-300: #abcffd;
73
+ --primitive-blue-400: #66a8fd;
74
+ --primitive-blue-500: #3a89fd;
75
+ --primitive-blue-600: #0c57cd;
76
+ --primitive-blue-700: #063b99;
77
+ --primitive-blue-800: #052b74;
78
+ --primitive-blue-900: #041c4f;
79
+ --primitive-blue-1000: #03122f;
80
+ --primitive-blue-100-alpha: rgba(5, 122, 255, 0.06);
81
+ --primitive-blue-200-alpha: rgba(2, 117, 247, 0.15);
82
+ --primitive-blue-300-alpha: rgba(0, 112, 250, 0.33);
83
+ --primitive-blue-400-alpha: rgba(0, 108, 250, 0.6);
84
+ --primitive-blue-500-alpha: rgba(3, 103, 252, 0.78);
85
+ --primitive-blue-600-alpha: rgba(2, 79, 202, 0.96);
86
+ --primitive-blue-700-alpha: rgba(1, 56, 152, 0.98);
87
+ --primitive-blue-800-alpha: rgba(2, 42, 116, 0.99);
88
+ --primitive-blue-900-alpha: rgba(1, 26, 75, 0.99);
89
+ --primitive-blue-1000-alpha: rgba(0, 16, 46, 0.99);
90
+ --primitive-blue-shadow: rgba(12, 87, 205, 0.16);
91
+ --primitive-red-100: #feecec;
92
+ --primitive-red-200: #fedcdc;
93
+ --primitive-red-300: #feada9;
94
+ --primitive-red-400: #fc817c;
95
+ --primitive-red-500: #f4534f;
96
+ --primitive-red-600: #d12828;
97
+ --primitive-red-700: #ab1a1d;
98
+ --primitive-red-800: #7e130e;
99
+ --primitive-red-900: #5c0b09;
100
+ --primitive-red-1000: #3b0807;
101
+ --primitive-green-100: #e2fdee;
102
+ --primitive-green-200: #c0f6dc;
103
+ --primitive-green-300: #71e0b0;
104
+ --primitive-green-400: #29c68c;
105
+ --primitive-green-500: #1aad74;
106
+ --primitive-green-600: #088556;
107
+ --primitive-green-700: #086945;
108
+ --primitive-green-800: #0a4e35;
109
+ --primitive-green-900: #063724;
110
+ --primitive-green-1000: #052618;
111
+ --primitive-orange-100: #fff3e0;
112
+ --primitive-orange-200: #ffe4c2;
113
+ --primitive-orange-300: #fec880;
114
+ --primitive-orange-400: #fba94b;
115
+ --primitive-orange-500: #f39129;
116
+ --primitive-orange-600: #d26e16;
117
+ --primitive-orange-700: #a2520c;
118
+ --primitive-orange-800: #753c08;
119
+ --primitive-orange-900: #553008;
120
+ --primitive-orange-1000: #3c2109;
121
+ --primitive-amber-100: #fdf8cf;
122
+ --primitive-amber-200: #fdeeaf;
123
+ --primitive-amber-300: #fbd974;
124
+ --primitive-amber-400: #f1bc0f;
125
+ --primitive-amber-500: #dda100;
126
+ --primitive-amber-600: #c08700;
127
+ --primitive-amber-700: #976800;
128
+ --primitive-amber-800: #785200;
129
+ --primitive-amber-900: #563e00;
130
+ --primitive-amber-1000: #3c2e00;
131
+ --primitive-yellow-100: #fbfbb7;
132
+ --primitive-yellow-200: #f4f587;
133
+ --primitive-yellow-300: #efe752;
134
+ --primitive-yellow-400: #d6ce31;
135
+ --primitive-yellow-500: #beb71f;
136
+ --primitive-yellow-600: #a29f14;
137
+ --primitive-yellow-700: #807d0f;
138
+ --primitive-yellow-800: #65620a;
139
+ --primitive-yellow-900: #494606;
140
+ --primitive-yellow-1000: #2f2c03;
141
+ --primitive-purple-100: #f7f5ff;
142
+ --primitive-purple-200: #e9e5fd;
143
+ --primitive-purple-300: #d1c9fc;
144
+ --primitive-purple-400: #baa8f7;
145
+ --primitive-purple-500: #a485ed;
146
+ --primitive-purple-600: #7c4ccd;
147
+ --primitive-purple-700: #562c9e;
148
+ --primitive-purple-800: #3b2270;
149
+ --primitive-purple-900: #291753;
150
+ --primitive-purple-1000: #150c32;
151
+ --primitive-purple-alpha-100: hsla(257, 96%, 48%, 0.06);
152
+ --primitive-purple-alpha-200: hsla(265, 89%, 44%, 0.12);
153
+ --primitive-purple-alpha-300: hsla(264, 94%, 43%, 0.25);
154
+ --primitive-purple-alpha-400: hsla(263, 99%, 42%, 0.41);
155
+ --primitive-purple-alpha-500: hsla(262, 99%, 41%, 0.54);
156
+ --primitive-purple-alpha-600: hsla(258, 100%, 34%, 0.75);
157
+ --primitive-purple-alpha-700: hsla(258, 100%, 25%, 0.8);
158
+ --primitive-purple-alpha-800: hsla(258, 100%, 18%, 0.86);
159
+ --primitive-purple-alpha-900: hsla(258, 100%, 13%, 0.91);
160
+ --primitive-purple-alpha-1000: hsla(260, 91%, 9%, 0.97);
161
+ --primitive-purple-shadow: rgba(102, 64, 194, 0.16);
162
+ --primitive-brand-purple: #775ed3;
163
+ --primitive-brand-lilac: #dacdf2;
164
+ --primitive-brand-coolwhite: #f7f2f9;
165
+ --primitive-brand-navy: #0a1128;
166
+ --primitive-brand-sunflower: #efe745;
167
+ --color-brand-primary: var(--primitive-brand-purple);
168
+ --color-brand-light: var(--primitive-brand-lilac);
169
+ --color-brand-soft: var(--primitive-brand-coolwhite);
170
+ --color-brand-dark: var(--primitive-brand-navy);
171
+ --color-brand-accent: var(--primitive-brand-sunflower);
172
+ --color-neutral-100: var(--primitive-gray-100);
173
+ --color-neutral-200: var(--primitive-gray-200);
174
+ --color-neutral-300: var(--primitive-gray-300);
175
+ --color-neutral-400: var(--primitive-gray-400);
176
+ --color-neutral-500: var(--primitive-gray-500);
177
+ --color-neutral-600: var(--primitive-gray-600);
178
+ --color-neutral-700: var(--primitive-gray-700);
179
+ --color-neutral-800: var(--primitive-gray-800);
180
+ --color-neutral-900: var(--primitive-gray-900);
181
+ --color-neutral-1000: var(--primitive-gray-1000);
182
+ --color-neutral-darkest: var(--primitive-gray-black);
183
+ --color-neutral-lightest: var(--primitive-gray-white);
184
+ --color-neutral-100-alpha: var(--primitive-gray-100-alpha);
185
+ --color-neutral-200-alpha: var(--primitive-gray-200-alpha);
186
+ --color-neutral-300-alpha: var(--primitive-gray-300-alpha);
187
+ --color-neutral-400-alpha: var(--primitive-gray-400-alpha);
188
+ --color-neutral-500-alpha: var(--primitive-gray-500-alpha);
189
+ --color-neutral-600-alpha: var(--primitive-gray-600-alpha);
190
+ --color-neutral-700-alpha: var(--primitive-gray-700-alpha);
191
+ --color-neutral-800-alpha: var(--primitive-gray-800-alpha);
192
+ --color-neutral-900-alpha: var(--primitive-gray-900-alpha);
193
+ --color-neutral-1000-alpha: var(--primitive-gray-1000-alpha);
194
+ --color-primary-100: var(--primitive-blue-100);
195
+ --color-primary-200: var(--primitive-blue-200);
196
+ --color-primary-300: var(--primitive-blue-300);
197
+ --color-primary-400: var(--primitive-blue-400);
198
+ --color-primary-500: var(--primitive-blue-500);
199
+ --color-primary-600: var(--primitive-blue-600);
200
+ --color-primary-700: var(--primitive-blue-700);
201
+ --color-primary-800: var(--primitive-blue-800);
202
+ --color-primary-900: var(--primitive-blue-900);
203
+ --color-primary-1000: var(--primitive-blue-1000);
204
+ --color-primary-alpha-100: var(--primitive-blue-alpha-100);
205
+ --color-primary-alpha-200: var(--primitive-blue-alpha-200);
206
+ --color-primary-alpha-300: var(--primitive-blue-alpha-300);
207
+ --color-primary-alpha-400: var(--primitive-blue-alpha-400);
208
+ --color-primary-alpha-500: var(--primitive-blue-alpha-500);
209
+ --color-primary-alpha-600: var(--primitive-blue-alpha-600);
210
+ --color-primary-alpha-700: var(--primitive-blue-alpha-700);
211
+ --color-primary-alpha-800: var(--primitive-blue-alpha-800);
212
+ --color-primary-alpha-900: var(--primitive-blue-alpha-900);
213
+ --color-primary-alpha-1000: var(--primitive-blue-alpha-1000);
214
+ --color-danger-100: var(--primitive-red-100);
215
+ --color-danger-200: var(--primitive-red-200);
216
+ --color-danger-300: var(--primitive-red-300);
217
+ --color-danger-400: var(--primitive-red-400);
218
+ --color-danger-500: var(--primitive-red-500);
219
+ --color-danger-600: var(--primitive-red-600);
220
+ --color-danger-700: var(--primitive-red-700);
221
+ --color-danger-800: var(--primitive-red-800);
222
+ --color-danger-900: var(--primitive-red-900);
223
+ --color-danger-1000: var(--primitive-red-1000);
224
+ --color-warning-100: var(--primitive-orange-100);
225
+ --color-warning-200: var(--primitive-orange-200);
226
+ --color-warning-300: var(--primitive-orange-300);
227
+ --color-warning-400: var(--primitive-orange-400);
228
+ --color-warning-500: var(--primitive-orange-500);
229
+ --color-warning-600: var(--primitive-orange-600);
230
+ --color-warning-700: var(--primitive-orange-700);
231
+ --color-warning-800: var(--primitive-orange-800);
232
+ --color-warning-900: var(--primitive-orange-900);
233
+ --color-warning-1000: var(--primitive-orange-1000);
234
+ --color-success-100: var(--primitive-green-100);
235
+ --color-success-200: var(--primitive-green-200);
236
+ --color-success-300: var(--primitive-green-300);
237
+ --color-success-400: var(--primitive-green-400);
238
+ --color-success-500: var(--primitive-green-500);
239
+ --color-success-600: var(--primitive-green-600);
240
+ --color-success-700: var(--primitive-green-700);
241
+ --color-success-800: var(--primitive-green-800);
242
+ --color-success-900: var(--primitive-green-900);
243
+ --color-success-1000: var(--primitive-green-1000);
244
+ --color-highlight-100: var(--primitive-amber-100);
245
+ --color-highlight-200: var(--primitive-amber-200);
246
+ --color-highlight-300: var(--primitive-amber-300);
247
+ --color-highlight-400: var(--primitive-amber-400);
248
+ --color-highlight-500: var(--primitive-amber-500);
249
+ --color-highlight-600: var(--primitive-amber-600);
250
+ --color-highlight-700: var(--primitive-amber-700);
251
+ --color-highlight-800: var(--primitive-amber-800);
252
+ --color-highlight-900: var(--primitive-amber-900);
253
+ --color-highlight-1000: var(--primitive-amber-1000);
254
+ --color-info-100: var(--primitive-purple-100);
255
+ --color-info-200: var(--primitive-purple-200);
256
+ --color-info-300: var(--primitive-purple-300);
257
+ --color-info-400: var(--primitive-purple-400);
258
+ --color-info-500: var(--primitive-purple-500);
259
+ --color-info-600: var(--primitive-purple-600);
260
+ --color-info-700: var(--primitive-purple-700);
261
+ --color-info-800: var(--primitive-purple-800);
262
+ --color-info-900: var(--primitive-purple-900);
263
+ --color-info-1000: var(--primitive-purple-1000);
264
+ --spacing-4xs: var(--primitive-0);
265
+ --spacing-3xs: var(--primitive-2);
266
+ --spacing-2xs: var(--primitive-4);
267
+ --spacing-xs: var(--primitive-8);
268
+ --spacing-sm: var(--primitive-12);
269
+ --spacing-md: var(--primitive-16);
270
+ --spacing-lg: var(--primitive-20);
271
+ --spacing-xl: var(--primitive-24);
272
+ --spacing-2xl: var(--primitive-32);
273
+ --spacing-3xl: var(--primitive-48);
274
+ --spacing-4xl: var(--primitive-64);
275
+ --layout-4xs: var(--primitive-192);
276
+ --layout-3xs: var(--primitive-224);
277
+ --layout-2xs: var(--primitive-256);
278
+ --layout-xs: var(--primitive-320);
279
+ --layout-sm: var(--primitive-384);
280
+ --layout-md: var(--primitive-512);
281
+ --layout-lg: var(--primitive-768);
282
+ --layout-xl: var(--primitive-1024);
283
+ --layout-2xl: var(--primitive-1280);
284
+ --layout-3xl: var(--primitive-1600);
285
+ --layout-4xl: var(--primitive-1920);
286
+ --font-families-default: "Source Sans 3", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
287
+ --font-families-mono: "Fira Code", monospace;
288
+ --font-size-3xs: var(--primitive-12);
289
+ --font-size-2xs: var(--primitive-13);
290
+ --font-size-xs: var(--primitive-14);
291
+ --font-size-sm: var(--primitive-15);
292
+ --font-size-md: var(--primitive-16);
293
+ --font-size-lg: var(--primitive-18);
294
+ --font-size-xl: var(--primitive-20);
295
+ --font-size-2xl: var(--primitive-24);
296
+ --font-size-3xl: var(--primitive-28);
297
+ --font-size-4xl: var(--primitive-36);
298
+ --font-size-5xl: var(--primitive-48);
299
+ --font-size-6xl: var(--primitive-72);
300
+ --font-weights-regular: 424;
301
+ --font-weights-semibold: 600;
302
+ --font-weights-bold: 720;
303
+ --letter-spacing-3xs: -0.005em;
304
+ --letter-spacing-2xs: -0.005em;
305
+ --letter-spacing-xs: -0.005em;
306
+ --letter-spacing-sm: -0.01em;
307
+ --letter-spacing-md: -0.01em;
308
+ --letter-spacing-lg: -0.01em;
309
+ --letter-spacing-xl: -0.01em;
310
+ --letter-spacing-2xl: -0.015em;
311
+ --letter-spacing-3xl: -0.0175em;
312
+ --letter-spacing-4xl: -0.0175em;
313
+ --letter-spacing-5xl: -0.0175em;
314
+ --letter-spacing-6xl: -0.025em;
315
+ --line-heights-3xs: var(--primitive-16);
316
+ --line-heights-2xs: var(--primitive-20);
317
+ --line-heights-xs: var(--primitive-20);
318
+ --line-heights-sm: var(--primitive-20);
319
+ --line-heights-md: var(--primitive-24);
320
+ --line-heights-lg: var(--primitive-24);
321
+ --line-heights-xl: var(--primitive-28);
322
+ --line-heights-2xl: var(--primitive-36);
323
+ --line-heights-3xl: var(--primitive-36);
324
+ --line-heights-4xl: var(--primitive-48);
325
+ --line-heights-5xl: var(--primitive-60);
326
+ --line-heights-6xl: var(--primitive-80);
327
+ --border-radius-none: var(--primitive-0);
328
+ --border-radius-2xs: var(--primitive-2);
329
+ --border-radius-xs: var(--primitive-4);
330
+ --border-radius-sm: var(--primitive-6);
331
+ --border-radius-md: var(--primitive-8);
332
+ --border-radius-lg: var(--primitive-12);
333
+ --border-radius-xl: var(--primitive-16);
334
+ --border-width-none: var(--primitive-0);
335
+ --border-width-sm: var(--primitive-1);
336
+ --border-width-md: var(--primitive-2);
337
+ --border-width-lg: var(--primitive-4);
338
+ --opacity-disabled: 0.32;
339
+ --opacity-sm: 0.48;
340
+ --opacity-md: 0.64;
341
+ --opacity-lg: 0.88;
342
+ --shadow-xs: 0 0 12px 0 rgba(18, 18, 18, 0.08);
343
+ --shadow-sm: 0 0 12px 0 rgba(18, 18, 18, 0.16);
344
+ --shadow-md: 0 0 12px 0 rgba(18, 18, 18, 0.24);
345
+ --shadow-lg: 0 0 12px 0 rgba(18, 18, 18, 0.72);
346
+ --shadow-xl: 0 0 16px 0 rgba(18, 18, 18, 0.96);
347
+ --shadow-primary: var(--primitive-blue-shadow);
348
+ --elevation-100: 100;
349
+ --elevation-150: 150;
350
+ --elevation-199: 199;
351
+ --elevation-200: 200;
352
+ --elevation-250: 250;
353
+ --elevation-299: 299;
354
+ --elevation-300: 300;
355
+ --elevation-350: 350;
356
+ --elevation-399: 399;
357
+ --elevation-400: 400;
358
+ --elevation-450: 450;
359
+ --elevation-499: 499;
360
+ --elevation-absolute-bottom: -999;
361
+ --elevation-absolute-top: 999;
362
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kofile/gds-foundations",
3
- "version": "1.4.6",
3
+ "version": "1.4.7",
4
4
  "description": "",
5
5
  "main": "build/css/index.css",
6
6
  "exports": {