Added Dark and Light mode toggels

This commit is contained in:
2025-05-11 21:54:16 -04:00
parent a4925d5944
commit c7c331d5e9
7 changed files with 136 additions and 21 deletions

View File

@@ -0,0 +1,26 @@
import React, { createContext, useState, useContext } from 'react';
const ThemeContext = createContext();
export const ThemeProvider = ({ children }) => {
const [isDarkMode, setIsDarkMode] = useState(true);
const toggleTheme = () => {
setIsDarkMode(!isDarkMode);
document.documentElement.setAttribute('data-theme', !isDarkMode ? 'dark' : 'light');
};
return (
<ThemeContext.Provider value={{ isDarkMode, toggleTheme }}>
{children}
</ThemeContext.Provider>
);
};
export const useTheme = () => {
const context = useContext(ThemeContext);
if (context === undefined) {
throw new Error('useTheme must be used within a ThemeProvider');
}
return context;
};