Skip to content

Commit 901e59f

Browse files
authored
Merge pull request #190 from Jemiiah/feat/theme
feat: implememnt `Light/Dark` with `next/theme` over custom
2 parents e63fa06 + 1f84098 commit 901e59f

File tree

7 files changed

+722
-858
lines changed

7 files changed

+722
-858
lines changed

.env.example

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
NEXT_PUBLIC_FIREBASE_API_KEY=
2+
NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN=
3+
NEXT_PUBLIC_FIREBASE_PROJECT_ID=
4+
NEXT_PUBLIC_FIREBASE_APP_ID=
5+
6+
NEXT_PUBLIC_APP_HASURA_ENDPOINT=
7+
NEXT_PUBLIC_API_URL=

app/globals.css

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
@tailwind base;
2+
@tailwind components;
3+
@tailwind utilities;
4+
@import "leaflet/dist/leaflet.css";
5+
@import 'flowbite/dist/flowbite.css';
6+
7+
body {
8+
font-family: Arial, Helvetica, sans-serif;
9+
}
10+
11+
*,
12+
*::before,
13+
*::after {
14+
transition: background-color 0.3s ease,
15+
color 0.3s ease,
16+
border-color 0.3s ease;
17+
}

app/layout.tsx

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
'use client';
2+
import React from 'react';
3+
import './globals.css';
4+
import { ToastContainer } from 'react-toastify';
5+
import 'react-toastify/dist/ReactToastify.css';
6+
import { ThemeProvider } from '@material-tailwind/react';
7+
import { ThemeProvider as NextThemeProvider } from 'next-themes';
8+
import '../src/i18n/config';
9+
import { ClientProviders } from '@/providers/ClientProviders';
10+
11+
export default function RootLayout({
12+
children,
13+
}: {
14+
children: React.ReactNode;
15+
}) {
16+
return (
17+
<html lang="en" suppressHydrationWarning>
18+
<body className="antialiased font-inter" suppressHydrationWarning={true}>
19+
<div className="min-h-screen flex flex-col">
20+
<ThemeProvider>
21+
<NextThemeProvider
22+
attribute="class"
23+
defaultTheme="system"
24+
enableSystem
25+
>
26+
<ClientProviders>
27+
<main className="flex-1">{children}</main>
28+
</ClientProviders>
29+
</NextThemeProvider>
30+
</ThemeProvider>
31+
</div>
32+
<ToastContainer position="top-right" />
33+
</body>
34+
</html>
35+
);
36+
}

0 commit comments

Comments
 (0)