+
+
+
-
+
+
+
);
}
diff --git a/client/src/ThemeContext.jsx b/client/src/ThemeContext.jsx
new file mode 100644
index 0000000..2ddd645
--- /dev/null
+++ b/client/src/ThemeContext.jsx
@@ -0,0 +1,34 @@
+// ThemeContext.js
+import React, { createContext, useState, useEffect } from 'react';
+
+export const ThemeContext = createContext();
+
+export const ThemeProvider = ({ children }) => {
+ const [theme, setTheme] = useState(null);
+
+ useEffect(() => {
+ if (window.matchMedia('(prefers-color-scheme: dark)').matches) {
+ setTheme('dark');
+ } else {
+ setTheme('light');
+ }
+ }, []);
+
+ useEffect(() => {
+ if (theme === 'dark') {
+ document.documentElement.classList.add('dark');
+ } else {
+ document.documentElement.classList.remove('dark');
+ }
+ }, [theme]);
+
+ const handleThemeSwitch = () => {
+ setTheme((prevTheme) => (prevTheme === 'dark' ? 'light' : 'dark'));
+ };
+
+ return (
+