Web Vault Dark Mode

Feature name:

  • Web Vault Dark Mode

Feature Description

  • Dark Mode for the Vault with options between Light, Dark and Default (browser theme)

Clients / Repos Affected:

  • Web

Timeline to completion (estimate):

ETA: Q2/2021


I’ve copied the way the Browser extension does dark mode with a variables.scss sheet with the mixin at the bottom. I’ve gone through the styles.scss and added some variables in to get the theme working. Screenshots at the bottom for what I’ve done so far

For the options, I’ve carried on some work that was already present in the code for theme and themeKey. The dropdown checks themeOptions for the themes we’ve set (currently on Dark and Light, Nord and Solarized can be added).

Options Page
Screenshot 2021-05-09 152248

Dropdown menu
Screenshot 2021-05-09 152302

Full Options Page in Dark Mode
Screenshot 2021-05-09 152323

Vault Page in Dark Mode

Add Item in Dark Mode

Everything is readable to myself, I’ve created a Draft Pull Request for people to review my code - Whilst functional I’m sure there are better ways of doing it for the options section


New Pull Request after a git issue on my PC

1 Like