From 03fbc983b73585bf7aedaec10977ee73bd00ebd5 Mon Sep 17 00:00:00 2001
From: Marion <Marionly@stud.ntnu.no>
Date: Tue, 3 Oct 2023 22:01:59 +0200
Subject: [PATCH] Make Toast adjust to the theme

---
 frontend/src/App.tsx | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index b255b1fa0..5c8267452 100644
--- 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>
   );