@open-inwoner/design-tokens
Version:
Design tokens for Open Inwoner
79 lines (78 loc) • 2.73 kB
JSON
{
"utrecht": {
"table": {
"border-color": {"value": "transparent"},
"border-width": {"value": "0"},
"font-family": {"value": "{oip.typography.sans-serif.font-family}"},
"font-size": {"value": "16px"},
"line-height": {"value": "24px"},
"margin-block-end": {"value": "0"},
"margin-block-start": {"value": "0"},
"caption": {
"font-weight": {"value": "700"},
"font-family": {"value": "{oip.typography.sans-serif.font-family}"},
"font-size": {"value": "16px"},
"color": {"value": "#000000"},
"line-height": {"value": "130%"},
"text-align": {"value": "left"},
"margin-block-end": {"value": "0"}
},
"header": {
"font-weight": {"value": "bold"},
"background-color": {"value": "transparent"},
"color": {"value": "#000000"},
"text-transform": {"value": "none"},
"border-block-end-color": {"value": "{oip.color.gray}"},
"border-block-end-width": {"value": "2px"},
"sticky": {
"background-color": {"value": "transparent"},
"color": {"value": "#000000"},
"border-block-end-color": {"value": "{oip.color.gray}"},
"border-block-end-width": {"value": "2px"}
}
},
"footer": {
"background-color": {"value": "#ffffff"},
"color": {"value": "#000000"},
"sticky": {
"background-color": {"value": "{oip.color.gray}"},
"color": {"value": "#000000"}
}
},
"header-cell": {
"font-size": {"value": "16px"},
"font-weight": {"value": "bold"},
"color": {"value": "#000000"},
"text-transform": {"value": "none"}
},
"cell": {
"line-height": {"value": "24px"},
"padding-block-end": {"value": "12px"},
"padding-block-start": {"value": "12px"},
"padding-inline-end": {"value": "8px"},
"padding-inline-start": {"value": "8px"},
"selected": {
"background-color": {"value": "{oip.color.gray}"},
"color": {"value": "#000000"}
},
"icon": {
"size": {"value": "16px"}
}
},
"row": {
"border-block-end-color": {"value": "{oip.color.gray}"},
"border-block-end-width": {"value": "1px"},
"padding-inline-end": {"value": "8px"},
"padding-inline-start": {"value": "8px"},
"alternate-odd": {
"background-color": {"value": "#FFFFFF"},
"color": {"value": "{oip.color.fg}"}
},
"alternate-even": {
"background-color": {"value": "{oip.color.gray-lightest}"},
"color": {"value": "{oip.color.fg}"}
}
}
}
}
}