gravity

app/about/page.tsx

@@ -67,7 +67,7 @@ const AboutPage = () => {
   const age = calculateAge("2002-02-27");
 
   return (
-    <div className="flex w-full flex-col items-center gap-8 p-4 pt-24 text-white">
+    <div className="flex w-full flex-col items-center gap-8 p-4 pt-24 text-white gravity-body">
       <div className="flex flex-col items-center justify-center gap-2 p-4 backdrop-blur-sm glass-effect glossy-effect bottom gloss-highlight rounded-lg shadow-lg">
         <Image
           src="/images/ja.avif"

app/layout.tsx

@@ -3,6 +3,7 @@ import { Geist, Geist_Mono } from "next/font/google";
 import "./globals.css";
 import Navbar from "@/components/navbar";
 import Footer from "@/components/footer";
+import GravityToggle from "@/components/gravity-toggle";
 
 const geistSans = Geist({
   variable: "--font-geist-sans",
@@ -98,6 +99,7 @@ export default function RootLayout({
 
         <Navbar />
         {children}
+        <GravityToggle />
         <Footer />
       </body>
     </html>

app/page.tsx

@@ -7,7 +7,7 @@ import { skills, jobs } from "@/lib/data";
 
 export default function Home() {
   return (
-    <div className="flex flex-col items-center w-full">
+    <div className="flex flex-col items-center w-full gravity-body">
       <Hero />
       <div className="container mx-auto px-4">
         <AboutSummary />