From 9e73faae718f53a4827c5454af77394f2f886b03 Mon Sep 17 00:00:00 2001 From: EriqueRocha Date: Sun, 12 Oct 2025 22:06:53 -0300 Subject: [PATCH] feat: theme switch button --- package-lock.json | 11 ++++++++ package.json | 1 + src/app/layout.tsx | 11 ++++++-- src/components/Header.tsx | 4 +++ src/components/Theme/ThemeProvider.tsx | 17 +++++++++++ src/components/Theme/ThemeToggle.tsx | 39 ++++++++++++++++++++++++++ tailwind.config.ts | 1 + 7 files changed, 81 insertions(+), 3 deletions(-) create mode 100644 src/components/Theme/ThemeProvider.tsx create mode 100644 src/components/Theme/ThemeToggle.tsx diff --git a/package-lock.json b/package-lock.json index 798766a..179d3c9 100644 --- a/package-lock.json +++ b/package-lock.json @@ -17,6 +17,7 @@ "clsx": "^2.1.1", "framer-motion": "^11.11.9", "next": "^14.2.13", + "next-themes": "^0.4.6", "react": "^18", "react-dom": "^18", "react-icons": "^5.3.0" @@ -4684,6 +4685,16 @@ } } }, + "node_modules/next-themes": { + "version": "0.4.6", + "resolved": "https://registry.npmjs.org/next-themes/-/next-themes-0.4.6.tgz", + "integrity": "sha512-pZvgD5L0IEvX5/9GWyHMf3m8BKiVQwsCMHfoFosXtXBMnaS0ZnIJ9ST4b4NqLVKDEm8QBxoNNGNaBv2JNF6XNA==", + "license": "MIT", + "peerDependencies": { + "react": "^16.8 || ^17 || ^18 || ^19 || ^19.0.0-rc", + "react-dom": "^16.8 || ^17 || ^18 || ^19 || ^19.0.0-rc" + } + }, "node_modules/next/node_modules/@swc/helpers": { "version": "0.5.5", "resolved": "https://registry.npmjs.org/@swc/helpers/-/helpers-0.5.5.tgz", diff --git a/package.json b/package.json index 311d8c0..5189f8a 100644 --- a/package.json +++ b/package.json @@ -19,6 +19,7 @@ "clsx": "^2.1.1", "framer-motion": "^11.11.9", "next": "^14.2.13", + "next-themes": "^0.4.6", "react": "^18", "react-dom": "^18", "react-icons": "^5.3.0" diff --git a/src/app/layout.tsx b/src/app/layout.tsx index c049c01..647fbb3 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -7,6 +7,7 @@ import Footer from '@/components/Footer' import { siteDetails } from '@/data/siteDetails' import './globals.css' +import { ThemeProvider } from "@/components/Theme/ThemeProvider"; const manrope = Manrope({ subsets: ['latin'] }) const sourceSans = Source_Sans_3({ subsets: ['latin'] }) @@ -78,9 +79,13 @@ export default function RootLayout({ {siteDetails.googleAnalyticsId && } -
-
{children}
-