Make Toast adjust to the theme

Samfundet · Oct 3, 2023 · 03fbc98 · 03fbc98
1 parent 5bdfd15
commit 03fbc98
Showing 1 changed file with 3 additions and 1 deletion.
diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
@@ -2,6 +2,7 @@ import { Helmet, HelmetProvider } from 'react-helmet-async';
 import { BrowserRouter } from 'react-router-dom';
 import { ToastContainer } from 'react-toastify';
 import { AppRoutes } from '~/AppRoutes';
+import { useIsDarkTheme } from '~/hooks';
 
 import 'react-toastify/dist/ReactToastify.min.css';
 
@@ -13,6 +14,7 @@ export function App() {
   const goatCounterCode = import.meta.env.VITE_GOATCOUNTER_CODE;
   const isDev = import.meta.env.DEV;
   const localSetup = isDev ? '{"allow_local": true}' : undefined;
+  const isDarkTheme = useIsDarkTheme();
 
   return (
     <HelmetProvider>
@@ -32,7 +34,7 @@ export function App() {
         <AppRoutes />
         <CommandMenu />
         {/* Move down from navbar. */}
-        <ToastContainer style={{ marginTop: '45px' }} />
+        <ToastContainer style={{ marginTop: '45px' }} theme={isDarkTheme ? 'dark' : 'light'} />
       </BrowserRouter>
     </HelmetProvider>
   );