@kommon-lab/tokens 0.1.3 → 0.1.5

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 (9) hide show
  1. package/dist/css/beebs.css +65 -77
  2. package/dist/css/ekstract.css +65 -77
  3. package/dist/css/kiabi-home.css +65 -77
  4. package/dist/css/kiabi.css +65 -77
  5. package/dist/css/kitchoun.css +65 -77
  6. package/package.json +1 -1
  7. package/tokens/desktop-typography_tokens.json +0 -22
  8. package/tokens/desktop_tokens.json +0 -41
  9. package/tokens/mobile_tokens.json +0 -41
package/dist/css/beebs.css CHANGED
@@ -4,65 +4,65 @@
4
4
 
5
5
  :root {
6
6
  --size-0: 0;
7
- --size-25: 4;
8
- --size-50: 8;
9
- --size-75: 12;
10
- --size-100: 16;
11
- --size-125: 20;
12
- --size-150: 24;
13
- --size-175: 28;
14
- --size-200: 32;
15
- --size-225: 36;
16
- --size-250: 40;
17
- --size-275: 44;
18
- --size-300: 48;
19
- --size-325: 52;
20
- --size-350: 56;
21
- --size-375: 60;
22
- --size-400: 64;
23
- --size-425: 68;
24
- --size-450: 72;
25
- --size-475: 76;
26
- --size-500: 80;
27
- --size-xxxs: 20;
28
- --size-xxs: 24;
29
- --size-xs: 32;
30
- --size-s: 36;
31
- --size-m: 40;
32
- --size-l: 48;
33
- --size-xl: 56;
34
- --size-xxl: 64;
35
- --size-xxxl: 80;
7
+ --size-25: 0.25rem;
8
+ --size-50: 0.5rem;
9
+ --size-75: 0.75rem;
10
+ --size-100: 1rem;
11
+ --size-125: 1.25rem;
12
+ --size-150: 1.5rem;
13
+ --size-175: 1.75rem;
14
+ --size-200: 2rem;
15
+ --size-225: 2.25rem;
16
+ --size-250: 2.5rem;
17
+ --size-275: 2.75rem;
18
+ --size-300: 3rem;
19
+ --size-325: 3.25rem;
20
+ --size-350: 3.5rem;
21
+ --size-375: 3.75rem;
22
+ --size-400: 4rem;
23
+ --size-425: 4.25rem;
24
+ --size-450: 4.5rem;
25
+ --size-475: 4.75rem;
26
+ --size-500: 5rem;
27
+ --size-xxxs: 1.25rem;
28
+ --size-xxs: 1.5rem;
29
+ --size-xs: 2rem;
30
+ --size-s: 2.25rem;
31
+ --size-m: 2.5rem;
32
+ --size-l: 3rem;
33
+ --size-xl: 3.5rem;
34
+ --size-xxl: 4rem;
35
+ --size-xxxl: 5rem;
36
36
  --space-0: 0;
37
- --space-12: 2;
38
- --space-25: 4;
39
- --space-50: 8;
40
- --space-75: 12;
41
- --space-100: 16;
42
- --space-125: 20;
43
- --space-150: 24;
44
- --space-175: 28;
45
- --space-200: 32;
46
- --space-225: 36;
47
- --space-250: 40;
48
- --space-275: 44;
49
- --space-300: 48;
50
- --space-325: 52;
51
- --space-350: 56;
52
- --space-375: 60;
53
- --space-400: 64;
37
+ --space-12: 0.125rem;
38
+ --space-25: 0.25rem;
39
+ --space-50: 0.5rem;
40
+ --space-75: 0.75rem;
41
+ --space-100: 1rem;
42
+ --space-125: 1.25rem;
43
+ --space-150: 1.5rem;
44
+ --space-175: 1.75rem;
45
+ --space-200: 2rem;
46
+ --space-225: 2.25rem;
47
+ --space-250: 2.5rem;
48
+ --space-275: 2.75rem;
49
+ --space-300: 3rem;
50
+ --space-325: 3.25rem;
51
+ --space-350: 3.5rem;
52
+ --space-375: 3.75rem;
53
+ --space-400: 4rem;
54
54
  --space-none: 0;
55
- --space-xxxxs: 2;
56
- --space-xxxs: 4;
57
- --space-xxs: 8;
58
- --space-xs: 12;
59
- --space-s: 16;
60
- --space-m: 20;
61
- --space-l: 24;
62
- --space-xl: 32;
63
- --space-xxl: 40;
64
- --space-xxxl: 48;
65
- --space-xxxxl: 56;
55
+ --space-xxxxs: 0.125rem;
56
+ --space-xxxs: 0.25rem;
57
+ --space-xxs: 0.5rem;
58
+ --space-xs: 0.75rem;
59
+ --space-s: 1rem;
60
+ --space-m: 1.25rem;
61
+ --space-l: 1.5rem;
62
+ --space-xl: 2rem;
63
+ --space-xxl: 2.5rem;
64
+ --space-xxxl: 3rem;
65
+ --space-xxxxl: 3.5rem;
66
66
  --font-body-m-font-family: Figtree;
67
67
  --font-body-m-font-size: 1rem;
68
68
  --font-body-m-line-height: 140%;
@@ -178,15 +178,15 @@
178
178
  --color-fg-neutral: #353535;
179
179
  --color-fg-subtle: #737373;
180
180
  --color-fg-inverse: #ffffff;
181
- --border-width-thin: 1;
182
- --border-width-thick: 2;
181
+ --border-width-thin: 1px;
182
+ --border-width-thick: 2px;
183
183
  --border-radius-none: 0;
184
- --border-radius-xs: 4;
185
- --border-radius-s: 8;
186
- --border-radius-m: 12;
187
- --border-radius-l: 16;
188
- --border-radius-xl: 24;
189
- --border-radius-pill: 999;
184
+ --border-radius-xs: 0.25rem;
185
+ --border-radius-s: 0.5rem;
186
+ --border-radius-m: 0.75rem;
187
+ --border-radius-l: 1rem;
188
+ --border-radius-xl: 1.5rem;
189
+ --border-radius-pill: 62.4375rem;
190
190
  }
191
191
 
192
192
  @media (min-width: 768px) {
@@ -215,17 +215,5 @@
215
215
  --font-title-m-font-weight: 700;
216
216
  --font-title-m-letter-spacing: 0;
217
217
  --font-title-m-text-decoration: none;
218
- --font-title-s-font-family: Really Sans Small;
219
- --font-title-s-font-size: 1.5rem;
220
- --font-title-s-line-height: 120%;
221
- --font-title-s-font-weight: 700;
222
- --font-title-s-letter-spacing: 0;
223
- --font-title-s-text-decoration: none;
224
- --font-title-xs-font-family: Really Sans Small;
225
- --font-title-xs-font-size: 1.25rem;
226
- --font-title-xs-line-height: 120%;
227
- --font-title-xs-font-weight: 700;
228
- --font-title-xs-letter-spacing: 0;
229
- --font-title-xs-text-decoration: none;
230
218
  }
231
219
  }
package/dist/css/ekstract.css CHANGED
@@ -4,65 +4,65 @@
4
4
 
5
5
  :root {
6
6
  --size-0: 0;
7
- --size-25: 4;
8
- --size-50: 8;
9
- --size-75: 12;
10
- --size-100: 16;
11
- --size-125: 20;
12
- --size-150: 24;
13
- --size-175: 28;
14
- --size-200: 32;
15
- --size-225: 36;
16
- --size-250: 40;
17
- --size-275: 44;
18
- --size-300: 48;
19
- --size-325: 52;
20
- --size-350: 56;
21
- --size-375: 60;
22
- --size-400: 64;
23
- --size-425: 68;
24
- --size-450: 72;
25
- --size-475: 76;
26
- --size-500: 80;
27
- --size-xxxs: 20;
28
- --size-xxs: 24;
29
- --size-xs: 32;
30
- --size-s: 36;
31
- --size-m: 40;
32
- --size-l: 48;
33
- --size-xl: 56;
34
- --size-xxl: 64;
35
- --size-xxxl: 80;
7
+ --size-25: 0.25rem;
8
+ --size-50: 0.5rem;
9
+ --size-75: 0.75rem;
10
+ --size-100: 1rem;
11
+ --size-125: 1.25rem;
12
+ --size-150: 1.5rem;
13
+ --size-175: 1.75rem;
14
+ --size-200: 2rem;
15
+ --size-225: 2.25rem;
16
+ --size-250: 2.5rem;
17
+ --size-275: 2.75rem;
18
+ --size-300: 3rem;
19
+ --size-325: 3.25rem;
20
+ --size-350: 3.5rem;
21
+ --size-375: 3.75rem;
22
+ --size-400: 4rem;
23
+ --size-425: 4.25rem;
24
+ --size-450: 4.5rem;
25
+ --size-475: 4.75rem;
26
+ --size-500: 5rem;
27
+ --size-xxxs: 1.25rem;
28
+ --size-xxs: 1.5rem;
29
+ --size-xs: 2rem;
30
+ --size-s: 2.25rem;
31
+ --size-m: 2.5rem;
32
+ --size-l: 3rem;
33
+ --size-xl: 3.5rem;
34
+ --size-xxl: 4rem;
35
+ --size-xxxl: 5rem;
36
36
  --space-0: 0;
37
- --space-12: 2;
38
- --space-25: 4;
39
- --space-50: 8;
40
- --space-75: 12;
41
- --space-100: 16;
42
- --space-125: 20;
43
- --space-150: 24;
44
- --space-175: 28;
45
- --space-200: 32;
46
- --space-225: 36;
47
- --space-250: 40;
48
- --space-275: 44;
49
- --space-300: 48;
50
- --space-325: 52;
51
- --space-350: 56;
52
- --space-375: 60;
53
- --space-400: 64;
37
+ --space-12: 0.125rem;
38
+ --space-25: 0.25rem;
39
+ --space-50: 0.5rem;
40
+ --space-75: 0.75rem;
41
+ --space-100: 1rem;
42
+ --space-125: 1.25rem;
43
+ --space-150: 1.5rem;
44
+ --space-175: 1.75rem;
45
+ --space-200: 2rem;
46
+ --space-225: 2.25rem;
47
+ --space-250: 2.5rem;
48
+ --space-275: 2.75rem;
49
+ --space-300: 3rem;
50
+ --space-325: 3.25rem;
51
+ --space-350: 3.5rem;
52
+ --space-375: 3.75rem;
53
+ --space-400: 4rem;
54
54
  --space-none: 0;
55
- --space-xxxxs: 2;
56
- --space-xxxs: 4;
57
- --space-xxs: 8;
58
- --space-xs: 12;
59
- --space-s: 16;
60
- --space-m: 20;
61
- --space-l: 24;
62
- --space-xl: 32;
63
- --space-xxl: 40;
64
- --space-xxxl: 48;
65
- --space-xxxxl: 56;
55
+ --space-xxxxs: 0.125rem;
56
+ --space-xxxs: 0.25rem;
57
+ --space-xxs: 0.5rem;
58
+ --space-xs: 0.75rem;
59
+ --space-s: 1rem;
60
+ --space-m: 1.25rem;
61
+ --space-l: 1.5rem;
62
+ --space-xl: 2rem;
63
+ --space-xxl: 2.5rem;
64
+ --space-xxxl: 3rem;
65
+ --space-xxxxl: 3.5rem;
66
66
  --font-body-m-font-family: Figtree;
67
67
  --font-body-m-font-size: 1rem;
68
68
  --font-body-m-line-height: 140%;
@@ -178,15 +178,15 @@
178
178
  --color-fg-neutral: #33323d;
179
179
  --color-fg-subtle: #757388;
180
180
  --color-fg-inverse: #ffffff;
181
- --border-width-thin: 1;
182
- --border-width-thick: 2;
181
+ --border-width-thin: 1px;
182
+ --border-width-thick: 2px;
183
183
  --border-radius-none: 0;
184
- --border-radius-xs: 4;
185
- --border-radius-s: 8;
186
- --border-radius-m: 12;
187
- --border-radius-l: 16;
188
- --border-radius-xl: 24;
189
- --border-radius-pill: 999;
184
+ --border-radius-xs: 0.25rem;
185
+ --border-radius-s: 0.5rem;
186
+ --border-radius-m: 0.75rem;
187
+ --border-radius-l: 1rem;
188
+ --border-radius-xl: 1.5rem;
189
+ --border-radius-pill: 62.4375rem;
190
190
  }
191
191
 
192
192
  @media (min-width: 768px) {
@@ -215,17 +215,5 @@
215
215
  --font-title-m-font-weight: 800;
216
216
  --font-title-m-letter-spacing: 0;
217
217
  --font-title-m-text-decoration: none;
218
- --font-title-s-font-family: Ltt Recoleta;
219
- --font-title-s-font-size: 1.5rem;
220
- --font-title-s-line-height: 120%;
221
- --font-title-s-font-weight: 800;
222
- --font-title-s-letter-spacing: 0;
223
- --font-title-s-text-decoration: none;
224
- --font-title-xs-font-family: Ltt Recoleta;
225
- --font-title-xs-font-size: 1.25rem;
226
- --font-title-xs-line-height: 120%;
227
- --font-title-xs-font-weight: 800;
228
- --font-title-xs-letter-spacing: 0;
229
- --font-title-xs-text-decoration: none;
230
218
  }
231
219
  }
package/dist/css/kiabi-home.css CHANGED
@@ -4,65 +4,65 @@
4
4
 
5
5
  :root {
6
6
  --size-0: 0;
7
- --size-25: 4;
8
- --size-50: 8;
9
- --size-75: 12;
10
- --size-100: 16;
11
- --size-125: 20;
12
- --size-150: 24;
13
- --size-175: 28;
14
- --size-200: 32;
15
- --size-225: 36;
16
- --size-250: 40;
17
- --size-275: 44;
18
- --size-300: 48;
19
- --size-325: 52;
20
- --size-350: 56;
21
- --size-375: 60;
22
- --size-400: 64;
23
- --size-425: 68;
24
- --size-450: 72;
25
- --size-475: 76;
26
- --size-500: 80;
27
- --size-xxxs: 20;
28
- --size-xxs: 24;
29
- --size-xs: 32;
30
- --size-s: 36;
31
- --size-m: 40;
32
- --size-l: 48;
33
- --size-xl: 56;
34
- --size-xxl: 64;
35
- --size-xxxl: 80;
7
+ --size-25: 0.25rem;
8
+ --size-50: 0.5rem;
9
+ --size-75: 0.75rem;
10
+ --size-100: 1rem;
11
+ --size-125: 1.25rem;
12
+ --size-150: 1.5rem;
13
+ --size-175: 1.75rem;
14
+ --size-200: 2rem;
15
+ --size-225: 2.25rem;
16
+ --size-250: 2.5rem;
17
+ --size-275: 2.75rem;
18
+ --size-300: 3rem;
19
+ --size-325: 3.25rem;
20
+ --size-350: 3.5rem;
21
+ --size-375: 3.75rem;
22
+ --size-400: 4rem;
23
+ --size-425: 4.25rem;
24
+ --size-450: 4.5rem;
25
+ --size-475: 4.75rem;
26
+ --size-500: 5rem;
27
+ --size-xxxs: 1.25rem;
28
+ --size-xxs: 1.5rem;
29
+ --size-xs: 2rem;
30
+ --size-s: 2.25rem;
31
+ --size-m: 2.5rem;
32
+ --size-l: 3rem;
33
+ --size-xl: 3.5rem;
34
+ --size-xxl: 4rem;
35
+ --size-xxxl: 5rem;
36
36
  --space-0: 0;
37
- --space-12: 2;
38
- --space-25: 4;
39
- --space-50: 8;
40
- --space-75: 12;
41
- --space-100: 16;
42
- --space-125: 20;
43
- --space-150: 24;
44
- --space-175: 28;
45
- --space-200: 32;
46
- --space-225: 36;
47
- --space-250: 40;
48
- --space-275: 44;
49
- --space-300: 48;
50
- --space-325: 52;
51
- --space-350: 56;
52
- --space-375: 60;
53
- --space-400: 64;
37
+ --space-12: 0.125rem;
38
+ --space-25: 0.25rem;
39
+ --space-50: 0.5rem;
40
+ --space-75: 0.75rem;
41
+ --space-100: 1rem;
42
+ --space-125: 1.25rem;
43
+ --space-150: 1.5rem;
44
+ --space-175: 1.75rem;
45
+ --space-200: 2rem;
46
+ --space-225: 2.25rem;
47
+ --space-250: 2.5rem;
48
+ --space-275: 2.75rem;
49
+ --space-300: 3rem;
50
+ --space-325: 3.25rem;
51
+ --space-350: 3.5rem;
52
+ --space-375: 3.75rem;
53
+ --space-400: 4rem;
54
54
  --space-none: 0;
55
- --space-xxxxs: 2;
56
- --space-xxxs: 4;
57
- --space-xxs: 8;
58
- --space-xs: 12;
59
- --space-s: 16;
60
- --space-m: 20;
61
- --space-l: 24;
62
- --space-xl: 32;
63
- --space-xxl: 40;
64
- --space-xxxl: 48;
65
- --space-xxxxl: 56;
55
+ --space-xxxxs: 0.125rem;
56
+ --space-xxxs: 0.25rem;
57
+ --space-xxs: 0.5rem;
58
+ --space-xs: 0.75rem;
59
+ --space-s: 1rem;
60
+ --space-m: 1.25rem;
61
+ --space-l: 1.5rem;
62
+ --space-xl: 2rem;
63
+ --space-xxl: 2.5rem;
64
+ --space-xxxl: 3rem;
65
+ --space-xxxxl: 3.5rem;
66
66
  --font-body-m-font-family: Figtree;
67
67
  --font-body-m-font-size: 1rem;
68
68
  --font-body-m-line-height: 140%;
@@ -178,15 +178,15 @@
178
178
  --color-fg-neutral: #33323d;
179
179
  --color-fg-subtle: #757388;
180
180
  --color-fg-inverse: #ffffff;
181
- --border-width-thin: 1;
182
- --border-width-thick: 2;
181
+ --border-width-thin: 1px;
182
+ --border-width-thick: 2px;
183
183
  --border-radius-none: 0;
184
- --border-radius-xs: 4;
185
- --border-radius-s: 8;
186
- --border-radius-m: 12;
187
- --border-radius-l: 16;
188
- --border-radius-xl: 24;
189
- --border-radius-pill: 999;
184
+ --border-radius-xs: 0.25rem;
185
+ --border-radius-s: 0.5rem;
186
+ --border-radius-m: 0.75rem;
187
+ --border-radius-l: 1rem;
188
+ --border-radius-xl: 1.5rem;
189
+ --border-radius-pill: 62.4375rem;
190
190
  }
191
191
 
192
192
  @media (min-width: 768px) {
@@ -215,17 +215,5 @@
215
215
  --font-title-m-font-weight: 800;
216
216
  --font-title-m-letter-spacing: 0;
217
217
  --font-title-m-text-decoration: none;
218
- --font-title-s-font-family: Figtree;
219
- --font-title-s-font-size: 1.5rem;
220
- --font-title-s-line-height: 120%;
221
- --font-title-s-font-weight: 800;
222
- --font-title-s-letter-spacing: 0;
223
- --font-title-s-text-decoration: none;
224
- --font-title-xs-font-family: Figtree;
225
- --font-title-xs-font-size: 1.25rem;
226
- --font-title-xs-line-height: 120%;
227
- --font-title-xs-font-weight: 800;
228
- --font-title-xs-letter-spacing: 0;
229
- --font-title-xs-text-decoration: none;
230
218
  }
231
219
  }
package/dist/css/kiabi.css CHANGED
@@ -4,65 +4,65 @@
4
4
 
5
5
  :root {
6
6
  --size-0: 0;
7
- --size-25: 4;
8
- --size-50: 8;
9
- --size-75: 12;
10
- --size-100: 16;
11
- --size-125: 20;
12
- --size-150: 24;
13
- --size-175: 28;
14
- --size-200: 32;
15
- --size-225: 36;
16
- --size-250: 40;
17
- --size-275: 44;
18
- --size-300: 48;
19
- --size-325: 52;
20
- --size-350: 56;
21
- --size-375: 60;
22
- --size-400: 64;
23
- --size-425: 68;
24
- --size-450: 72;
25
- --size-475: 76;
26
- --size-500: 80;
27
- --size-xxxs: 20;
28
- --size-xxs: 24;
29
- --size-xs: 32;
30
- --size-s: 36;
31
- --size-m: 40;
32
- --size-l: 48;
33
- --size-xl: 56;
34
- --size-xxl: 64;
35
- --size-xxxl: 80;
7
+ --size-25: 0.25rem;
8
+ --size-50: 0.5rem;
9
+ --size-75: 0.75rem;
10
+ --size-100: 1rem;
11
+ --size-125: 1.25rem;
12
+ --size-150: 1.5rem;
13
+ --size-175: 1.75rem;
14
+ --size-200: 2rem;
15
+ --size-225: 2.25rem;
16
+ --size-250: 2.5rem;
17
+ --size-275: 2.75rem;
18
+ --size-300: 3rem;
19
+ --size-325: 3.25rem;
20
+ --size-350: 3.5rem;
21
+ --size-375: 3.75rem;
22
+ --size-400: 4rem;
23
+ --size-425: 4.25rem;
24
+ --size-450: 4.5rem;
25
+ --size-475: 4.75rem;
26
+ --size-500: 5rem;
27
+ --size-xxxs: 1.25rem;
28
+ --size-xxs: 1.5rem;
29
+ --size-xs: 2rem;
30
+ --size-s: 2.25rem;
31
+ --size-m: 2.5rem;
32
+ --size-l: 3rem;
33
+ --size-xl: 3.5rem;
34
+ --size-xxl: 4rem;
35
+ --size-xxxl: 5rem;
36
36
  --space-0: 0;
37
- --space-12: 2;
38
- --space-25: 4;
39
- --space-50: 8;
40
- --space-75: 12;
41
- --space-100: 16;
42
- --space-125: 20;
43
- --space-150: 24;
44
- --space-175: 28;
45
- --space-200: 32;
46
- --space-225: 36;
47
- --space-250: 40;
48
- --space-275: 44;
49
- --space-300: 48;
50
- --space-325: 52;
51
- --space-350: 56;
52
- --space-375: 60;
53
- --space-400: 64;
37
+ --space-12: 0.125rem;
38
+ --space-25: 0.25rem;
39
+ --space-50: 0.5rem;
40
+ --space-75: 0.75rem;
41
+ --space-100: 1rem;
42
+ --space-125: 1.25rem;
43
+ --space-150: 1.5rem;
44
+ --space-175: 1.75rem;
45
+ --space-200: 2rem;
46
+ --space-225: 2.25rem;
47
+ --space-250: 2.5rem;
48
+ --space-275: 2.75rem;
49
+ --space-300: 3rem;
50
+ --space-325: 3.25rem;
51
+ --space-350: 3.5rem;
52
+ --space-375: 3.75rem;
53
+ --space-400: 4rem;
54
54
  --space-none: 0;
55
- --space-xxxxs: 2;
56
- --space-xxxs: 4;
57
- --space-xxs: 8;
58
- --space-xs: 12;
59
- --space-s: 16;
60
- --space-m: 20;
61
- --space-l: 24;
62
- --space-xl: 32;
63
- --space-xxl: 40;
64
- --space-xxxl: 48;
65
- --space-xxxxl: 56;
55
+ --space-xxxxs: 0.125rem;
56
+ --space-xxxs: 0.25rem;
57
+ --space-xxs: 0.5rem;
58
+ --space-xs: 0.75rem;
59
+ --space-s: 1rem;
60
+ --space-m: 1.25rem;
61
+ --space-l: 1.5rem;
62
+ --space-xl: 2rem;
63
+ --space-xxl: 2.5rem;
64
+ --space-xxxl: 3rem;
65
+ --space-xxxxl: 3.5rem;
66
66
  --font-body-m-font-family: Figtree;
67
67
  --font-body-m-font-size: 1rem;
68
68
  --font-body-m-line-height: 140%;
@@ -178,15 +178,15 @@
178
178
  --color-fg-neutral: #33323d;
179
179
  --color-fg-subtle: #757388;
180
180
  --color-fg-inverse: #ffffff;
181
- --border-width-thin: 1;
182
- --border-width-thick: 2;
181
+ --border-width-thin: 1px;
182
+ --border-width-thick: 2px;
183
183
  --border-radius-none: 0;
184
- --border-radius-xs: 4;
185
- --border-radius-s: 8;
186
- --border-radius-m: 12;
187
- --border-radius-l: 16;
188
- --border-radius-xl: 24;
189
- --border-radius-pill: 999;
184
+ --border-radius-xs: 0.25rem;
185
+ --border-radius-s: 0.5rem;
186
+ --border-radius-m: 0.75rem;
187
+ --border-radius-l: 1rem;
188
+ --border-radius-xl: 1.5rem;
189
+ --border-radius-pill: 62.4375rem;
190
190
  }
191
191
 
192
192
  @media (min-width: 768px) {
@@ -215,17 +215,5 @@
215
215
  --font-title-m-font-weight: 800;
216
216
  --font-title-m-letter-spacing: 0;
217
217
  --font-title-m-text-decoration: none;
218
- --font-title-s-font-family: Figtree;
219
- --font-title-s-font-size: 1.5rem;
220
- --font-title-s-line-height: 120%;
221
- --font-title-s-font-weight: 800;
222
- --font-title-s-letter-spacing: 0;
223
- --font-title-s-text-decoration: none;
224
- --font-title-xs-font-family: Figtree;
225
- --font-title-xs-font-size: 1.25rem;
226
- --font-title-xs-line-height: 120%;
227
- --font-title-xs-font-weight: 800;
228
- --font-title-xs-letter-spacing: 0;
229
- --font-title-xs-text-decoration: none;
230
218
  }
231
219
  }
package/dist/css/kitchoun.css CHANGED
@@ -4,65 +4,65 @@
4
4
 
5
5
  :root {
6
6
  --size-0: 0;
7
- --size-25: 4;
8
- --size-50: 8;
9
- --size-75: 12;
10
- --size-100: 16;
11
- --size-125: 20;
12
- --size-150: 24;
13
- --size-175: 28;
14
- --size-200: 32;
15
- --size-225: 36;
16
- --size-250: 40;
17
- --size-275: 44;
18
- --size-300: 48;
19
- --size-325: 52;
20
- --size-350: 56;
21
- --size-375: 60;
22
- --size-400: 64;
23
- --size-425: 68;
24
- --size-450: 72;
25
- --size-475: 76;
26
- --size-500: 80;
27
- --size-xxxs: 20;
28
- --size-xxs: 24;
29
- --size-xs: 32;
30
- --size-s: 36;
31
- --size-m: 40;
32
- --size-l: 48;
33
- --size-xl: 56;
34
- --size-xxl: 64;
35
- --size-xxxl: 80;
7
+ --size-25: 0.25rem;
8
+ --size-50: 0.5rem;
9
+ --size-75: 0.75rem;
10
+ --size-100: 1rem;
11
+ --size-125: 1.25rem;
12
+ --size-150: 1.5rem;
13
+ --size-175: 1.75rem;
14
+ --size-200: 2rem;
15
+ --size-225: 2.25rem;
16
+ --size-250: 2.5rem;
17
+ --size-275: 2.75rem;
18
+ --size-300: 3rem;
19
+ --size-325: 3.25rem;
20
+ --size-350: 3.5rem;
21
+ --size-375: 3.75rem;
22
+ --size-400: 4rem;
23
+ --size-425: 4.25rem;
24
+ --size-450: 4.5rem;
25
+ --size-475: 4.75rem;
26
+ --size-500: 5rem;
27
+ --size-xxxs: 1.25rem;
28
+ --size-xxs: 1.5rem;
29
+ --size-xs: 2rem;
30
+ --size-s: 2.25rem;
31
+ --size-m: 2.5rem;
32
+ --size-l: 3rem;
33
+ --size-xl: 3.5rem;
34
+ --size-xxl: 4rem;
35
+ --size-xxxl: 5rem;
36
36
  --space-0: 0;
37
- --space-12: 2;
38
- --space-25: 4;
39
- --space-50: 8;
40
- --space-75: 12;
41
- --space-100: 16;
42
- --space-125: 20;
43
- --space-150: 24;
44
- --space-175: 28;
45
- --space-200: 32;
46
- --space-225: 36;
47
- --space-250: 40;
48
- --space-275: 44;
49
- --space-300: 48;
50
- --space-325: 52;
51
- --space-350: 56;
52
- --space-375: 60;
53
- --space-400: 64;
37
+ --space-12: 0.125rem;
38
+ --space-25: 0.25rem;
39
+ --space-50: 0.5rem;
40
+ --space-75: 0.75rem;
41
+ --space-100: 1rem;
42
+ --space-125: 1.25rem;
43
+ --space-150: 1.5rem;
44
+ --space-175: 1.75rem;
45
+ --space-200: 2rem;
46
+ --space-225: 2.25rem;
47
+ --space-250: 2.5rem;
48
+ --space-275: 2.75rem;
49
+ --space-300: 3rem;
50
+ --space-325: 3.25rem;
51
+ --space-350: 3.5rem;
52
+ --space-375: 3.75rem;
53
+ --space-400: 4rem;
54
54
  --space-none: 0;
55
- --space-xxxxs: 2;
56
- --space-xxxs: 4;
57
- --space-xxs: 8;
58
- --space-xs: 12;
59
- --space-s: 16;
60
- --space-m: 20;
61
- --space-l: 24;
62
- --space-xl: 32;
63
- --space-xxl: 40;
64
- --space-xxxl: 48;
65
- --space-xxxxl: 56;
55
+ --space-xxxxs: 0.125rem;
56
+ --space-xxxs: 0.25rem;
57
+ --space-xxs: 0.5rem;
58
+ --space-xs: 0.75rem;
59
+ --space-s: 1rem;
60
+ --space-m: 1.25rem;
61
+ --space-l: 1.5rem;
62
+ --space-xl: 2rem;
63
+ --space-xxl: 2.5rem;
64
+ --space-xxxl: 3rem;
65
+ --space-xxxxl: 3.5rem;
66
66
  --font-body-m-font-family: Figtree;
67
67
  --font-body-m-font-size: 1rem;
68
68
  --font-body-m-line-height: 140%;
@@ -178,15 +178,15 @@
178
178
  --color-fg-neutral: #33323d;
179
179
  --color-fg-subtle: #757388;
180
180
  --color-fg-inverse: #ffffff;
181
- --border-width-thin: 1;
182
- --border-width-thick: 2;
181
+ --border-width-thin: 1px;
182
+ --border-width-thick: 2px;
183
183
  --border-radius-none: 0;
184
- --border-radius-xs: 4;
185
- --border-radius-s: 8;
186
- --border-radius-m: 12;
187
- --border-radius-l: 16;
188
- --border-radius-xl: 24;
189
- --border-radius-pill: 999;
184
+ --border-radius-xs: 0.25rem;
185
+ --border-radius-s: 0.5rem;
186
+ --border-radius-m: 0.75rem;
187
+ --border-radius-l: 1rem;
188
+ --border-radius-xl: 1.5rem;
189
+ --border-radius-pill: 62.4375rem;
190
190
  }
191
191
 
192
192
  @media (min-width: 768px) {
@@ -215,17 +215,5 @@
215
215
  --font-title-m-font-weight: 800;
216
216
  --font-title-m-letter-spacing: 0;
217
217
  --font-title-m-text-decoration: none;
218
- --font-title-s-font-family: Fredoka;
219
- --font-title-s-font-size: 1.5rem;
220
- --font-title-s-line-height: 120%;
221
- --font-title-s-font-weight: 800;
222
- --font-title-s-letter-spacing: 0;
223
- --font-title-s-text-decoration: none;
224
- --font-title-xs-font-family: Fredoka;
225
- --font-title-xs-font-size: 1.25rem;
226
- --font-title-xs-line-height: 120%;
227
- --font-title-xs-font-weight: 800;
228
- --font-title-xs-letter-spacing: 0;
229
- --font-title-xs-text-decoration: none;
230
218
  }
231
219
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kommon-lab/tokens",
3
- "version": "0.1.3",
3
+ "version": "0.1.5",
4
4
  "description": "Design tokens for Kommon Lab multi-brand design system",
5
5
  "exports": {
6
6
  "./css/*": "./dist/css/*",
package/tokens/desktop-typography_tokens.json CHANGED
@@ -46,28 +46,6 @@
46
46
  "letterSpacing": 0,
47
47
  "textDecoration": "none"
48
48
  }
49
- },
50
- "s": {
51
- "$type": "typography",
52
- "value": {
53
- "fontFamily": "{font.family}",
54
- "fontSize": "1.5rem",
55
- "lineHeight": "120%",
56
- "fontWeight": "{font.weight.extra-bold}",
57
- "letterSpacing": 0,
58
- "textDecoration": "none"
59
- }
60
- },
61
- "xs": {
62
- "$type": "typography",
63
- "value": {
64
- "fontFamily": "{font.family}",
65
- "fontSize": "1.25rem",
66
- "lineHeight": "120%",
67
- "fontWeight": "{font.weight.extra-bold}",
68
- "letterSpacing": 0,
69
- "textDecoration": "none"
70
- }
71
49
  }
72
50
  }
73
51
  }
package/tokens/desktop_tokens.json DELETED
@@ -1,41 +0,0 @@
1
- {
2
- "font-size": {
3
- "display": {
4
- "large": { "value": 72 },
5
- "medium": { "value": 56 }
6
- },
7
- "title": {
8
- "large": { "value": 40 },
9
- "medium": { "value": 32 },
10
- "small": { "value": 24 },
11
- "xsmall": { "value": 20 }
12
- },
13
- "body": {
14
- "medium": { "value": 16 },
15
- "small": { "value": 14 },
16
- "xsmall": { "value": 12 }
17
- }
18
- },
19
- "line-height": {
20
- "display": {
21
- "large": { "value": 100 },
22
- "medium": { "value": 100 }
23
- },
24
- "title": {
25
- "large": { "value": 120 },
26
- "medium": { "value": 120 },
27
- "small": { "value": 120 },
28
- "xsmall": { "value": 120 }
29
- },
30
- "body": {
31
- "medium": { "value": 140 },
32
- "small": { "value": 140 },
33
- "xsmall": { "value": 140 }
34
- }
35
- },
36
- "family": {
37
- "display": { "value": "{font.family}" },
38
- "title": { "value": "{font.family}" },
39
- "body": { "value": "Figtree" }
40
- }
41
- }
package/tokens/mobile_tokens.json DELETED
@@ -1,41 +0,0 @@
1
- {
2
- "font-size": {
3
- "display": {
4
- "large": { "value": 48 },
5
- "medium": { "value": 38 }
6
- },
7
- "title": {
8
- "large": { "value": 32 },
9
- "medium": { "value": 28 },
10
- "small": { "value": 24 },
11
- "xsmall": { "value": 20 }
12
- },
13
- "body": {
14
- "medium": { "value": 16 },
15
- "small": { "value": 14 },
16
- "xsmall": { "value": 12 }
17
- }
18
- },
19
- "line-height": {
20
- "display": {
21
- "large": { "value": 100 },
22
- "medium": { "value": 100 }
23
- },
24
- "title": {
25
- "large": { "value": 120 },
26
- "medium": { "value": 120 },
27
- "small": { "value": 120 },
28
- "xsmall": { "value": 120 }
29
- },
30
- "body": {
31
- "medium": { "value": 140 },
32
- "small": { "value": 140 },
33
- "xsmall": { "value": 140 }
34
- }
35
- },
36
- "family": {
37
- "display": { "value": "{font.family}" },
38
- "title": { "value": "{font.family}" },
39
- "body": { "value": "Figtree" }
40
- }
41
- }