Skip to content

Commit f1a6d87

Browse files
RozerinayRozerinay
authored
style: password input tokens amsterdam community component (#1334)
De volgende tokens zijn toegevoegd aan Date Input component: - `ams.password-input.background-color` - `ams.password-input.border-color` - `ams.password-input.border-style` - `ams.password-input.border-width` - `ams.password-input.color` - `ams.password-input.font-family` - `ams.password-input.font-size` - `ams.password-input.font-weight` - `ams.password-input.line-height` - `ams.password-input.outline-offset` - `ams.password-input.padding-block` - `ams.password-input.padding-inline` - `ams.password-input.placeholder.color` - `ams.password-input.disabled.color` - `ams.password-input.disabled.cursor` - `ams.password-input.hover.box-shadow` - `ams.password-input.invalid.border-color` - `ams.password-input.invalid.hover.border-color` - `ams.password-input.invalid.hover.box-shadow`
1 parent be0ba7c commit f1a6d87

File tree

3 files changed

+246
-0
lines changed

3 files changed

+246
-0
lines changed

‎.changeset/ams-password-input.md‎

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
---
2+
"@nl-design-system-unstable/start-design-tokens": minor
3+
"@nl-design-system-unstable/voorbeeld-design-tokens": minor
4+
---
5+
6+
De volgende tokens zijn toegevoegd aan Password Input component:
7+
8+
- `ams.password-input.background-color`
9+
- `ams.password-input.border-color`
10+
- `ams.password-input.border-style`
11+
- `ams.password-input.border-width`
12+
- `ams.password-input.color`
13+
- `ams.password-input.font-family`
14+
- `ams.password-input.font-size`
15+
- `ams.password-input.font-weight`
16+
- `ams.password-input.line-height`
17+
- `ams.password-input.outline-offset`
18+
- `ams.password-input.padding-block`
19+
- `ams.password-input.padding-inline`
20+
- `ams.password-input.placeholder.color`
21+
- `ams.password-input.disabled.color`
22+
- `ams.password-input.disabled.cursor`
23+
- `ams.password-input.hover.box-shadow`
24+
- `ams.password-input.invalid.border-color`
25+
- `ams.password-input.invalid.hover.border-color`
26+
- `ams.password-input.invalid.hover.box-shadow`

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

Lines changed: 110 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9765,6 +9765,115 @@
97659765
}
97669766
}
97679767
},
9768+
"components/password-input": {
9769+
"ams": {
9770+
"password-input": {
9771+
"background-color": {
9772+
"$type": "color",
9773+
"$value": "{basis.form-control.background-color}"
9774+
},
9775+
"border-color": {
9776+
"$type": "color",
9777+
"$value": "{basis.form-control.border-color}"
9778+
},
9779+
"border-style": {
9780+
"$type": "other",
9781+
"$value": "solid",
9782+
"$description": "[code-only]"
9783+
},
9784+
"border-width": {
9785+
"$type": "dimension",
9786+
"$value": "{basis.form-control.border-width}"
9787+
},
9788+
"color": {
9789+
"$type": "color",
9790+
"$value": "{basis.form-control.color}"
9791+
},
9792+
"font-family": {
9793+
"$type": "fontFamilies",
9794+
"$value": "{basis.form-control.font-family}"
9795+
},
9796+
"font-size": {
9797+
"$type": "fontSizes",
9798+
"$value": "{basis.form-control.font-size}"
9799+
},
9800+
"font-weight": {
9801+
"$type": "fontWeights",
9802+
"$value": "{basis.form-control.font-weight}"
9803+
},
9804+
"line-height": {
9805+
"$type": "lineHeights",
9806+
"$value": "{basis.form-control.line-height}"
9807+
},
9808+
"outline-offset": {
9809+
"$type": "other",
9810+
"$value": "auto",
9811+
"$description": "[code-only]"
9812+
},
9813+
"padding-block": {
9814+
"$type": "dimension",
9815+
"$value": "{basis.form-control.padding-block-start}"
9816+
},
9817+
"padding-inline": {
9818+
"$type": "dimension",
9819+
"$value": "{basis.form-control.padding-inline-start}"
9820+
},
9821+
"placeholder": {
9822+
"color": {
9823+
"$type": "color",
9824+
"$value": "{basis.form-control.placeholder.color}"
9825+
}
9826+
},
9827+
"disabled": {
9828+
"color": {
9829+
"$type": "color",
9830+
"$value": "{basis.form-control.disabled.color}"
9831+
},
9832+
"cursor": {
9833+
"$type": "other",
9834+
"$value": "disabled",
9835+
"$description": "[code-only]"
9836+
}
9837+
},
9838+
"hover": {
9839+
"box-shadow": {
9840+
"$type": "boxShadow",
9841+
"$value": {
9842+
"x": "0",
9843+
"y": "0",
9844+
"blur": "0",
9845+
"color": "{basis.form-control.hover.border-color}",
9846+
"spread": "{basis.form-control.hover.border-width}",
9847+
"type": "innerShadow"
9848+
}
9849+
}
9850+
},
9851+
"invalid": {
9852+
"border-color": {
9853+
"$type": "color",
9854+
"$value": "{basis.form-control.invalid.border-color}"
9855+
},
9856+
"hover": {
9857+
"border-color": {
9858+
"$type": "color",
9859+
"$value": "{basis.color.negative.border-hover}"
9860+
},
9861+
"box-shadow": {
9862+
"$type": "boxShadow",
9863+
"$value": {
9864+
"x": "0",
9865+
"y": "0",
9866+
"blur": "0",
9867+
"color": "{basis.color.negative.border-hover}",
9868+
"spread": "{basis.form-control.hover.border-width}",
9869+
"type": "innerShadow"
9870+
}
9871+
}
9872+
}
9873+
}
9874+
}
9875+
}
9876+
},
97689877
"components/pre-heading": {
97699878
"utrecht": {
97709879
"pre-heading": {
@@ -15260,6 +15369,7 @@
1526015369
"components/page-number-navigation/todo",
1526115370
"components/paragraph/nl",
1526215371
"components/paragraph/utrecht",
15372+
"components/password-input",
1526315373
"components/pre-heading",
1526415374
"components/progress-list/den-haag",
1526515375
"components/progress-list/todo",

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

Lines changed: 110 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10012,6 +10012,115 @@
1001210012
}
1001310013
}
1001410014
},
10015+
"components/password-input": {
10016+
"ams": {
10017+
"password-input": {
10018+
"background-color": {
10019+
"$type": "color",
10020+
"$value": "{basis.form-control.background-color}"
10021+
},
10022+
"border-color": {
10023+
"$type": "color",
10024+
"$value": "{basis.form-control.border-color}"
10025+
},
10026+
"border-style": {
10027+
"$type": "other",
10028+
"$value": "solid",
10029+
"$description": "[code-only]"
10030+
},
10031+
"border-width": {
10032+
"$type": "dimension",
10033+
"$value": "{basis.form-control.border-width}"
10034+
},
10035+
"color": {
10036+
"$type": "color",
10037+
"$value": "{basis.form-control.color}"
10038+
},
10039+
"font-family": {
10040+
"$type": "fontFamilies",
10041+
"$value": "{basis.form-control.font-family}"
10042+
},
10043+
"font-size": {
10044+
"$type": "fontSizes",
10045+
"$value": "{basis.form-control.font-size}"
10046+
},
10047+
"font-weight": {
10048+
"$type": "fontWeights",
10049+
"$value": "{basis.form-control.font-weight}"
10050+
},
10051+
"line-height": {
10052+
"$type": "lineHeights",
10053+
"$value": "{basis.form-control.line-height}"
10054+
},
10055+
"outline-offset": {
10056+
"$type": "other",
10057+
"$value": "auto",
10058+
"$description": "[code-only]"
10059+
},
10060+
"padding-block": {
10061+
"$type": "dimension",
10062+
"$value": "{basis.form-control.padding-block-start}"
10063+
},
10064+
"padding-inline": {
10065+
"$type": "dimension",
10066+
"$value": "{basis.form-control.padding-inline-start}"
10067+
},
10068+
"placeholder": {
10069+
"color": {
10070+
"$type": "color",
10071+
"$value": "{basis.form-control.placeholder.color}"
10072+
}
10073+
},
10074+
"disabled": {
10075+
"color": {
10076+
"$type": "color",
10077+
"$value": "{basis.form-control.disabled.color}"
10078+
},
10079+
"cursor": {
10080+
"$type": "other",
10081+
"$value": "disabled",
10082+
"$description": "[code-only]"
10083+
}
10084+
},
10085+
"hover": {
10086+
"box-shadow": {
10087+
"$type": "boxShadow",
10088+
"$value": {
10089+
"x": "0",
10090+
"y": "0",
10091+
"blur": "0",
10092+
"color": "{basis.form-control.hover.border-color}",
10093+
"spread": "{basis.form-control.hover.border-width}",
10094+
"type": "innerShadow"
10095+
}
10096+
}
10097+
},
10098+
"invalid": {
10099+
"border-color": {
10100+
"$type": "color",
10101+
"$value": "{basis.form-control.invalid.border-color}"
10102+
},
10103+
"hover": {
10104+
"border-color": {
10105+
"$type": "color",
10106+
"$value": "{basis.color.negative.border-hover}"
10107+
},
10108+
"box-shadow": {
10109+
"$type": "boxShadow",
10110+
"$value": {
10111+
"x": "0",
10112+
"y": "0",
10113+
"blur": "0",
10114+
"color": "{basis.color.negative.border-hover}",
10115+
"spread": "{basis.form-control.hover.border-width}",
10116+
"type": "innerShadow"
10117+
}
10118+
}
10119+
}
10120+
}
10121+
}
10122+
}
10123+
},
1001510124
"components/pre-heading": {
1001610125
"utrecht": {
1001710126
"pre-heading": {
@@ -15507,6 +15616,7 @@
1550715616
"components/page-number-navigation/todo",
1550815617
"components/paragraph/nl",
1550915618
"components/paragraph/utrecht",
15619+
"components/password-input",
1551015620
"components/pre-heading",
1551115621
"components/progress-list/den-haag",
1551215622
"components/progress-list/todo",

0 commit comments

Comments
 (0)