@depersgroep/lfvp-design-tokens 0.390.0 → 0.391.0-7107fa9

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/package.json +1 -1
  2. package/tokens/$metadata.json +2 -2
  3. package/tokens/base/ui.json +4 -0
  4. package/tokens/brands/rtlplay.json +20 -0
  5. package/tokens/brands/streamz.json +20 -0
  6. package/tokens/brands/vtmgo.json +20 -0
  7. package/tokens/brands/whitelabel.json +20 -0
  8. package/tokens/components/box.json +20 -0
  9. package/tokens/components/message.json +108 -16
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@depersgroep/lfvp-design-tokens",
3
- "version": "0.390.0",
3
+ "version": "0.391.0-7107fa9",
4
4
  "description": "Figma design tokens for LFVP",
5
5
  "keywords": [
6
6
  "design",
package/tokens/$metadata.json CHANGED
@@ -32,6 +32,7 @@
32
32
  "components/player",
33
33
  "components/pricing-table",
34
34
  "components/product-card",
35
+ "components/rating",
35
36
  "components/selectable-box",
36
37
  "components/selectable-button",
37
38
  "components/selectable",
@@ -46,9 +47,8 @@
46
47
  "components/top-of-screen",
47
48
  "components/tv-button-list",
48
49
  "components/tv-hero",
49
- "components/rating",
50
- "components/wallet",
51
50
  "components/upsell",
51
+ "components/wallet",
52
52
  "screen/large",
53
53
  "screen/medium",
54
54
  "screen/small",
package/tokens/base/ui.json CHANGED
@@ -152,6 +152,10 @@
152
152
  "bw3": {
153
153
  "$type": "borderWidth",
154
154
  "$value": "{core.borderWidth.3} * {scale.border}"
155
+ },
156
+ "bw4": {
157
+ "$type": "borderWidth",
158
+ "$value": "{core.borderWidth.4}*{scale.border}"
155
159
  }
156
160
  },
157
161
  "fixed": {
package/tokens/brands/rtlplay.json CHANGED
@@ -285,6 +285,26 @@
285
285
  "$type": "color",
286
286
  "$value": "#ffffff"
287
287
  }
288
+ },
289
+ "positive": {
290
+ "20": {
291
+ "$type": "color",
292
+ "$value": "#1B3327"
293
+ },
294
+ "50": {
295
+ "$type": "color",
296
+ "$value": "#44CE87"
297
+ }
298
+ },
299
+ "negative": {
300
+ "20": {
301
+ "$type": "color",
302
+ "$value": "#330001"
303
+ },
304
+ "50": {
305
+ "$type": "color",
306
+ "$value": "#E42454"
307
+ }
288
308
  }
289
309
  }
290
310
  },
package/tokens/brands/streamz.json CHANGED
@@ -285,6 +285,26 @@
285
285
  "$type": "color",
286
286
  "$value": "#4B0B70"
287
287
  }
288
+ },
289
+ "positive": {
290
+ "20": {
291
+ "$type": "color",
292
+ "$value": "#1B3327"
293
+ },
294
+ "50": {
295
+ "$type": "color",
296
+ "$value": "#44CE87"
297
+ }
298
+ },
299
+ "negative": {
300
+ "20": {
301
+ "$type": "color",
302
+ "$value": "#330001"
303
+ },
304
+ "50": {
305
+ "$type": "color",
306
+ "$value": "#E42454"
307
+ }
288
308
  }
289
309
  }
290
310
  },
package/tokens/brands/vtmgo.json CHANGED
@@ -285,6 +285,26 @@
285
285
  "$type": "color",
286
286
  "$value": "#4B0B70"
287
287
  }
288
+ },
289
+ "positive": {
290
+ "20": {
291
+ "$type": "color",
292
+ "$value": "#1B3327"
293
+ },
294
+ "50": {
295
+ "$type": "color",
296
+ "$value": "#44CE87"
297
+ }
298
+ },
299
+ "negative": {
300
+ "20": {
301
+ "$type": "color",
302
+ "$value": "#330001"
303
+ },
304
+ "50": {
305
+ "$type": "color",
306
+ "$value": "#E42454"
307
+ }
288
308
  }
289
309
  }
290
310
  },
package/tokens/brands/whitelabel.json CHANGED
@@ -285,6 +285,26 @@
285
285
  "$type": "color",
286
286
  "$value": "#ffffff"
287
287
  }
288
+ },
289
+ "positive": {
290
+ "20": {
291
+ "$type": "color",
292
+ "$value": "#1B3327"
293
+ },
294
+ "50": {
295
+ "$type": "color",
296
+ "$value": "#44CE87"
297
+ }
298
+ },
299
+ "negative": {
300
+ "20": {
301
+ "$type": "color",
302
+ "$value": "#330001"
303
+ },
304
+ "50": {
305
+ "$type": "color",
306
+ "$value": "#E42454"
307
+ }
288
308
  }
289
309
  }
290
310
  },
package/tokens/components/box.json CHANGED
@@ -45,6 +45,16 @@
45
45
  "$type": "spacing",
46
46
  "$value": "{core.spacing.12}"
47
47
  }
48
+ },
49
+ "large": {
50
+ "horizontalPadding": {
51
+ "$type": "spacing",
52
+ "$value": "{core.spacing.32}"
53
+ },
54
+ "verticalPadding": {
55
+ "$type": "spacing",
56
+ "$value": "{core.spacing.32}"
57
+ }
48
58
  }
49
59
  },
50
60
  "boxHeading": {
@@ -75,6 +85,16 @@
75
85
  "text": {
76
86
  "$type": "typography",
77
87
  "$value": "{base.typography.text.bold.small}"
88
+ },
89
+ "subtle": {
90
+ "backgroundColor": {
91
+ "$type": "color",
92
+ "$value": "{base.color.ui.dark4}"
93
+ },
94
+ "textColor": {
95
+ "$type": "color",
96
+ "$value": "{base.color.text.default}"
97
+ }
78
98
  }
79
99
  }
80
100
  }
package/tokens/components/message.json CHANGED
@@ -1,20 +1,112 @@
1
1
  {
2
2
  "message": {
3
- "backgroundColor": {
4
- "$type": "color",
5
- "$value": "{base.color.primary.darkest}"
6
- },
7
- "textColor": {
8
- "$type": "color",
9
- "$value": "{base.color.text.default}"
3
+ "toast": {
4
+ "backgroundColor": {
5
+ "$type": "color",
6
+ "$value": "{base.color.primary.darkest}"
7
+ },
8
+ "borderColor": {
9
+ "$type": "color",
10
+ "$value": "{base.color.primary.default}"
11
+ },
12
+ "iconColor": {
13
+ "$type": "color",
14
+ "$value": "{base.color.ui.white}"
15
+ },
16
+ "textColor": {
17
+ "$type": "color",
18
+ "$value": "{base.color.text.default}"
19
+ },
20
+ "margin": {
21
+ "$type": "spacing",
22
+ "$value": "{base.ui.spacing.fixed.sp2}"
23
+ },
24
+ "text": {
25
+ "$type": "typography",
26
+ "$value": "{base.typography.text.bold.small}"
27
+ }
10
28
  },
11
29
  "borderRadius": {
12
30
  "$type": "borderRadius",
13
31
  "$value": "{base.ui.borderRadius.flex.br2}"
14
32
  },
15
- "text": {
16
- "$type": "typography",
17
- "$value": "{base.typography.text.regular.medium}"
33
+ "inline": {
34
+ "text": {
35
+ "$type": "typography",
36
+ "$value": "{base.typography.text.regular.small}"
37
+ },
38
+ "branded": {
39
+ "backgroundColor": {
40
+ "$type": "color",
41
+ "$value": "{core.color.primary.10}"
42
+ },
43
+ "borderColor": {
44
+ "$type": "color",
45
+ "$value": "{base.color.primary.default}"
46
+ },
47
+ "iconColor": {
48
+ "$type": "color",
49
+ "$value": "{base.color.primary.default}"
50
+ },
51
+ "textColor": {
52
+ "$type": "color",
53
+ "$value": "{base.color.text.default}"
54
+ }
55
+ },
56
+ "neutral": {
57
+ "backgroundColor": {
58
+ "$type": "color",
59
+ "$value": "{core.color.neutrals.15}"
60
+ },
61
+ "borderColor": {
62
+ "$type": "color",
63
+ "$value": "{core.color.neutrals.60}"
64
+ },
65
+ "iconColor": {
66
+ "$type": "color",
67
+ "$value": "{core.color.neutrals.60}"
68
+ },
69
+ "textColor": {
70
+ "$type": "color",
71
+ "$value": "{base.color.text.default}"
72
+ }
73
+ },
74
+ "positive": {
75
+ "backgroundColor": {
76
+ "$type": "color",
77
+ "$value": "{core.color.positive.20}"
78
+ },
79
+ "borderColor": {
80
+ "$type": "color",
81
+ "$value": "{core.color.positive.50}"
82
+ },
83
+ "iconColor": {
84
+ "$type": "color",
85
+ "$value": "{core.color.positive.50}"
86
+ },
87
+ "textColor": {
88
+ "$type": "color",
89
+ "$value": "{base.color.text.default}"
90
+ }
91
+ },
92
+ "negative": {
93
+ "backgroundColor": {
94
+ "$type": "color",
95
+ "$value": "{core.color.negative.20}"
96
+ },
97
+ "borderColor": {
98
+ "$type": "color",
99
+ "$value": "{core.color.negative.50}"
100
+ },
101
+ "iconColor": {
102
+ "$type": "color",
103
+ "$value": "{core.color.negative.50}"
104
+ },
105
+ "textColor": {
106
+ "$type": "color",
107
+ "$value": "{base.color.text.default}"
108
+ }
109
+ }
18
110
  },
19
111
  "iconSize": {
20
112
  "$type": "sizing",
@@ -22,23 +114,23 @@
22
114
  },
23
115
  "horizontalPadding": {
24
116
  "$type": "spacing",
25
- "$value": "{base.ui.spacing.flex.sp4}"
117
+ "$value": "{base.ui.spacing.flex.sp3}"
26
118
  },
27
119
  "gap": {
28
120
  "$type": "spacing",
29
- "$value": "{base.ui.spacing.flex.sp4}"
121
+ "$value": "{base.ui.spacing.flex.sp2}"
30
122
  },
31
123
  "verticalPadding": {
32
124
  "$type": "spacing",
33
125
  "$value": "{base.ui.spacing.flex.sp2}"
34
126
  },
35
- "margin": {
36
- "$type": "spacing",
37
- "$value": "{base.ui.spacing.fixed.sp2}"
38
- },
39
127
  "maxWidth": {
40
128
  "$type": "sizing",
41
129
  "$value": "100%"
130
+ },
131
+ "borderWidth": {
132
+ "$type": "borderWidth",
133
+ "$value": "{base.ui.borderWidth.flex.bw4}"
42
134
  }
43
135
  }
44
136
  }