Skip to content

feat: Add dark mode to columns.html#2

Open
jrobbins wants to merge 2 commits intomainfrom
dark-mode-columns
Open

feat: Add dark mode to columns.html#2
jrobbins wants to merge 2 commits intomainfrom
dark-mode-columns

Conversation

@jrobbins
Copy link
Owner

Adds a toggle button to switch between light (Day) and dark (Night) modes.

  • Includes a Day/Night button next to the Start button.
  • Defines CSS styles for the dark mode theme within a .dark-mode class.
  • Implements JavaScript logic to toggle the .dark-mode class on the body and update the button text on click.

Adds a toggle button to switch between light (Day) and dark (Night) modes.

- Includes a Day/Night button next to the Start button.
- Defines CSS styles for the dark mode theme within a `.dark-mode` class.
- Implements JavaScript logic to toggle the `.dark-mode` class on the body and update the button text on click.
Implemented dark mode support for the columns game using the `prefers-color-scheme` media query.

- Introduced CSS variables for background and piece colors.
- Updated existing styles to use these variables.
- Added a `@media (prefers-color-scheme: dark)` query to redefine the background color for dark mode.
- Applied the background color variable to the `body` element so the entire page adapts.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant