@depersgroep/lfvp-design-tokens 0.372.0-f15715b → 0.374.0-dd5cdf3
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.
- package/assets/icons/rtlplay/reminder.svg +3 -0
- package/assets/icons/rtlplay/shoppingBag.svg +3 -0
- package/assets/icons/streamz/reminder.svg +4 -0
- package/assets/icons/streamz/shoppingBag.svg +3 -0
- package/assets/icons/vtmgo/reminder.svg +4 -0
- package/assets/icons/vtmgo/shoppingBag.svg +3 -0
- package/package.json +1 -1
- package/tokens/components/detail-header.json +20 -7
- package/tokens/components/tv-button-list.json +103 -39
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<path d="M12 2C11.172 2 10.5 2.672 10.5 3.5V4.19531C7.91318 4.86209 6 7.2048 6 10V16L4 18V19H20V18L18 16V10C18 7.2048 16.0868 4.86209 13.5 4.19531V3.5C13.5 2.672 12.828 2 12 2ZM10 20C10 21.1 10.9 22 12 22C13.1 22 14 21.1 14 20H10Z" fill="white"/>
|
|
3
|
+
</svg>
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<path d="M10 2C8.90694 2 8 2.90694 8 4V6H3V19C3 20.105 3.895 21 5 21H19C20.105 21 21 20.105 21 19V6H16V4C16 2.90694 15.0931 2 14 2H10ZM10 4H14V6H10V4ZM9 8C9.552 8 10 8.448 10 9C10 9.552 9.552 10 9 10C8.448 10 8 9.552 8 9C8 8.448 8.448 8 9 8ZM15 8C15.552 8 16 8.448 16 9C16 9.552 15.552 10 15 10C14.448 10 14 9.552 14 9C14 8.448 14.448 8 15 8Z" fill="white"/>
|
|
3
|
+
</svg>
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<path d="M19 8C19 11.3527 19.7171 13.435 20.3779 14.6465C20.7097 15.2546 21.0324 15.6538 21.2568 15.8906C21.3693 16.0093 21.4585 16.0875 21.5117 16.1318C21.5383 16.154 21.5558 16.1681 21.5635 16.1738L21.5596 16.1709L21.5557 16.1689C21.9215 16.4136 22.0846 16.8687 21.957 17.29C21.8293 17.7117 21.4406 18 21 18H3C2.55942 18 2.17075 17.7117 2.04297 17.29C1.9154 16.8687 2.07847 16.4136 2.44434 16.1689L2.44043 16.1709L2.43653 16.1738C2.44422 16.1681 2.46172 16.154 2.48828 16.1318C2.5415 16.0875 2.63069 16.0093 2.74317 15.8906C2.96756 15.6538 3.29036 15.2546 3.62207 14.6465C4.2829 13.435 5 11.3527 5 8C5 6.14348 5.73705 4.36256 7.04981 3.0498C8.36256 1.73705 10.1435 1 12 1C13.8565 1 15.6374 1.73705 16.9502 3.0498C18.263 4.36256 19 6.14349 19 8Z" fill="white"/>
|
|
3
|
+
<path d="M12.8647 20.498C13.1419 20.0203 13.7542 19.8576 14.2319 20.1348C14.7096 20.4119 14.8723 21.0242 14.5952 21.502C14.3315 21.9564 13.9528 22.3334 13.4975 22.5957C13.0423 22.8579 12.5259 22.996 12.0005 22.9961C11.4749 22.9961 10.9579 22.858 10.5024 22.5957C10.1042 22.3662 9.76451 22.0491 9.50926 21.6689L9.40477 21.502L9.35789 21.4111C9.14902 20.9492 9.32014 20.3946 9.76805 20.1348C10.2159 19.875 10.7823 20.0016 11.0796 20.4121L11.1352 20.498L11.2075 20.6064C11.2872 20.71 11.3865 20.7976 11.5005 20.8633C11.6523 20.9507 11.8253 20.9961 12.0005 20.9961C12.1755 20.996 12.3478 20.9506 12.4995 20.8633C12.6512 20.7758 12.7769 20.6495 12.8647 20.498Z" fill="white"/>
|
|
4
|
+
</svg>
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<path fill-rule="evenodd" clip-rule="evenodd" d="M12 1C13.3261 1 14.5975 1.52716 15.5352 2.46484C16.2335 3.16319 16.7037 4.04672 16.8984 5H21C21.5523 5 22 5.44772 22 6V20C22 20.7957 21.6837 21.5585 21.1211 22.1211C20.5585 22.6837 19.7957 23 19 23H5C4.20435 23 3.44151 22.6837 2.87891 22.1211C2.3163 21.5585 2 20.7957 2 20V6C2 5.44772 2.44772 5 3 5H7.10156C7.29632 4.04672 7.7665 3.16319 8.46484 2.46484C9.3439 1.58579 10.5162 1.06719 11.752 1.00586L12 1ZM15.75 9C15.0596 9 14.5 9.53745 14.5 10.2002C14.4999 10.8366 14.2362 11.4465 13.7676 11.8965C13.3573 12.2903 12.8194 12.5333 12.2471 12.5879L12 12.5996C11.337 12.5996 10.7013 12.3466 10.2324 11.8965C9.76375 11.4465 9.50005 10.8366 9.5 10.2002C9.5 9.53745 8.94036 9 8.25 9C7.55964 9 7 9.53745 7 10.2002C7.00005 11.4732 7.52721 12.6936 8.46484 13.5938C9.40253 14.4939 10.6739 15 12 15L12.248 14.9941C13.4838 14.9353 14.6561 14.4376 15.5352 13.5938C16.4728 12.6936 16.9999 11.4732 17 10.2002C17 9.53745 16.4404 9 15.75 9ZM11.7031 3.01465C11.0165 3.08291 10.3711 3.38671 9.87891 3.87891C9.55985 4.19796 9.32364 4.58269 9.17578 5H14.8242C14.6764 4.58269 14.4401 4.19796 14.1211 3.87891C13.5585 3.3163 12.7956 3 12 3L11.7031 3.01465Z" fill="white"/>
|
|
3
|
+
</svg>
|
|
@@ -0,0 +1,4 @@
|
|
|
1
|
+
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<path d="M18.7803 12.1006L21.5889 17H2.41113L5.21973 12.1006V8.75C5.21973 5.01401 8.26356 2 12 2C15.7364 2.00007 18.7803 5.01405 18.7803 8.75V12.1006Z" fill="white"/>
|
|
3
|
+
<path d="M13.5091 19V22H10.4916V19H13.5091Z" fill="white"/>
|
|
4
|
+
</svg>
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
2
|
+
<path fill-rule="evenodd" clip-rule="evenodd" d="M18.3643 8.08696C18.3643 4.72522 15.6391 2 12.2773 2C8.91561 2 6.19039 4.72522 6.19039 8.08696L9.08894 8.08696L5.31884 8.08696C4.03818 8.08696 3 9.12514 3 10.4058V19.6812C3 20.9618 4.03818 22 5.31884 22H19.2358C20.5165 22 21.5547 20.9618 21.5547 19.6812V10.4058C21.5547 9.12514 20.5165 8.08696 19.2358 8.08696H18.3643ZM12.2773 4.89855C14.0382 4.89855 15.4657 6.32605 15.4657 8.08696L9.08894 8.08696C9.08894 6.32605 10.5164 4.89855 12.2773 4.89855ZM9.08894 10.4058C9.08894 12.1667 10.5164 13.5942 12.2773 13.5942C14.0382 13.5942 15.4657 12.1667 15.4657 10.4058H18.3643C18.3643 13.7675 15.6391 16.4928 12.2773 16.4928C8.91561 16.4928 6.19039 13.7675 6.19039 10.4058H9.08894Z" fill="white"/>
|
|
3
|
+
</svg>
|
package/package.json
CHANGED
|
@@ -1,12 +1,25 @@
|
|
|
1
1
|
{
|
|
2
2
|
"detailHeader": {
|
|
3
|
-
"
|
|
4
|
-
"
|
|
5
|
-
|
|
6
|
-
"
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
3
|
+
"level1": {
|
|
4
|
+
"title": {
|
|
5
|
+
"$type": "typography",
|
|
6
|
+
"$value": {
|
|
7
|
+
"fontFamily": "{base.heroFont}",
|
|
8
|
+
"fontWeight": "{base.fontWeight.title}",
|
|
9
|
+
"lineHeight": "{core.lineHeight.120}",
|
|
10
|
+
"fontSize": "{core.fontSize.24}*{scale.title}"
|
|
11
|
+
}
|
|
12
|
+
}
|
|
13
|
+
},
|
|
14
|
+
"level2": {
|
|
15
|
+
"title": {
|
|
16
|
+
"$type": "typography",
|
|
17
|
+
"$value": {
|
|
18
|
+
"fontFamily": "{base.heroFont}",
|
|
19
|
+
"fontWeight": "{base.fontWeight.title}",
|
|
20
|
+
"lineHeight": "{core.lineHeight.120}",
|
|
21
|
+
"fontSize": "{core.fontSize.20} *{scale.title}"
|
|
22
|
+
}
|
|
10
23
|
}
|
|
11
24
|
}
|
|
12
25
|
}
|
|
@@ -1,50 +1,114 @@
|
|
|
1
1
|
{
|
|
2
2
|
"tvButtonList": {
|
|
3
|
-
"
|
|
4
|
-
"
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
3
|
+
"gap": {
|
|
4
|
+
"$type": "spacing",
|
|
5
|
+
"$value": "{base.ui.spacing.fixed.sp4}"
|
|
6
|
+
}
|
|
7
|
+
},
|
|
8
|
+
"tvSelectableButtonList": {
|
|
9
|
+
"unselected": {
|
|
10
|
+
"normal": {
|
|
11
|
+
"backgroundColor": {
|
|
12
|
+
"$type": "color",
|
|
13
|
+
"$value": "transparent"
|
|
14
|
+
},
|
|
15
|
+
"textColor": {
|
|
16
|
+
"$type": "color",
|
|
17
|
+
"$value": "{core.color.lightAlpha.70}"
|
|
18
|
+
}
|
|
19
|
+
},
|
|
20
|
+
"hover": {
|
|
21
|
+
"backgroundColor": {
|
|
22
|
+
"$type": "color",
|
|
23
|
+
"$value": "{base.colorSet.interaction.normal}"
|
|
24
|
+
},
|
|
25
|
+
"textColor": {
|
|
26
|
+
"$type": "color",
|
|
27
|
+
"$value": "{base.colorSet.interaction.onNormal}"
|
|
28
|
+
}
|
|
29
|
+
},
|
|
30
|
+
"active": {
|
|
31
|
+
"backgroundColor": {
|
|
32
|
+
"$type": "color",
|
|
33
|
+
"$value": "{base.colorSet.interaction.normal}"
|
|
34
|
+
},
|
|
35
|
+
"textColor": {
|
|
36
|
+
"$type": "color",
|
|
37
|
+
"$value": "{base.colorSet.interaction.onNormal}"
|
|
38
|
+
}
|
|
39
|
+
},
|
|
40
|
+
"disabled": {
|
|
41
|
+
"backgroundColor": {
|
|
42
|
+
"$type": "color",
|
|
43
|
+
"$value": "transparent"
|
|
44
|
+
},
|
|
45
|
+
"textColor": {
|
|
46
|
+
"$type": "color",
|
|
47
|
+
"$value": "{core.color.lightAlpha.40}"
|
|
48
|
+
}
|
|
49
|
+
},
|
|
50
|
+
"focus": {
|
|
51
|
+
"backgroundColor": {
|
|
52
|
+
"$type": "color",
|
|
53
|
+
"$value": "{base.colorSet.interaction.normal}"
|
|
54
|
+
},
|
|
55
|
+
"textColor": {
|
|
56
|
+
"$type": "color",
|
|
57
|
+
"$value": "{base.colorSet.interaction.onNormal}"
|
|
58
|
+
}
|
|
15
59
|
}
|
|
16
60
|
},
|
|
17
61
|
"selected": {
|
|
18
|
-
"
|
|
19
|
-
"
|
|
20
|
-
|
|
62
|
+
"normal": {
|
|
63
|
+
"backgroundColor": {
|
|
64
|
+
"$type": "color",
|
|
65
|
+
"$value": "{core.color.softAlpha.50}"
|
|
66
|
+
},
|
|
67
|
+
"textColor": {
|
|
68
|
+
"$type": "color",
|
|
69
|
+
"$value": "{base.color.text.default}"
|
|
70
|
+
}
|
|
21
71
|
},
|
|
22
|
-
"
|
|
23
|
-
"
|
|
24
|
-
|
|
72
|
+
"hover": {
|
|
73
|
+
"backgroundColor": {
|
|
74
|
+
"$type": "color",
|
|
75
|
+
"$value": "{base.colorSet.interaction.normal}"
|
|
76
|
+
},
|
|
77
|
+
"textColor": {
|
|
78
|
+
"$type": "color",
|
|
79
|
+
"$value": "{base.colorSet.interaction.onNormal}"
|
|
80
|
+
}
|
|
25
81
|
},
|
|
26
|
-
"
|
|
27
|
-
"
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
},
|
|
36
|
-
"
|
|
37
|
-
"
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
"
|
|
42
|
-
|
|
82
|
+
"active": {
|
|
83
|
+
"backgroundColor": {
|
|
84
|
+
"$type": "color",
|
|
85
|
+
"$value": "{base.colorSet.interaction.normal}"
|
|
86
|
+
},
|
|
87
|
+
"textColor": {
|
|
88
|
+
"$type": "color",
|
|
89
|
+
"$value": "{base.colorSet.interaction.onNormal}"
|
|
90
|
+
}
|
|
91
|
+
},
|
|
92
|
+
"disabled": {
|
|
93
|
+
"backgroundColor": {
|
|
94
|
+
"$type": "color",
|
|
95
|
+
"$value": "transparent"
|
|
96
|
+
},
|
|
97
|
+
"iconColor": {
|
|
98
|
+
"$type": "color",
|
|
99
|
+
"$value": "{core.color.lightAlpha.40}"
|
|
100
|
+
}
|
|
101
|
+
},
|
|
102
|
+
"focus": {
|
|
103
|
+
"backgroundColor": {
|
|
104
|
+
"$type": "color",
|
|
105
|
+
"$value": "{base.colorSet.interaction.normal}"
|
|
106
|
+
},
|
|
107
|
+
"textColor": {
|
|
108
|
+
"$type": "color",
|
|
109
|
+
"$value": "{base.colorSet.interaction.onNormal}"
|
|
110
|
+
}
|
|
43
111
|
}
|
|
44
|
-
},
|
|
45
|
-
"gap": {
|
|
46
|
-
"$type": "spacing",
|
|
47
|
-
"$value": "{base.ui.spacing.fixed.sp4}"
|
|
48
112
|
}
|
|
49
113
|
}
|
|
50
114
|
}
|