avinash201199 / avinash201199/stopwatch

Add Multiple Theme Options

Open
#360 2 comments 0 reactions 1 assignee Claimed by @Gupta-02 View on GitHub
hacktoberfest hacktoberfest-accepted
Dominant language
CSS
Stars
70
Forks
185
PR merge metrics
No merged PRs in 30d

Description

Description:
Currently, the stopwatch supports only dark and light themes. Let's enhance the user experience by adding multiple beautiful color themes that users can choose from.

Proposed Themes:

Ocean Blue (deep blues with turquoise accents)
Forest Green (nature-inspired greens)
Sunset Orange (warm oranges and pinks)
Purple Dream (lavender and purple tones)
Minimalist Gray (clean grays and whites)
Requirements:

Add a theme selector dropdown in the navbar
Each theme should maintain the glassmorphism aesthetic
Themes should be persistent (saved to localStorage)
Smooth transitions between theme changes
Ensure all UI elements (buttons, text, backgrounds) adapt properly
Files to modify:

[style.css](vscode-file://vscode-app/c:/Users/Gupta/AppData/Local/Programs/Microsoft%20VS%20Code/resources/app/out/vs/code/electron-browser/workbench/workbench.html) - Add CSS custom properties for each theme
[script.js](vscode-file://vscode-app/c:/Users/Gupta/AppData/Local/Programs/Microsoft%20VS%20Code/resources/app/out/vs/code/electron-browser/workbench/workbench.html) - Add theme switching logic and localStorage persistence
[index.html](vscode-file://vscode-app/c:/Users/Gupta/AppData/Local/Programs/Microsoft%20VS%20Code/resources/app/out/vs/code/electron-browser/workbench/workbench.html) - Add theme selector UI
Acceptance Criteria:

5+ beautiful themes implemented
Theme selector accessible in navbar
Themes persist across sessions
All existing features work in all themes
Smooth theme transitions

Contributor guide

No contributing guide indexed for this repository

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.