Re: [csswg-drafts] Proposal: CSS Variable Groups (as a solution to several design systems pain points) (#9992)

This is really very nice. I don't tend to have the colour mapping issue as described in the proposal. I do have it in other ways. 

```css
--color-link: { 
  base: darkblue;
  --hover: dodgerblue;
  --visited: purple;
  --active: crimson;
}

--typography-weight: {
  /* within the group refer to the extension name only? */
  base: var(--semibold); 
  --thin: 100;
  --extralight: 200; 
  ...
}
```

The scary part (okay, not very scary) is that changes to the extension names/keys could break further down the chain. But certainly more manageable than mapping everything by hand!

I wonder if it would be possible to preconfigure the extensions in an at-rule property.
```css
@property --color-blue: {
  syntax: "<color>";
  extensions: 100 / 900;
}
@property --stroke-width: {
  ...
  extensions: thin | medium | thick;
}
```
In usage:
```css
--color-blue: { 
  --10: lightblue; /* Would show a property error */
  --200: blue;
  --300: darkblue;
}
 

-- 
GitHub Notification of comment by dutchcelt
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/9992#issuecomment-1962936366 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Sunday, 25 February 2024 13:11:44 UTC