frontendgood first issueneeds-triageopenui-site
Repository metrics
- Stars
- (4,488 stars)
- PR merge metrics
- (Avg merge 2d) (9 merged PRs in 30d)
Description
We have a lot of hardcoded colour and spacing values across our CSS files. We also have a lot of similar colours that could be consolidated into a single colour variables.
Here's a small slice of the different variables that we have across the site:
| values | number of files | total occurrences |
|---|---|---|
| #333 | 1 | 1 |
| #eee | 2 | 2 |
| #00a453 | 3 | 3 |
| #f2f2f2 | 2 | 2 |
| #ffdf3f | 1 | 2 |
This isn't included spacing values or rgba values.
To ensure a consistent visual experience across the site, we should look to use CSS variables where possible.
This means defining the CSS variables in the global.css file, and using them in other CSS files or within style blocks.
This will also allow us to more easily add a dark mode, should we decide to add one at a later date.