diff --git a/src/app/globals.css b/src/app/globals.css
new file mode 100644
index 0000000..bd6213e
--- /dev/null
+++ b/src/app/globals.css
@@ -0,0 +1,3 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
\ No newline at end of file
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
index 6e43fc4..4118291 100644
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -1,6 +1,7 @@
import type { Metadata } from 'next';
import { Inter } from 'next/font/google';
import ThemeWrapper from '@/lib/components/ThemeWrapper';
+import './globals.css';
const inter = Inter({ subsets: ['latin'] });
@@ -16,7 +17,7 @@ export default function RootLayout({
}) {
return (
-
+
{children}
diff --git a/src/app/page.tsx b/src/app/page.tsx
index 34db6e6..8f5dd1c 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -1,12 +1,11 @@
"use client";
-import { Button, Flex, Text } from '@radix-ui/themes';
+import { Heading } from '@radix-ui/themes';
export default function Home() {
return (
-
- Testicle obliteration dashboard
-
-
+ <>
+ Welcome back.
+ >
);
}
diff --git a/src/lib/components/ThemeWrapper.tsx b/src/lib/components/ThemeWrapper.tsx
index 91a45ac..281089b 100644
--- a/src/lib/components/ThemeWrapper.tsx
+++ b/src/lib/components/ThemeWrapper.tsx
@@ -9,10 +9,12 @@ export default function ThemeWrapper({
}: {
children: React.ReactNode
}) {
- const [dark, setDark] = useState(window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches);
+ const [dark, setDark] = useState(true);
// Automatically respond to theme changes
useEffect(() => {
+ setDark(window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches);
+
const onThemeChange = (event: MediaQueryListEvent) => {
setDark(event.matches);
};
@@ -21,11 +23,11 @@ export default function ThemeWrapper({
match.addEventListener('change', onThemeChange);
return () => match.removeEventListener('change', onThemeChange);
- });
+ }, []);
return