Skip to content

Commit

Permalink
Add ref to Figma in docs and fix typos
Browse files Browse the repository at this point in the history
  • Loading branch information
Robin Métral committed Jan 6, 2023
1 parent 2fdef71 commit a7f0dd2
Showing 1 changed file with 3 additions and 3 deletions.
6 changes: 3 additions & 3 deletions docs/features/theme.stories.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -27,9 +27,9 @@ The theme used throughout Circuit UI comes from SumUp's design token library, [`

### New semantic colors

Theme colors are changing from color scales (e.g. `g900`) to semantic colors (e.g. `fg-success`). This makes theme customizations easier and more reliable, and enables theming for sub-brands or supporting multiple color modes.
The Circuit UI theme is moving from color scales (e.g. `g900`) to semantic colors (e.g. `fg-success`). This makes theme customizations easier and more reliable, and enables theming for sub-brands or for supporting multiple color modes. For detailed documentation on the new semantic colors, refer to the [Figma documentation](https://www.figma.com/file/OgPQeoNZ2QoY7hZvy0ybk2/%F0%9F%8C%88-COLOR-TOKENS?node-id=913%3A3903&t=b9BsTOJnzKDomZ9E-4) (internal link).

Additionally, colors are being moved from the JS theme (from `@sumup/design-tokens`) to CSS custom properties, declared in the Circuit UI `BaseStyles` from version 6.1.0. This has performance benefits over CSS-in-JS theming.
Additionally, color tokens are moving from the JS theme (exported from `@sumup/design-tokens`) to [CSS custom properties](https://www.w3.org/TR/css-variables-1/), declared in the Circuit UI `BaseStyles` from version 6.1.0. This has performance benefits over CSS-in-JS theming. Eventually, all design tokens will be declared as CSS custom properties.

#### Background colors

Expand Down Expand Up @@ -210,7 +210,7 @@ Additionally, colors are being moved from the JS theme (from `@sumup/design-toke

### Legacy colors

Legacy colors are still available on the JS theme, but new semantic colors (see above) should be used on new pages from now on. The following lgacy colors will eventually be deprecated and removed from the theme.
Legacy colors remain available on the JS theme, but semantic colors (see above) should be used on new pages from now on. The following legacy colors will eventually be deprecated and removed from the theme.

```
theme.colors.<COLOR_NAME>
Expand Down

0 comments on commit a7f0dd2

Please sign in to comment.