Re: [community-group] [RFC] Format specification (#1)

Thanks for the thought question @c1rrus 

I may be incorrect about this, but I am thinking about Design Tokens as way to codify design decisions, so I view the "selectors" as keys rather than css selectors per se. In my mind, the nesting implies a relationship. 

For instance in my example: 

```css
typography {
    main {
        font-family: $font-families.display;
        font-size: $sizes.medium;
        color: $colors.primary;
    }
}
```

There is a token named **main** which defines a set of design decisions about how text should be rendered. This token is grouped into a super set of **typography**.

So if I were to build a interpreter, I may look for the specific super set (perhaps because its reserved) of typography, within it I would expect to find collections of decisions to render a particular typographic element. 

In case of my example, the **main** text element. If I were writing a Design Token to CSS transpiler;  It might create a css class of `.main` and it would hold the specified font family, size and color information.

If I were writing a transpiler for some design software, perhaps it would be presented like this:

<img width="343" alt="Example of Character Styles mocked up in Adobe XD" src="https://user-images.githubusercontent.com/2458021/88103624-3fc67300-cb6f-11ea-86ca-c716f8fd5a72.png">

I fear I may have missed my mark with my initial example. What I was trying to express is that Tokens will need two parts, no matter which syntax or language we choose. One part to define a property, `border thickness`, `font weight`, `gutter width` etc. And another to define a collection of those properties, ie. A card element with a white background, rounded borders and a drop shadow.

Both are design decisions we need to codify.

-- 
GitHub Notification of comment by ManeeshChiba
Please view or discuss this issue at https://github.com/design-tokens/community-group/issues/1#issuecomment-662094214 using your GitHub account

Received on Tuesday, 21 July 2020 20:39:13 UTC