Skip to content

Commit 2a03dca

Browse files
jeffreylauwersjeffreylauwers
authored
style: action tokens den haag community components (#1329)
De volgende tokens zijn toegevoegd aan de Task Card en Task Navigation componenten: - `denhaag.action.context.gap` - `denhaag.action.context.lg.gap` - `denhaag.action.actions.gap` Token `denhaag.action.border-style` is aangevuld met description `[code-only]`. De volgende tokens zijn hernoemd: - `denhaag.action.link.icon.color` naar `denhaag.action.link-icon.color` - `denhaag.action.link.icon.width` naar `denhaag.action.link-icon.width` - `denhaag.action.warning.icon.color` naar `denhaag.action.warning-icon.color` - `denhaag.action.warning.icon.width` naar `denhaag.action.warning-icon.width` De volgende tokens zijn verwijderd: - `denhaag.action.font-familiy` - `denhaag.action.font-size` - `denhaag.action.font-weight` - `denhaag.action.line-height` De waarde van de volgende tokens zijn gewijzigd: - Waarde van token `denhaag.action.date.gap` is gewijzigd van `{basis.space.row.md}` naar `{basis.space.column.md}`. - Waarde van token `denhaag.action.date.warning.gap` is gewijzigd van `{basis.space.row.md}` naar `{basis.space.column.md}`. - Waarde van token `denhaag.action.single.details.gap` is gewijzigd van `{basis.space.row.md}` naar `{basis.space.column.md}`. - Waarde van token `denhaag.action.single.details.lg.gap` is gewijzigd van `{basis.space.row.md}` naar `{basis.space.column.xl}`. Controleer of deze wijziging ook wenselijk is voor het thema van jouw organisatie. Zo niet, dan hoef je deze niet over te nemen.
1 parent a11bb97 commit 2a03dca

File tree

3 files changed

+131
-98
lines changed

3 files changed

+131
-98
lines changed

‎.changeset/denhaag-action-tokens.md‎

Lines changed: 35 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,35 @@
1+
---
2+
"@nl-design-system-unstable/start-design-tokens": major
3+
"@nl-design-system-unstable/voorbeeld-design-tokens": major
4+
---
5+
6+
De volgende tokens zijn toegevoegd aan de Task Card en Task Navigation componenten:
7+
8+
- `denhaag.action.context.gap`
9+
- `denhaag.action.context.lg.gap`
10+
- `denhaag.action.actions.gap`
11+
12+
Token `denhaag.action.border-style` is aangevuld met description `[code-only]`.
13+
14+
De volgende tokens zijn hernoemd:
15+
16+
- `denhaag.action.link.icon.color` naar `denhaag.action.link-icon.color`
17+
- `denhaag.action.link.icon.width` naar `denhaag.action.link-icon.width`
18+
- `denhaag.action.warning.icon.color` naar `denhaag.action.warning-icon.color`
19+
- `denhaag.action.warning.icon.width` naar `denhaag.action.warning-icon.width`
20+
21+
De volgende tokens zijn verwijderd:
22+
23+
- `denhaag.action.font-familiy`
24+
- `denhaag.action.font-size`
25+
- `denhaag.action.font-weight`
26+
- `denhaag.action.line-height`
27+
28+
De waarde van de volgende tokens zijn gewijzigd:
29+
30+
- Waarde van token `denhaag.action.date.gap` is gewijzigd van `{basis.space.row.md}` naar `{basis.space.column.md}`.
31+
- Waarde van token `denhaag.action.date.warning.gap` is gewijzigd van `{basis.space.row.md}` naar `{basis.space.column.md}`.
32+
- Waarde van token `denhaag.action.single.details.gap` is gewijzigd van `{basis.space.row.md}` naar `{basis.space.column.md}`.
33+
- Waarde van token `denhaag.action.single.details.lg.gap` is gewijzigd van `{basis.space.row.md}` naar `{basis.space.column.xl}`.
34+
35+
Controleer of deze wijziging ook wenselijk is voor het thema van jouw organisatie. Zo niet, dan hoef je deze niet over te nemen.

‎packages/start-design-tokens/figma/start.tokens.json‎

Lines changed: 48 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -12309,7 +12309,8 @@
1230912309
},
1231012310
"border-style": {
1231112311
"$type": "other",
12312-
"$value": "solid"
12312+
"$value": "solid",
12313+
"$description": "[code-only]"
1231312314
},
1231412315
"border-width": {
1231512316
"$type": "dimension",
@@ -12319,26 +12320,10 @@
1231912320
"$type": "color",
1232012321
"$value": "{basis.color.default.color-document}"
1232112322
},
12322-
"font-familiy": {
12323-
"$type": "fontFamilies",
12324-
"$value": "{basis.text.font-family.default}"
12325-
},
12326-
"font-size": {
12327-
"$type": "fontSizes",
12328-
"$value": "{basis.text.font-size.md}"
12329-
},
12330-
"font-weight": {
12331-
"$type": "fontWeights",
12332-
"$value": "{basis.text.font-weight.bold}"
12333-
},
1233412323
"gap": {
1233512324
"$type": "dimension",
1233612325
"$value": "{basis.space.row.md}"
1233712326
},
12338-
"line-height": {
12339-
"$type": "lineHeights",
12340-
"$value": "{basis.text.line-height.md}"
12341-
},
1234212327
"padding-block-end": {
1234312328
"$type": "dimension",
1234412329
"$value": "{basis.space.block.xl}"
@@ -12369,6 +12354,32 @@
1236912354
"$value": "{basis.space.block.xl}"
1237012355
}
1237112356
},
12357+
"actions": {
12358+
"gap": {
12359+
"$type": "dimension",
12360+
"$value": "{basis.space.row.md}"
12361+
}
12362+
},
12363+
"content": {
12364+
"bold": {
12365+
"font-weight": {
12366+
"$type": "fontWeights",
12367+
"$value": "{basis.text.font-weight.bold}"
12368+
}
12369+
}
12370+
},
12371+
"context": {
12372+
"gap": {
12373+
"$type": "dimension",
12374+
"$value": "{basis.space.row.md}"
12375+
},
12376+
"lg": {
12377+
"gap": {
12378+
"$type": "dimension",
12379+
"$value": "{basis.space.column.xl}"
12380+
}
12381+
}
12382+
},
1237212383
"date": {
1237312384
"color": {
1237412385
"$type": "color",
@@ -12380,7 +12391,7 @@
1238012391
},
1238112392
"gap": {
1238212393
"$type": "dimension",
12383-
"$value": "{basis.space.row.md}"
12394+
"$value": "{basis.space.column.md}"
1238412395
},
1238512396
"warning": {
1238612397
"color": {
@@ -12393,15 +12404,7 @@
1239312404
},
1239412405
"gap": {
1239512406
"$type": "dimension",
12396-
"$value": "{basis.space.row.md}"
12397-
}
12398-
}
12399-
},
12400-
"content": {
12401-
"bold": {
12402-
"font-weight": {
12403-
"$type": "fontWeights",
12404-
"$value": "{basis.text.font-weight.bold}"
12407+
"$value": "{basis.space.column.md}"
1240512408
}
1240612409
}
1240712410
},
@@ -12417,28 +12420,24 @@
1241712420
}
1241812421
}
1241912422
},
12420-
"link": {
12421-
"icon": {
12422-
"color": {
12423-
"$type": "color",
12424-
"$value": "{basis.color.action-2.color-default}"
12425-
},
12426-
"width": {
12427-
"$type": "dimension",
12428-
"$value": "{basis.size.icon.md}"
12429-
}
12423+
"link-icon": {
12424+
"color": {
12425+
"$type": "color",
12426+
"$value": "{basis.color.action-2.color-default}"
12427+
},
12428+
"width": {
12429+
"$type": "dimension",
12430+
"$value": "{basis.size.icon.md}"
1243012431
}
1243112432
},
12432-
"warning": {
12433-
"icon": {
12434-
"color": {
12435-
"$type": "color",
12436-
"$value": "{basis.color.negative.color-default}"
12437-
},
12438-
"width": {
12439-
"$type": "dimension",
12440-
"$value": "{basis.size.icon.md}"
12441-
}
12433+
"warning-icon": {
12434+
"color": {
12435+
"$type": "color",
12436+
"$value": "{basis.color.negative.color-default}"
12437+
},
12438+
"width": {
12439+
"$type": "dimension",
12440+
"$value": "{basis.size.icon.md}"
1244212441
}
1244312442
}
1244412443
}
@@ -12527,12 +12526,12 @@
1252712526
"details": {
1252812527
"gap": {
1252912528
"$type": "dimension",
12530-
"$value": "{basis.space.row.md}"
12529+
"$value": "{basis.space.column.md}"
1253112530
},
1253212531
"lg": {
1253312532
"gap": {
1253412533
"$type": "dimension",
12535-
"$value": "{basis.space.row.md}"
12534+
"$value": "{basis.space.column.xl}"
1253612535
}
1253712536
}
1253812537
}

‎packages/voorbeeld-design-tokens/figma/voorbeeld.tokens.json‎

Lines changed: 48 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -12556,7 +12556,8 @@
1255612556
},
1255712557
"border-style": {
1255812558
"$type": "other",
12559-
"$value": "solid"
12559+
"$value": "solid",
12560+
"$description": "[code-only]"
1256012561
},
1256112562
"border-width": {
1256212563
"$type": "dimension",
@@ -12566,26 +12567,10 @@
1256612567
"$type": "color",
1256712568
"$value": "{basis.color.default.color-document}"
1256812569
},
12569-
"font-familiy": {
12570-
"$type": "fontFamilies",
12571-
"$value": "{basis.text.font-family.default}"
12572-
},
12573-
"font-size": {
12574-
"$type": "fontSizes",
12575-
"$value": "{basis.text.font-size.md}"
12576-
},
12577-
"font-weight": {
12578-
"$type": "fontWeights",
12579-
"$value": "{basis.text.font-weight.bold}"
12580-
},
1258112570
"gap": {
1258212571
"$type": "dimension",
1258312572
"$value": "{basis.space.row.md}"
1258412573
},
12585-
"line-height": {
12586-
"$type": "lineHeights",
12587-
"$value": "{basis.text.line-height.md}"
12588-
},
1258912574
"padding-block-end": {
1259012575
"$type": "dimension",
1259112576
"$value": "{basis.space.block.xl}"
@@ -12616,6 +12601,32 @@
1261612601
"$value": "{basis.space.block.xl}"
1261712602
}
1261812603
},
12604+
"actions": {
12605+
"gap": {
12606+
"$type": "dimension",
12607+
"$value": "{basis.space.row.md}"
12608+
}
12609+
},
12610+
"content": {
12611+
"bold": {
12612+
"font-weight": {
12613+
"$type": "fontWeights",
12614+
"$value": "{basis.text.font-weight.bold}"
12615+
}
12616+
}
12617+
},
12618+
"context": {
12619+
"gap": {
12620+
"$type": "dimension",
12621+
"$value": "{basis.space.row.md}"
12622+
},
12623+
"lg": {
12624+
"gap": {
12625+
"$type": "dimension",
12626+
"$value": "{basis.space.column.xl}"
12627+
}
12628+
}
12629+
},
1261912630
"date": {
1262012631
"color": {
1262112632
"$type": "color",
@@ -12627,7 +12638,7 @@
1262712638
},
1262812639
"gap": {
1262912640
"$type": "dimension",
12630-
"$value": "{basis.space.row.md}"
12641+
"$value": "{basis.space.column.md}"
1263112642
},
1263212643
"warning": {
1263312644
"color": {
@@ -12640,15 +12651,7 @@
1264012651
},
1264112652
"gap": {
1264212653
"$type": "dimension",
12643-
"$value": "{basis.space.row.md}"
12644-
}
12645-
}
12646-
},
12647-
"content": {
12648-
"bold": {
12649-
"font-weight": {
12650-
"$type": "fontWeights",
12651-
"$value": "{basis.text.font-weight.bold}"
12654+
"$value": "{basis.space.column.md}"
1265212655
}
1265312656
}
1265412657
},
@@ -12664,28 +12667,24 @@
1266412667
}
1266512668
}
1266612669
},
12667-
"link": {
12668-
"icon": {
12669-
"color": {
12670-
"$type": "color",
12671-
"$value": "{basis.color.action-2.color-default}"
12672-
},
12673-
"width": {
12674-
"$type": "dimension",
12675-
"$value": "{basis.size.icon.md}"
12676-
}
12670+
"link-icon": {
12671+
"color": {
12672+
"$type": "color",
12673+
"$value": "{basis.color.action-2.color-default}"
12674+
},
12675+
"width": {
12676+
"$type": "dimension",
12677+
"$value": "{basis.size.icon.md}"
1267712678
}
1267812679
},
12679-
"warning": {
12680-
"icon": {
12681-
"color": {
12682-
"$type": "color",
12683-
"$value": "{basis.color.negative.color-default}"
12684-
},
12685-
"width": {
12686-
"$type": "dimension",
12687-
"$value": "{basis.size.icon.md}"
12688-
}
12680+
"warning-icon": {
12681+
"color": {
12682+
"$type": "color",
12683+
"$value": "{basis.color.negative.color-default}"
12684+
},
12685+
"width": {
12686+
"$type": "dimension",
12687+
"$value": "{basis.size.icon.md}"
1268912688
}
1269012689
}
1269112690
}
@@ -12774,12 +12773,12 @@
1277412773
"details": {
1277512774
"gap": {
1277612775
"$type": "dimension",
12777-
"$value": "{basis.space.row.md}"
12776+
"$value": "{basis.space.column.md}"
1277812777
},
1277912778
"lg": {
1278012779
"gap": {
1278112780
"$type": "dimension",
12782-
"$value": "{basis.space.row.md}"
12781+
"$value": "{basis.space.column.xl}"
1278312782
}
1278412783
}
1278512784
}

0 commit comments

Comments
 (0)