"use client";
import "tailwindcss/tailwind.css";
import Script from "next/script";
import React, { useEffect, useState } from "react";
import NightModeToggle from "@/components/NightModeToggle";
import Navbar from "@/components/NavigationBar";
import KofiWidget from "@/components/KofiWidget";
export default function RootLayout({ children }: { children: React.ReactNode }) {
const [isDarkMode, setIsDarkMode] = useState(false);
useEffect(() => {
const savedTheme = localStorage.getItem("theme");
const prefersDark = window.matchMedia("(prefers-color-scheme: dark)").matches;
const shouldEnableDark = savedTheme === "dark" || (!savedTheme && prefersDark);
setIsDarkMode(shouldEnableDark);
if (shouldEnableDark) {
document.documentElement.classList.add("dark");
} else {
document.documentElement.classList.remove("dark");
}
}, []);
const toggleDarkMode = () => {
const newTheme = isDarkMode ? "light" : "dark";
setIsDarkMode(!isDarkMode);
localStorage.setItem("theme", newTheme);
document.documentElement.classList.toggle("dark", !isDarkMode);
};
return (
{children}
);
}