Merge pull request #1 from superdoc-dev/caio-pizzol/remove-dark-mode

chore: remove dark mode support

Author: caio-pizzol

package-lock.json

@@ -2,10 +2,7 @@ import { clsx } from "clsx";
 import { Menu, X } from "lucide-react";
 import { useState } from "react";
 import { Link, useLocation } from "react-router-dom";
-import logoDark from "../assets/logo-dark.png";
-import logoLight from "../assets/logo-light.png";
-import { useTheme } from "../hooks/useTheme";
-import { ThemeToggle } from "./ThemeToggle";
+import logo from "../assets/logo.png";
 
 interface NavbarProps {
 	sticky?: boolean;
@@ -14,7 +11,6 @@ interface NavbarProps {
 
 export function Navbar({ sticky = false, maxWidth = false }: NavbarProps) {
 	const location = useLocation();
-	const { resolvedTheme } = useTheme();
 	const isDocsActive = location.pathname.startsWith("/docs");
 	const [mobileMenuOpen, setMobileMenuOpen] = useState(false);
 
@@ -28,7 +24,7 @@ export function Navbar({ sticky = false, maxWidth = false }: NavbarProps) {
 			<div className={clsx("flex items-center justify-between", maxWidth && "mx-auto max-w-6xl")}>
 				<Link to="/" className="flex shrink-0 items-center">
 					<img
-						src={resolvedTheme === "dark" ? logoDark : logoLight}
+						src={logo}
 						alt="ooxml.dev"
 						className="h-6"
 					/>
@@ -47,12 +43,10 @@ export function Navbar({ sticky = false, maxWidth = false }: NavbarProps) {
 							</span>
 						</span>
 					</NavLink>
-					<ThemeToggle />
 				</nav>
 
 				{/* Mobile menu button */}
 				<div className="flex items-center gap-2 sm:hidden">
-					<ThemeToggle />
 					<button
 						type="button"
 						onClick={() => setMobileMenuOpen(!mobileMenuOpen)}

src/assets/logo-dark.png

@@ -1,82 +1,40 @@
 @import "tailwindcss";
 
-/* ooxml.dev theme - Coral Light (with dark mode) */
+/* ooxml.dev theme - Coral Light */
 :root {
 	/* Coral accent */
 	--color-accent: #ea580c;
 	--color-accent-hover: #c2410c;
 	--color-accent-light: #fff7ed;
 
-	/* Light mode backgrounds */
+	/* Backgrounds */
 	--color-bg-primary: #ffffff;
 	--color-bg-secondary: #fafaf9;
 	--color-bg-tertiary: #f5f5f4;
 	--color-bg-code: #1c1917;
 
-	/* Light mode borders */
+	/* Borders */
 	--color-border: #e7e5e4;
 	--color-border-strong: #d6d3d1;
 
-	/* Light mode text */
+	/* Text */
 	--color-text-primary: #1c1917;
 	--color-text-secondary: #57534e;
 	--color-text-muted: #a8a29e;
 
-	/* Syntax highlighting (for light mode code blocks on dark bg) */
+	/* Syntax highlighting (for code blocks on dark bg) */
 	--color-syntax-tag: #22d3ee;
 	--color-syntax-attr: #c4b5fd;
 	--color-syntax-value: #86efac;
 	--color-syntax-comment: #71717a;
 }
 
-.dark {
-	/* Coral accent (slightly lighter for dark mode) */
-	--color-accent: #fb923c;
-	--color-accent-hover: #f97316;
-	--color-accent-light: #431407;
-
-	/* Dark mode backgrounds */
-	--color-bg-primary: #0c0a09;
-	--color-bg-secondary: #1c1917;
-	--color-bg-tertiary: #292524;
-	--color-bg-code: #1c1917;
-
-	/* Dark mode borders */
-	--color-border: #292524;
-	--color-border-strong: #44403c;
-
-	/* Dark mode text */
-	--color-text-primary: #fafaf9;
-	--color-text-secondary: #a8a29e;
-	--color-text-muted: #78716c;
-}
-
-html {
-	color-scheme: light;
-}
-
-html.dark {
-	color-scheme: dark;
-}
-
 body {
 	font-family: "Inter", system-ui, -apple-system, sans-serif;
 	background-color: var(--color-bg-primary);
 	color: var(--color-text-primary);
 	margin: 0;
 	min-height: 100vh;
-	transition:
-		background-color 0.2s ease,
-		color 0.2s ease;
-}
-
-/* Smooth transitions for theme changes */
-*,
-*::before,
-*::after {
-	transition:
-		background-color 0.2s ease,
-		border-color 0.2s ease;
 }
 
 /* Code syntax highlighting */
@@ -98,34 +56,18 @@ body {
 	background-color: #fef2f2;
 	border-color: #fecaca;
 }
-.dark .note-critical {
-	background-color: rgba(127, 29, 29, 0.3);
-	border-color: #7f1d1d;
-}
 
 .note-warning {
 	background-color: #fffbeb;
 	border-color: #fde68a;
 }
-.dark .note-warning {
-	background-color: rgba(120, 53, 15, 0.3);
-	border-color: #78350f;
-}
 
 .note-info {
 	background-color: #fff7ed;
 	border-color: #fed7aa;
 }
-.dark .note-info {
-	background-color: rgba(124, 45, 18, 0.3);
-	border-color: #7c2d12;
-}
 
 .note-tip {
 	background-color: #f0fdf4;
 	border-color: #bbf7d0;
 }
-.dark .note-tip {
-	background-color: rgba(20, 83, 45, 0.3);
-	border-color: #14532d;
-}

src/assets/logo-light.png src/assets/logo.pngsrc/assets/logo-light.png renamed to src/assets/logo.png

@@ -2,15 +2,12 @@ import { StrictMode } from "react";
 import { createRoot } from "react-dom/client";
 import { BrowserRouter } from "react-router-dom";
 import App from "./App";
-import { ThemeProvider } from "./hooks/useTheme";
 import "./index.css";
 
 createRoot(document.getElementById("root")!).render(
 	<StrictMode>
-		<ThemeProvider>
-			<BrowserRouter>
-				<App />
-			</BrowserRouter>
-		</ThemeProvider>
+		<BrowserRouter>
+			<App />
+		</BrowserRouter>
 	</StrictMode>,
 );