@depersgroep/lfvp-design-tokens 0.372.0-8da8416 → 0.372.0-99f9263

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 (7) hide show
  1. package/package.json +1 -1
  2. package/tokens/$metadata.json +0 -2
  3. package/tokens/$themes.json +4 -12
  4. package/tokens/components/pricing-table.json +247 -142
  5. package/tokens/components/tab-bar.json +107 -90
  6. package/tokens/components/badge.json +0 -92
  7. package/tokens/components/tv-button-list.json +0 -50
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@depersgroep/lfvp-design-tokens",
3
- "version": "0.372.0-8da8416",
3
+ "version": "0.372.0-99f9263",
4
4
  "description": "Figma design tokens for LFVP",
5
5
  "keywords": [
6
6
  "design",
package/tokens/$metadata.json CHANGED
@@ -10,7 +10,6 @@
10
10
  "brands/vtmgo",
11
11
  "brands/whitelabel",
12
12
  "components/avatar",
13
- "components/badge",
14
13
  "components/billboard",
15
14
  "components/box",
16
15
  "components/boxcover",
@@ -43,7 +42,6 @@
43
42
  "components/top-10",
44
43
  "components/top-banner",
45
44
  "components/top-of-screen",
46
- "components/tv-button-list",
47
45
  "components/tv-hero",
48
46
  "components/upsell",
49
47
  "screen/large",
package/tokens/$themes.json CHANGED
@@ -44,9 +44,7 @@
44
44
  "components/upsell": "enabled",
45
45
  "components/selectable-button": "enabled",
46
46
  "components/dropdown-list": "enabled",
47
- "components/tv-hero": "enabled",
48
- "components/tv-button-list": "enabled",
49
- "components/badge": "enabled"
47
+ "components/tv-hero": "enabled"
50
48
  },
51
49
  "$figmaCollectionId": "VariableCollectionId:3:7330",
52
50
  "$figmaModeId": "3:0",
@@ -98,9 +96,7 @@
98
96
  "components/upsell": "enabled",
99
97
  "components/selectable-button": "enabled",
100
98
  "components/dropdown-list": "enabled",
101
- "components/tv-hero": "enabled",
102
- "components/tv-button-list": "enabled",
103
- "components/badge": "enabled"
99
+ "components/tv-hero": "enabled"
104
100
  },
105
101
  "$figmaCollectionId": "VariableCollectionId:3:7330",
106
102
  "$figmaModeId": "3:1",
@@ -152,9 +148,7 @@
152
148
  "components/upsell": "enabled",
153
149
  "components/selectable-button": "enabled",
154
150
  "components/dropdown-list": "enabled",
155
- "components/tv-hero": "enabled",
156
- "components/tv-button-list": "enabled",
157
- "components/badge": "enabled"
151
+ "components/tv-hero": "enabled"
158
152
  },
159
153
  "$figmaCollectionId": "VariableCollectionId:3:7330",
160
154
  "$figmaModeId": "3:2",
@@ -206,9 +200,7 @@
206
200
  "components/upsell": "enabled",
207
201
  "components/selectable-button": "enabled",
208
202
  "components/dropdown-list": "enabled",
209
- "components/tv-hero": "enabled",
210
- "components/tv-button-list": "enabled",
211
- "components/badge": "enabled"
203
+ "components/tv-hero": "enabled"
212
204
  },
213
205
  "$figmaCollectionId": "VariableCollectionId:3:7330",
214
206
  "$figmaModeId": "3:3",
package/tokens/components/pricing-table.json CHANGED
@@ -1,173 +1,173 @@
1
1
  {
2
- "productSelector": {
3
- "borderRadius": {
4
- "$type": "borderRadius",
5
- "$value": "{core.borderRadius.4}"
6
- },
7
- "logoHeight": {
8
- "$type": "sizing",
9
- "$value": "{base.ui.sizing.fixed.sz4}"
10
- },
11
- "gap": {
12
- "$type": "spacing",
13
- "$value": "{core.spacing.8}"
14
- },
15
- "horizontalPadding": {
16
- "$type": "spacing",
17
- "$value": "{base.ui.spacing.flex.sp2}"
18
- },
19
- "topPadding": {
20
- "$type": "spacing",
21
- "$value": "{base.ui.spacing.flex.sp5}"
22
- },
23
- "bottomPadding": {
24
- "$type": "spacing",
25
- "$value": "{base.ui.spacing.flex.sp4}"
26
- },
27
- "normal": {
28
- "backgroundColor": {
29
- "$type": "color",
30
- "$value": "none"
2
+ "pricingTable": {
3
+ "productSelector": {
4
+ "borderRadius": {
5
+ "$type": "borderRadius",
6
+ "$value": "{core.borderRadius.4}"
31
7
  },
32
- "textColor": {
33
- "$type": "color",
34
- "$value": "{base.color.ui.accent2}"
8
+ "logoHeight": {
9
+ "$type": "sizing",
10
+ "$value": "{base.ui.sizing.fixed.sz4}"
35
11
  },
36
- "arrowColor": {
37
- "$type": "color",
38
- "$value": "{base.color.transparent}"
12
+ "gap": {
13
+ "$type": "spacing",
14
+ "$value": "{core.spacing.8}"
39
15
  },
40
- "border": {
41
- "$type": "border",
42
- "$value": {
43
- "color": "{base.color.transparent}",
44
- "width": "{base.plan.normalBorderWidth}",
45
- "style": "{base.stroke.style.solid}"
46
- }
47
- }
48
- },
49
- "active": {
50
- "backgroundColor": {
51
- "$type": "color",
52
- "$value": "{base.color.plan.active.backgroundColor}"
16
+ "horizontalPadding": {
17
+ "$type": "spacing",
18
+ "$value": "{base.ui.spacing.flex.sp2}"
53
19
  },
54
- "arrowColor": {
55
- "$type": "color",
56
- "$value": "{base.color.plan.active.arrowColor}"
20
+ "topPadding": {
21
+ "$type": "spacing",
22
+ "$value": "{base.ui.spacing.flex.sp5}"
57
23
  },
58
- "textColor": {
59
- "$type": "color",
60
- "$value": "{base.color.ui.white}"
24
+ "bottomPadding": {
25
+ "$type": "spacing",
26
+ "$value": "{base.ui.spacing.flex.sp4}"
61
27
  },
62
- "border": {
63
- "$type": "border",
64
- "$value": {
65
- "color": "{base.color.plan.active.borderColor}",
66
- "width": "{base.plan.activeBorderWidth}",
67
- "style": "{base.stroke.style.solid}"
28
+ "normal": {
29
+ "backgroundColor": {
30
+ "$type": "color",
31
+ "$value": "none"
32
+ },
33
+ "textColor": {
34
+ "$type": "color",
35
+ "$value": "{base.color.ui.accent2}"
36
+ },
37
+ "arrowColor": {
38
+ "$type": "color",
39
+ "$value": "{base.color.transparent}"
40
+ },
41
+ "border": {
42
+ "$type": "border",
43
+ "$value": {
44
+ "color": "{base.color.transparent}",
45
+ "width": "{base.plan.normalBorderWidth}",
46
+ "style": "{base.stroke.style.solid}"
47
+ }
68
48
  }
69
- }
70
- },
71
- "text": {
72
- "$type": "typography",
73
- "$value": {
74
- "fontFamily": "{base.primaryFont}",
75
- "lineHeight": "{core.lineHeight.140}",
76
- "fontSize": "{core.fontSize.12}*{scale.text}",
77
- "fontWeight": "{base.fontWeight.emphasized}"
78
- }
79
- }
80
- },
81
- "productProperty": {
82
- "borderRadius": {
83
- "$type": "borderRadius",
84
- "$value": "{core.borderRadius.4}"
85
- },
86
- "normal": {
87
- "backgroundColor": {
88
- "$type": "color",
89
- "$value": "{base.color.transparent}"
90
49
  },
91
- "textColor": {
92
- "$type": "color",
93
- "$value": "{base.color.text.default}"
50
+ "active": {
51
+ "backgroundColor": {
52
+ "$type": "color",
53
+ "$value": "{base.color.plan.active.backgroundColor}"
54
+ },
55
+ "arrowColor": {
56
+ "$type": "color",
57
+ "$value": "{base.color.plan.active.arrowColor}"
58
+ },
59
+ "textColor": {
60
+ "$type": "color",
61
+ "$value": "{base.color.ui.white}"
62
+ },
63
+ "border": {
64
+ "$type": "border",
65
+ "$value": {
66
+ "color": "{base.color.plan.active.borderColor}",
67
+ "width": "{base.plan.activeBorderWidth}",
68
+ "style": "{base.stroke.style.solid}"
69
+ }
70
+ }
94
71
  },
95
- "discountColor": {
96
- "$type": "color",
97
- "$value": "{base.color.primary.lighter}"
72
+ "text": {
73
+ "$type": "typography",
74
+ "$value": {
75
+ "fontFamily": "{base.primaryFont}",
76
+ "lineHeight": "{core.lineHeight.140}",
77
+ "fontSize": "{core.fontSize.12}*{scale.text}",
78
+ "fontWeight": "{base.fontWeight.emphasized}"
79
+ }
98
80
  }
99
81
  },
100
- "active": {
101
- "discountColor": {
102
- "$type": "color",
103
- "$value": "{base.color.primary.lighter}"
82
+ "productProperty": {
83
+ "borderRadius": {
84
+ "$type": "borderRadius",
85
+ "$value": "{core.borderRadius.4}"
104
86
  },
105
- "backgroundColor": {
106
- "$type": "color",
107
- "$value": "{base.color.ui.dark3}"
87
+ "normal": {
88
+ "backgroundColor": {
89
+ "$type": "color",
90
+ "$value": "{base.color.transparent}"
91
+ },
92
+ "textColor": {
93
+ "$type": "color",
94
+ "$value": "{base.color.text.default}"
95
+ },
96
+ "discountColor": {
97
+ "$type": "color",
98
+ "$value": "{base.color.primary.lighter}"
99
+ }
108
100
  },
109
- "textColor": {
110
- "$type": "color",
111
- "$value": "{base.color.text.default}"
112
- }
113
- },
114
- "text": {
115
- "$type": "typography",
116
- "$value": {
117
- "fontFamily": "{base.primaryFont}",
118
- "fontWeight": "{base.fontWeight.bold}",
119
- "fontSize": "{core.fontSize.20}",
120
- "lineHeight": "{core.lineHeight.120}"
121
- }
122
- },
123
- "padding": {
124
- "$type": "spacing",
125
- "$value": "{base.ui.spacing.fixed.sp2}"
126
- },
127
- "discountText": {
128
- "$type": "typography",
129
- "$value": {
130
- "fontFamily": "{base.primaryFont}",
131
- "fontWeight": "{base.fontWeight.emphasized}",
132
- "fontSize": "{core.fontSize.12}",
133
- "lineHeight": "{core.lineHeight.120}"
134
- }
135
- }
136
- },
137
- "promotedProductProperty": {
138
- "heading": {
139
- "textColor": {
140
- "$type": "color",
141
- "$value": "{base.color.ui.dark4}"
101
+ "active": {
102
+ "discountColor": {
103
+ "$type": "color",
104
+ "$value": "{base.color.primary.lighter}"
105
+ },
106
+ "backgroundColor": {
107
+ "$type": "color",
108
+ "$value": "{base.color.ui.dark3}"
109
+ },
110
+ "textColor": {
111
+ "$type": "color",
112
+ "$value": "{base.color.text.default}"
113
+ }
142
114
  },
143
- "backgroundColor": {
144
- "$type": "color",
145
- "$value": "{base.color.text.default}"
115
+ "text": {
116
+ "$type": "typography",
117
+ "$value": {
118
+ "fontFamily": "{base.primaryFont}",
119
+ "fontWeight": "{base.fontWeight.bold}",
120
+ "fontSize": "{core.fontSize.20}",
121
+ "lineHeight": "{core.lineHeight.120}"
122
+ }
146
123
  },
147
124
  "padding": {
148
125
  "$type": "spacing",
149
- "$value": "{core.spacing.4}"
126
+ "$value": "{base.ui.spacing.fixed.sp2}"
150
127
  },
151
- "text": {
128
+ "discountText": {
152
129
  "$type": "typography",
153
130
  "$value": {
154
131
  "fontFamily": "{base.primaryFont}",
155
- "fontWeight": "{base.fontWeight.bold}",
132
+ "fontWeight": "{base.fontWeight.emphasized}",
156
133
  "fontSize": "{core.fontSize.12}",
157
134
  "lineHeight": "{core.lineHeight.120}"
158
135
  }
159
136
  }
160
137
  },
161
- "border": {
162
- "$type": "border",
163
- "$value": {
164
- "color": "{base.color.ui.white}",
165
- "width": "{core.borderWidth.2}",
166
- "style": "{base.stroke.style.solid}"
138
+ "promotedProductProperty": {
139
+ "heading": {
140
+ "textColor": {
141
+ "$type": "color",
142
+ "$value": "{base.color.ui.dark4}"
143
+ },
144
+ "backgroundColor": {
145
+ "$type": "color",
146
+ "$value": "{base.color.text.default}"
147
+ },
148
+ "padding": {
149
+ "$type": "spacing",
150
+ "$value": "{core.spacing.4}"
151
+ },
152
+ "text": {
153
+ "$type": "typography",
154
+ "$value": {
155
+ "fontFamily": "{base.primaryFont}",
156
+ "fontWeight": "{base.fontWeight.bold}",
157
+ "fontSize": "{core.fontSize.12}",
158
+ "lineHeight": "{core.lineHeight.120}"
159
+ }
160
+ }
161
+ },
162
+ "border": {
163
+ "$type": "border",
164
+ "$value": {
165
+ "color": "{base.color.ui.white}",
166
+ "width": "{core.borderWidth.2}",
167
+ "style": "{base.stroke.style.solid}"
168
+ }
167
169
  }
168
- }
169
- },
170
- "pricingTable": {
170
+ },
171
171
  "horizontalGap": {
172
172
  "$type": "spacing",
173
173
  "$value": "{base.ui.spacing.fixed.sp1}"
@@ -195,6 +195,111 @@
195
195
  "gap": {
196
196
  "$type": "spacing",
197
197
  "$value": "{core.spacing.24}"
198
+ },
199
+ "promoTag": {
200
+ "margin": {
201
+ "$type": "spacing",
202
+ "$value": "{core.spacing.4}"
203
+ },
204
+ "padding": {
205
+ "$type": "spacing",
206
+ "$value": "{core.spacing.4}"
207
+ },
208
+ "backgroundColor": {
209
+ "$type": "color",
210
+ "$value": "{base.color.ui.white}"
211
+ },
212
+ "textColor": {
213
+ "$type": "color",
214
+ "$value": "{base.color.ui.dark1}"
215
+ },
216
+ "borderRadius": {
217
+ "$type": "borderRadius",
218
+ "$value": "{base.ui.borderRadius.fixed.br2}"
219
+ },
220
+ "text": {
221
+ "$type": "typography",
222
+ "$value": {
223
+ "fontFamily": "{base.primaryFont}",
224
+ "fontWeight": "{base.fontWeight.bold}",
225
+ "fontSize": "{core.fontSize.12}",
226
+ "lineHeight": "{core.lineHeight.110}"
227
+ }
228
+ }
229
+ },
230
+ "tab": {
231
+ "padding": {
232
+ "$type": "spacing",
233
+ "$value": "{base.ui.spacing.flex.sp2}"
234
+ },
235
+ "normal": {
236
+ "labelColor": {
237
+ "$type": "color",
238
+ "$value": "{base.color.ui.white}"
239
+ },
240
+ "backgroundColor": {
241
+ "$type": "color",
242
+ "$value": "none"
243
+ },
244
+ "subLabelColor": {
245
+ "$type": "color",
246
+ "$value": "{base.color.primary.lighter}"
247
+ }
248
+ },
249
+ "active": {
250
+ "labelColor": {
251
+ "$type": "color",
252
+ "$value": "{base.color.ui.white}"
253
+ },
254
+ "backgroundColor": {
255
+ "$type": "color",
256
+ "$value": "{base.color.primary.default}"
257
+ },
258
+ "subLabelColor": {
259
+ "$type": "color",
260
+ "$value": "{base.color.ui.dark1}"
261
+ }
262
+ },
263
+ "borderRadius": {
264
+ "$type": "borderRadius",
265
+ "$value": "{base.ui.borderRadius.fixed.br4}"
266
+ },
267
+ "label": {
268
+ "$type": "typography",
269
+ "$value": {
270
+ "fontFamily": "{base.primaryFont}",
271
+ "fontWeight": "{base.fontWeight.bold}",
272
+ "fontSize": "{core.fontSize.14}*{scale.text}",
273
+ "lineHeight": "{core.lineHeight.120}"
274
+ }
275
+ },
276
+ "subLabel": {
277
+ "$type": "typography",
278
+ "$value": {
279
+ "fontFamily": "{base.primaryFont}",
280
+ "fontWeight": "{base.fontWeight.emphasized}",
281
+ "fontSize": "{core.fontSize.11}*{scale.text}",
282
+ "lineHeight": "{core.lineHeight.120}"
283
+ }
284
+ }
285
+ },
286
+ "tabBar": {
287
+ "offset": {
288
+ "$type": "spacing",
289
+ "$value": "{core.spacing.2}"
290
+ },
291
+ "borderRadius": {
292
+ "$type": "borderRadius",
293
+ "$value": "{base.ui.borderRadius.fixed.br4}"
294
+ },
295
+ "border": {
296
+ "$type": "border",
297
+ "$value": {
298
+ "color": "{base.color.ui.white}",
299
+ "width": "{core.borderWidth.2}",
300
+ "style": "{base.stroke.style.solid}"
301
+ }
302
+ }
198
303
  }
199
304
  }
200
305
  }
package/tokens/components/tab-bar.json CHANGED
@@ -1,107 +1,124 @@
1
1
  {
2
- "promoTag": {
3
- "text": {
2
+ "tabBar": {
3
+ "label": {
4
4
  "$type": "typography",
5
- "$value": {
6
- "fontFamily": "{base.primaryFont}",
7
- "fontWeight": "{base.fontWeight.bold}",
8
- "fontSize": "{core.fontSize.12}",
9
- "lineHeight": "{core.lineHeight.110}"
10
- }
11
- },
12
- "backgroundColor": {
13
- "$type": "color",
14
- "$value": "{base.color.ui.white}"
15
- },
16
- "textColor": {
17
- "$type": "color",
18
- "$value": "{base.color.ui.dark1}"
19
- },
20
- "borderRadius": {
21
- "$type": "borderRadius",
22
- "$value": "{base.ui.borderRadius.fixed.br2}"
23
- },
24
- "margin": {
25
- "$type": "spacing",
26
- "$value": "{core.spacing.4}"
5
+ "$value": "{base.typography.text.bold.small}"
27
6
  },
28
- "padding": {
29
- "$type": "spacing",
30
- "$value": "{core.spacing.4}"
31
- }
32
- },
33
- "tab": {
34
- "normal": {
35
- "labelColor": {
36
- "$type": "color",
37
- "$value": "{base.color.ui.white}"
7
+ "unselected": {
8
+ "normal": {
9
+ "textColor": {
10
+ "$type": "color",
11
+ "$value": "{base.color.text.subtle}"
12
+ },
13
+ "borderColor": {
14
+ "$type": "color",
15
+ "$value": "{base.color.ui.dark4}"
16
+ }
38
17
  },
39
- "backgroundColor": {
40
- "$type": "color",
41
- "$value": "none"
18
+ "hover": {
19
+ "textColor": {
20
+ "$type": "color",
21
+ "$value": "{base.color.text.default}"
22
+ },
23
+ "borderColor": {
24
+ "$type": "color",
25
+ "$value": "{base.color.ui.dark4}"
26
+ }
42
27
  },
43
- "subLabelColor": {
44
- "$type": "color",
45
- "$value": "{base.color.primary.lighter}"
46
- }
47
- },
48
- "label": {
49
- "$type": "typography",
50
- "$value": {
51
- "fontFamily": "{base.primaryFont}",
52
- "fontWeight": "{base.fontWeight.bold}",
53
- "fontSize": "{core.fontSize.14}*{scale.text}",
54
- "lineHeight": "{core.lineHeight.120}"
55
- }
56
- },
57
- "subLabel": {
58
- "$type": "typography",
59
- "$value": {
60
- "fontFamily": "{base.primaryFont}",
61
- "fontWeight": "{base.fontWeight.emphasized}",
62
- "fontSize": "{core.fontSize.11}*{scale.text}",
63
- "lineHeight": "{core.lineHeight.120}"
28
+ "active": {
29
+ "textColor": {
30
+ "$type": "color",
31
+ "$value": "{base.color.text.subtle}"
32
+ },
33
+ "borderColor": {
34
+ "$type": "color",
35
+ "$value": "{base.color.ui.dark4}"
36
+ }
37
+ },
38
+ "focus": {
39
+ "textColor": {
40
+ "$type": "color",
41
+ "$value": "{base.color.text.subtle}"
42
+ },
43
+ "borderColor": {
44
+ "$type": "color",
45
+ "$value": "{base.color.ui.dark4}"
46
+ }
47
+ },
48
+ "disabled": {
49
+ "textColor": {
50
+ "$type": "color",
51
+ "$value": "{base.color.ui.accent2}"
52
+ },
53
+ "borderColor": {
54
+ "$type": "color",
55
+ "$value": "{base.color.ui.dark4}"
56
+ }
64
57
  }
65
58
  },
66
- "active": {
67
- "labelColor": {
68
- "$type": "color",
69
- "$value": "{base.color.ui.white}"
59
+ "selected": {
60
+ "normal": {
61
+ "textColor": {
62
+ "$type": "color",
63
+ "$value": "{base.color.text.default}"
64
+ },
65
+ "borderColor": {
66
+ "$type": "color",
67
+ "$value": "{base.color.primary.default}"
68
+ }
69
+ },
70
+ "hover": {
71
+ "textColor": {
72
+ "$type": "color",
73
+ "$value": "{base.color.text.default}"
74
+ },
75
+ "borderColor": {
76
+ "$type": "color",
77
+ "$value": "{base.color.primary.darker}"
78
+ }
79
+ },
80
+ "active": {
81
+ "textColor": {
82
+ "$type": "color",
83
+ "$value": "{base.color.text.default}"
84
+ },
85
+ "borderColor": {
86
+ "$type": "color",
87
+ "$value": "{base.color.primary.default}"
88
+ }
70
89
  },
71
- "backgroundColor": {
72
- "$type": "color",
73
- "$value": "{base.color.primary.default}"
90
+ "focus": {
91
+ "textColor": {
92
+ "$type": "color",
93
+ "$value": "{base.color.text.default}"
94
+ },
95
+ "borderColor": {
96
+ "$type": "color",
97
+ "$value": "{base.color.primary.default}"
98
+ }
74
99
  },
75
- "subLabelColor": {
76
- "$type": "color",
77
- "$value": "{base.color.ui.dark1}"
100
+ "disabled": {
101
+ "textColor": {
102
+ "$type": "color",
103
+ "$value": "{base.color.ui.accent2}"
104
+ },
105
+ "borderColor": {
106
+ "$type": "color",
107
+ "$value": "{base.color.primary.default}"
108
+ }
78
109
  }
79
110
  },
80
- "borderRadius": {
81
- "$type": "borderRadius",
82
- "$value": "{base.ui.borderRadius.fixed.br4}"
111
+ "borderWidth": {
112
+ "$type": "borderWidth",
113
+ "$value": "{base.ui.borderWidth.flex.bw2}"
83
114
  },
84
- "padding": {
115
+ "gap": {
85
116
  "$type": "spacing",
86
- "$value": "{base.ui.spacing.flex.sp2}"
87
- }
88
- },
89
- "tabBar": {
90
- "offset": {
91
- "$type": "spacing",
92
- "$value": "{core.spacing.2}"
117
+ "$value": "{base.ui.spacing.flex.sp4}"
93
118
  },
94
- "border": {
95
- "$type": "border",
96
- "$value": {
97
- "color": "{base.color.ui.white}",
98
- "width": "{core.borderWidth.2}",
99
- "style": "{base.stroke.style.solid}"
100
- }
101
- },
102
- "borderRadius": {
103
- "$type": "borderRadius",
104
- "$value": "{base.ui.borderRadius.fixed.br4}"
119
+ "verticalPadding": {
120
+ "$type": "spacing",
121
+ "$value": "{base.ui.spacing.flex.sp3}"
105
122
  }
106
123
  }
107
124
  }
package/tokens/components/badge.json DELETED
@@ -1,92 +0,0 @@
1
- {
2
- "badge": {
3
- "small": {
4
- "label": {
5
- "$type": "typography",
6
- "$value": "{base.typography.meta.bold}"
7
- },
8
- "horizontalPadding": {
9
- "$type": "spacing",
10
- "$value": "{badge.small.fontSize}/3"
11
- },
12
- "gap": {
13
- "$type": "spacing",
14
- "$value": "{badge.small.fontSize}/3"
15
- },
16
- "verticalPadding": {
17
- "$type": "spacing",
18
- "$value": "{badge.small.fontSize}/6"
19
- },
20
- "borderRadius": {
21
- "$type": "borderRadius",
22
- "$value": "{badge.small.fontSize}/3"
23
- },
24
- "iconSize": {
25
- "$type": "sizing",
26
- "$value": "{badge.small.fontSize}*1.4"
27
- },
28
- "fontSize": {
29
- "$type": "fontSizes",
30
- "$value": "{core.fontSize.12}*{scale.text}"
31
- },
32
- "height": {
33
- "$type": "sizing",
34
- "$value": "{badge.small.fontSize}*1.8"
35
- }
36
- },
37
- "medium": {
38
- "label": {
39
- "$type": "typography",
40
- "$value": "{base.typography.text.bold.xSmall}"
41
- },
42
- "horizontalPadding": {
43
- "$type": "spacing",
44
- "$value": "{badge.medium.fontSize}/3"
45
- },
46
- "gap": {
47
- "$type": "spacing",
48
- "$value": "{badge.medium.fontSize}/3"
49
- },
50
- "verticalPadding": {
51
- "$type": "spacing",
52
- "$value": "{badge.medium.fontSize}/3"
53
- },
54
- "borderRadius": {
55
- "$type": "borderRadius",
56
- "$value": "{badge.medium.fontSize}/3"
57
- },
58
- "iconSize": {
59
- "$type": "sizing",
60
- "$value": "{badge.medium.fontSize}*1.4"
61
- },
62
- "height": {
63
- "$type": "sizing",
64
- "$value": "{badge.medium.fontSize}*2.1"
65
- },
66
- "fontSize": {
67
- "$type": "fontSizes",
68
- "$value": "{core.fontSize.13}* {scale.text}"
69
- }
70
- },
71
- "default": {
72
- "backgroundColor": {
73
- "$type": "color",
74
- "$value": "{base.color.ui.fade4}"
75
- },
76
- "iconColor": {
77
- "$type": "color",
78
- "$value": "{base.color.primary.default}"
79
- }
80
- },
81
- "highlight": {
82
- "backgroundColor": {
83
- "$type": "color",
84
- "$value": "{base.color.primary.darker}"
85
- },
86
- "iconColor": {
87
- "$type": "color",
88
- "$value": "{base.color.ui.white}"
89
- }
90
- }
91
- }
92
- }
package/tokens/components/tv-button-list.json DELETED
@@ -1,50 +0,0 @@
1
- {
2
- "tvButtonList": {
3
- "inactive": {
4
- "backgroundColor": {
5
- "$type": "color",
6
- "$value": "transparent"
7
- },
8
- "textColor": {
9
- "$type": "color",
10
- "$value": "{core.color.lightAlpha.70}"
11
- },
12
- "iconColor": {
13
- "$type": "color",
14
- "$value": "{core.color.lightAlpha.70}"
15
- }
16
- },
17
- "selected": {
18
- "backgroundColor": {
19
- "$type": "color",
20
- "$value": "{base.colorSet.interaction.normal}"
21
- },
22
- "textColor": {
23
- "$type": "color",
24
- "$value": "{base.colorSet.interaction.onNormal}"
25
- },
26
- "iconColor": {
27
- "$type": "color",
28
- "$value": "{base.colorSet.interaction.onNormal}"
29
- }
30
- },
31
- "active": {
32
- "backgroundColor": {
33
- "$type": "color",
34
- "$value": "{core.color.softAlpha.50}"
35
- },
36
- "textColor": {
37
- "$type": "color",
38
- "$value": "{base.color.text.default}"
39
- },
40
- "iconColor": {
41
- "$type": "color",
42
- "$value": "{base.color.text.default}"
43
- }
44
- },
45
- "gap": {
46
- "$type": "spacing",
47
- "$value": "{base.ui.spacing.fixed.sp4}"
48
- }
49
- }
50
- }