refactor: removed light mode

Author: vwh

src/components/editor/editor.tsx

@@ -1,13 +1,11 @@
 import { useCallback } from "react";
 import { useStore } from "@/store/useStore";
-import { useTheme } from "@/hooks/useTheme";
 
 import MonacoEditor from "@monaco-editor/react";
 import Loader from "@/components/loader";
 
 export default function Editor() {
   const { code, setCode } = useStore();
-  const { theme } = useTheme();
 
   const handleCodeOnChange = useCallback(
     (value: string | undefined) => {
@@ -22,7 +20,7 @@ export default function Editor() {
     <div className="flex h-full flex-col items-center justify-center bg-background pt-4 text-foreground">
       <MonacoEditor
         defaultLanguage="python"
-        theme={theme === "dark" ? "vs-dark" : "light"}
+        theme={"vs-dark"}
         value={code}
         onChange={handleCodeOnChange}
         loading={<Loader text="Loading Editor" />}

src/components/nav-buttons.tsx

@@ -3,7 +3,6 @@ import { useStore } from "@/store/useStore";
 
 import { Button } from "./ui/button";
 import Settings from "./settings";
-import ModeToggle from "./theme/mode-toggle";
 
 import {
   ReplaceIcon,
@@ -64,9 +63,8 @@ const ButtonsNav = () => {
             label="Toggle Direction"
           />
         </div>
-        <div className="flex items-center gap-1 md:gap-2">
+        <div className="flex items-center">
           <Settings />
-          <ModeToggle />
         </div>
       </div>
     </nav>

src/components/theme/mode-toggle.tsx

@@ -4,34 +4,6 @@
 
 @layer base {
   :root {
-    --background: 0 0% 100%;
-    --foreground: 222.2 84% 4.9%;
-    --card: 0 0% 100%;
-    --card-foreground: 222.2 84% 4.9%;
-    --popover: 0 0% 100%;
-    --popover-foreground: 222.2 84% 4.9%;
-    --primary: 222.2 47.4% 11.2%;
-    --primary-foreground: 210 40% 98%;
-    --secondary: 210 40% 96.1%;
-    --secondary-foreground: 222.2 47.4% 11.2%;
-    --muted: 210 40% 96.1%;
-    --muted-foreground: 215.4 16.3% 46.9%;
-    --accent: 210 40% 96.1%;
-    --accent-foreground: 222.2 47.4% 11.2%;
-    --destructive: 0 84.2% 60.2%;
-    --destructive-foreground: 210 40% 98%;
-    --border: 214.3 31.8% 91.4%;
-    --input: 214.3 31.8% 91.4%;
-    --ring: 222.2 84% 4.9%;
-    --radius: 0.5rem;
-    --chart-1: 12 76% 61%;
-    --chart-2: 173 58% 39%;
-    --chart-3: 197 37% 24%;
-    --chart-4: 43 74% 66%;
-    --chart-5: 27 87% 67%;
-  }
-
-  .dark {
     --background: 222.2 84% 4.9%;
     --foreground: 210 40% 98%;
     --card: 222.2 84% 4.9%;
@@ -51,11 +23,7 @@
     --border: 217.2 32.6% 17.5%;
     --input: 217.2 32.6% 17.5%;
     --ring: 212.7 26.8% 83.9;
-    --chart-1: 220 70% 50%;
-    --chart-2: 160 60% 45%;
-    --chart-3: 30 80% 55%;
-    --chart-4: 280 65% 60%;
-    --chart-5: 340 75% 55%;
+    --radius: 0.5rem;
   }
 }
 
@@ -96,12 +64,6 @@
     --scrollbar-thumb: hsl(var(--muted-foreground) / 0.5);
     --scrollbar-thumb-hover: hsl(var(--muted-foreground) / 0.7);
   }
-
-  .dark {
-    --scrollbar-track: hsl(var(--secondary));
-    --scrollbar-thumb: hsl(var(--muted-foreground) / 0.5);
-    --scrollbar-thumb-hover: hsl(var(--muted-foreground) / 0.7);
-  }
 }
 
 .markdown-body pre {
@@ -118,10 +80,10 @@
   display: none;
 }
 
-[class="dark"] .monaco-editor-background {
+.monaco-editor-background {
   background-color: hsl(var(--background)) !important;
 }
 
-[class="dark"] .margin-view-overlays {
+.margin-view-overlays {
   background-color: hsl(var(--background)) !important;
 }

src/components/theme/theme-provider.tsx

@@ -3,12 +3,9 @@ import ReactDOM from "react-dom/client";
 import "./globals.css";
 
 import App from "./App.tsx";
-import ThemeProvider from "@/components/theme/theme-provider";
 
 ReactDOM.createRoot(document.getElementById("root")!).render(
   <React.StrictMode>
-    <ThemeProvider defaultTheme="dark" storageKey="theme">
-      <App />
-    </ThemeProvider>
+    <App />
   </React.StrictMode>
 );