feat(theme) add ThemeSwitcher.tsx

app/globals.css

@@ -0,0 +1,3 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;

app/layout.tsx

@@ -1,22 +1,28 @@
-import type { Metadata } from "next";
-import { Inter } from "next/font/google";
-import "./globals.css";
+import type { Metadata } from 'next';
+import { Inter } from 'next/font/google';
+import './globals.css';
+import React from 'react';
+import { ThemeProvider as NextThemesProvider } from 'next-themes';
 
-const inter = Inter({ subsets: ["latin"] });
+const inter = Inter({ subsets: [ 'latin' ] });
 
 export const metadata: Metadata = {
-  title: "Lumither's site",
-  description: "a small corner on internet",
+    title: 'Lumither\'s site',
+    description: 'a small corner on internet'
 };
 
 export default function RootLayout({
-  children,
+    children
 }: Readonly<{
-  children: React.ReactNode;
+    children: React.ReactNode;
 }>) {
-  return (
-    <html lang="en">
-      <body className={inter.className}>{children}</body>
-    </html>
-  );
+    return (
+        <html lang="en" suppressHydrationWarning>
+        <body className={ inter.className }>
+        <NextThemesProvider attribute="class" defaultTheme="dark">
+            { children }
+        </NextThemesProvider>
+        </body>
+        </html>
+    );
 }

app/page.tsx

@@ -1,7 +1,9 @@
+import ThemeSwitcher from '@/components/ThemeSwitcher';
+
 export default function Home() {
     return (
         <main>
-
+            <ThemeSwitcher />
         </main>
     );
 }

app/providers.tsx

@@ -0,0 +1,12 @@
+'use client';
+
+import { NextUIProvider } from '@nextui-org/react';
+import React from 'react';
+
+export function Providers({ children }: { children: React.ReactNode }) {
+    return (
+        <NextUIProvider>
+            { children }
+        </NextUIProvider>
+    );
+}