From 6c0243c5e23dbaf0549f6f2cff4a08b0cdea11e0 Mon Sep 17 00:00:00 2001 From: AderKonstantin Date: Fri, 28 Mar 2025 18:12:21 +0300 Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20feat:=20Remove=20Theme=20Switcher?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Update body class to use `dark` instead of `light` for dark mode - Remove `ThemeSwitcher` component as it is no longer needed - Update global CSS to set dark mode styles on the `.dark` class instead of `.light` --- app/globals.css | 2 +- app/layout.tsx | 2 +- components/header/theme-switcher.tsx | 50 ---------------------------- components/header/toolbar.tsx | 3 -- 4 files changed, 2 insertions(+), 55 deletions(-) delete mode 100644 components/header/theme-switcher.tsx diff --git a/app/globals.css b/app/globals.css index 96cf646..b48c6f8 100644 --- a/app/globals.css +++ b/app/globals.css @@ -18,6 +18,6 @@ body { font-family: "JetBrains Mono", monospace; } -.light { +.dark { @apply bg-black text-white; } diff --git a/app/layout.tsx b/app/layout.tsx index 6a19596..71dfdca 100644 --- a/app/layout.tsx +++ b/app/layout.tsx @@ -31,7 +31,7 @@ export const metadata: Metadata = { export default function RootLayout({ children }: { children: React.ReactNode }) { return ( - +
{children} diff --git a/components/header/theme-switcher.tsx b/components/header/theme-switcher.tsx deleted file mode 100644 index da5be76..0000000 --- a/components/header/theme-switcher.tsx +++ /dev/null @@ -1,50 +0,0 @@ -'use client'; - -import { useState, useEffect } from 'react'; -import Image from 'next/image'; -import Link from 'next/link'; -import moonPic from '@/public/moon.svg'; -import sunPic from '@/public/sun.svg'; - -export function ThemeSwitcher() { - const [isLightMode, setIsLightMode] = useState(false); - - // Initialize theme from localStorage or system preference - useEffect(() => { - const savedTheme = localStorage.getItem('theme'); - const systemPrefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches; - - if (savedTheme === 'light' || (!savedTheme && !systemPrefersDark)) { - setIsLightMode(true); - document.documentElement.classList.add('light'); - } - }, []); - - // Toggle theme and save preference - const toggleTheme = () => { - const newLightMode = !isLightMode; - setIsLightMode(newLightMode); - - if (newLightMode) { - document.documentElement.classList.add('light'); - localStorage.setItem('theme', 'light'); - } else { - document.documentElement.classList.remove('light'); - localStorage.setItem('theme', 'dark'); - } - }; - - return ( -
  • - - {isLightMode - -
    • - ); -} \ No newline at end of file diff --git a/components/header/toolbar.tsx b/components/header/toolbar.tsx index ea9077d..1f4cfb4 100644 --- a/components/header/toolbar.tsx +++ b/components/header/toolbar.tsx @@ -2,8 +2,6 @@ import Image from 'next/image'; import Link from 'next/link'; -import { ThemeSwitcher } from './theme-switcher'; - import globePic from '../../public/globe.svg'; import emailPic from '../../public/email.svg'; import rssPic from '../../public/rss-feed.svg'; @@ -20,7 +18,6 @@ export default function Toolbar() {