element-hq / compound

Element's design system
https://compound.element.io
Apache License 2.0
12 stars 3 forks source link

Incorrect figma style value bg.canvas.default #262

Closed germain-gg closed 1 year ago

germain-gg commented 1 year ago

Platform

Description

@jmartinesp says the dark variant of the "bg canvas default" color should be #1d1f24 backed by https://github.com/vector-im/compound-design-tokens/blob/main/tokens/theme-semantics-dark.json#L11

Whilst @callumu says it should be #101317 backed by https://www.figma.com/file/PpKepmHKGikp33Ql7iivbn/Compound-Styles?type=design&node-id=1203-654&mode=design&t=eDh1AiNGAAtKWWOv-11

janogarcia commented 1 year ago

bg.canvas.default and bg.canvas.default-level-1 are different semantic tokens. While they point to the same hex value in Light theme, they should point to two different hex values in Dark theme.

bg.canvas.default

The current mapping for bg.canvas.default is correct.

It points to color.theme.bg for both themes. That is, that semantic token is symmetrical.

The value for color.theme.bg in Dark mode is #101317.

bg.canvas.default-level-1

The semantic token @jmartinesp is referring to, bg.canvas.default-level-1 is a completely different one. In Dark mode it points to color.gray.300 which translates to #1d1f24, and that's expected given that it's asymmetrical (light vs dark).

janogarcia commented 1 year ago

I'm closing this issue as it's working as intended, but feel free to reopen if necessary.