Create a dark/light switch theme with css variables

[beatrizsmerino]

Tasks:

• Create a new component vue called SwitchTheme.
• Create the structure as used in this repo: git-bible
  
• Places the SwitchTheme inside the PageHeader, to the right of the navigation menu.
  
• The SwitchTheme adds a css class is-theme-dark or is-theme-light to the html tag for overwrides the elements of the page.
  
• Overwrite the background-color, color and fill css properties for the dark mode, inside each component

Important

• For the colors use scss variables and scss functions as mix($color-white, $color-brand-1, 90%).
• When finished, execute the command npm run lint to format the code.

Designs

SwitchTheme component

is-theme-light

is-theme-dark

Pages is-theme-dark

Home

Users

User