- From: Romain Menke via GitHub <sysbot+gh@w3.org>
- Date: Thu, 17 Nov 2022 09:10:11 +0000
- To: public-design-tokens-log@w3.org
romainmenke has just created a new issue for https://github.com/design-tokens/community-group:
== Use CSS as a transfer format instead of JSON. ==
A lot of the work being done here in the DTCG has been done before by the CSSWG.
- type definitions
- property definitions
- language syntax
- language grammar
- ....
With CSS we already have a way to communicate style information in a structured, machine readable manner.
There is also a very large and healthy community around it.
There are parsers and serialisers in many programming languages.
Instead of inventing something new and trying to force it to work in JSON I propose we just use CSS.
```json
{
"shadow-token": {
"$type": "shadow",
"$value": {
"color": "#00000088",
"offsetX": "0.5rem",
"offsetY": "0.5rem",
"blur": "1.5rem",
"spread": "0rem"
}
}
}
```
could be :
```css
/* file: brand.tokens.css */
@token shadow-token {
box-shadow: 0.5rem 0.5rem 1.5rem #00000088;
}
```
Groups can be done in multiple ways :
```css
@token your-group {
@token shadow-token {
box-shadow: 0.5rem 0.5rem 1.5rem #00000088;
}
/* more tokens */
}
/* override a single token from a group */
@token your-group.shadow-token {
box-shadow: 0.5rem 0.5rem 1.5rem pink;
}
```
Custom properties already exist :
```css
@token shadow-token {
box-shadow: 0.5rem 0.5rem 1.5rem #00000088;
--something-specific-to-my-tool: "hello";
}
```
-----
Starting out with support for everything in the CSS specification will be impossible.
But a small subset can be defined and can be expanded over time.
It allows the DTCG to focus on these aspects :
- definition of the custom `@token` at rule
- definition of the adopted subset of the CSS specification
Please view or discuss this issue at https://github.com/design-tokens/community-group/issues/185 using your GitHub account
--
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config
Received on Thursday, 17 November 2022 09:10:13 UTC