utopia
utopia copied to clipboard
(Dark Mode) - update icons
Problem We have theoretical support for a dark mode. For it to work, we need to update our use of icons, since at the moment they are hardcoded where placed
Approach
- [ ] Keep filenames as-is.
- [ ] Remove 'theme' from the icon path, move icons one folder up
- [ ] Create a semantic mapping inside theme (think theme.icons.secondary: 'gray')
- [ ] Update the <Icon>, <Icons.*> components
- [ ] For manual references to icons, create a helper function to map semantic to colour based on theme and
- [ ] implement it where they're being used
- [ ] update figma to not include 'theme' as part of the export
Theme mapping In order to map colours to semantics, we can start with this schema. If it's not exhaustive, let's discuss:
light theme:
main: black
secondary: darkgray
subdued: lightgrey
inverted: white
primary: blue
accent1: purple
accent2: orange
accent3: green
dark theme:
main: white
secondary: lightgrey
subdued: gray
inverted: black
primary: blue
accent1: purple
accent2: orange
accent3: green