Skip to content

💞🌤🌔 Redo Light and Dark Mode #75

Description

@srstone20

User Story

As a user, I want to select between a standard and pleasing light and dark mode.

  • Persona: A user who wants to be able to select light or dark mode
  • Feature: Styling for light and dark mode
  • Business Value: Having a standard light and dark mode would align with many other popular websites

Tasks

  • Add a shadow option for the styles. This should include the entire CSS "box-shadow" values for high customization.
  • Change the name of current light mode to "Mint"
  • Make a new theme called "Standard Light" which is the standard light mode
  • Make a new theme called "Standard Dark" which is the standard dark mode
  • Every page in the app follows the chosen theme, even parts not under /app route
  • Sidebar sticks to the side when main content overflows
  • Icons can be colored based on theme

Acceptance

  • There are three new modes: Standard Light, Standard Dark, and Mint
  • Shadows can change between themes
  • The themes are nice to look at and cover the whole site

Report

https://docs.google.com/document/d/1ELkm5PxtQmpyegup5RnBSJxcXC7k57R0HetVxyVNFlg/edit

The initial styling is hard to read. I directed them to the style selection button so they could choose a more readable theme.

Metadata

Metadata

Assignees

Labels

No labels
No labels

Type

No type

Fields

No fields configured for issues without a type.

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions