SrigadaAkshayKumar/chatapp-frontend

Implement Dark Mode for the Chat App

Aperta

#5 aperta il 9 feb 2025

Vedi su GitHub
 (1 commento) (0 reazioni) (1 assegnatario)JavaScript (3 fork)auto 404
UI/UXenhancementgood first issue

Metriche repository

Star
 (1 stella)
Metriche merge PR
 (Metriche PR in attesa)

Descrizione

🌙 Implement Dark Mode for the Chat App

📌 Description

Improve user experience by adding a Dark Mode feature for better eye comfort and accessibility.

🚀 Feature Requirements

  • ✅ Add a toggle button to switch between Light and Dark modes.
  • ✅ Use CSS variables for easy theme switching.
  • ✅ Ensure proper contrast and readability in Dark Mode.
  • ✅ Save user preference in local storage for persistence.

🛠 Tech Stack

  • CSS
  • JavaScript / React

🔄 Possible Implementation Steps

  1. Implement CSS variables for Light and Dark themes.
  2. Add a toggle switch for theme selection.
  3. Store the user's preference in local storage.
  4. Ensure consistent UI adjustments in Dark Mode.
  5. Test accessibility to maintain proper contrast.

🏷 Labels

🔹 UI/UX
🔹 enhancement
🔹 good first issue

Guida contributor

Direzione di ricerca
Implementa la modalità scura utilizzando variabili CSS e un pulsante di attivazione, salva la preferenza in localStorage.
Tech stack
javascriptcssreact
Dominio
frontend
Tipo issue
Funzionalità
DifficoltàQuanto dovrebbe essere impegnativa per un nuovo contributor.
2
Tempo stimatoTempo stimato per completare e verificare uno scope piccolo.
1-3 ore
Stato attivitàQuanto è probabile che la issue sia ancora attiva e reviewable.
Attiva
ChiarezzaQuanto chiaramente la issue descrive problema, scope e risultato atteso.
Chiara
Prerequisiti
CSSJavaScriptReact basics
Adatta ai principiantiQuanto la issue è adatta a contributor alla prima esperienza.
80