chore: add default theme colour from localstorage

src/components/layout/main-body/index.tsx

@@ -1,10 +1,25 @@
+import { useEffect } from 'react';
 import './main-body.scss';
 
 type TMainBodyProps = {
     children: React.ReactNode;
 };
 
 const MainBody: React.FC<TMainBodyProps> = ({ children }) => {
+    const current_theme = localStorage.getItem('theme') ?? 'light';
+
+    useEffect(() => {
+        const body = document.querySelector('body');
+        if (!body) return;
+        if (current_theme === 'light') {
+            body.classList.remove('theme--dark');
+            body.classList.add('theme--light');
+        } else {
+            body.classList.remove('theme--light');
+            body.classList.add('theme--dark');
+        }
+    }, [current_theme]);
+
     return <div className='main-body'>{children}</div>;
 };
 

src/styles/index.scss

@@ -3,4 +3,5 @@
 
 body {
     font-family: 'IBM Plex Sans', sans-serif;
+    background: var(--general-main-1);
 }