Minor changes

c2siorg · Jul 6, 2024 · d0ca7a9 · d0ca7a9
1 parent 51992d4
commit d0ca7a9
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 3 deletions.
diff --git a/webapp/src/App.jsx b/webapp/src/App.jsx
@@ -11,17 +11,23 @@ import Header from "./components/Header/Header";
 
 const App = () => {
   const [isDarkMode, setDarkMode] = useState("dark");
+  const [dark, setDark] = useState(false);
 
   const toggleDarkMode = () => {
     setDarkMode((isDarkMode) => (isDarkMode === "dark" ? "light" : "dark"));
+    setDark(!dark);
   };
 
   useEffect(() => {
     document.documentElement.setAttribute("data-theme", isDarkMode);
   }, [isDarkMode]);
   return (
     <div>
-      <Header isDarkMode={isDarkMode} toggleDarkMode={toggleDarkMode} />
+      <Header
+        isDarkMode={isDarkMode}
+        toggleDarkMode={toggleDarkMode}
+        dark={dark}
+      />
 
       <Routes>
         <Route path="debug" element={<Debug />}>

diff --git a/webapp/src/components/Header/Header.jsx b/webapp/src/components/Header/Header.jsx
@@ -4,7 +4,7 @@ import c2si from "../../assets/c2si.png";
 import { Link } from "react-router-dom";
 import { DarkModeSwitch } from "react-toggle-dark-mode";
 
-const Header = ({ isDarkMode, toggleDarkMode }) => {
+const Header = ({ isDarkMode, toggleDarkMode, dark }) => {
   return (
     <div className="header">
       <div className="head">
@@ -15,7 +15,7 @@ const Header = ({ isDarkMode, toggleDarkMode }) => {
           <div className="darkmode">
             <DarkModeSwitch
               style={{ marginBottom: "2rem" }}
-              checked={isDarkMode}
+              checked={dark}
               onChange={toggleDarkMode}
               size={20}
             />