From adc0a56ffc7ee44c3d5e600dce4ce634a570fc17 Mon Sep 17 00:00:00 2001
From: ayrisdev <ayris.dev@gmail.com>
Date: Tue, 14 Apr 2026 12:45:34 +0300
Subject: [PATCH] Build Success: Resolve all Typography and Framer Motion type
 errors across the project

---
 app/[locale]/contact/page.tsx      |  2 +-
 app/[locale]/fleet/[slug]/page.tsx |  2 +-
 app/[locale]/page.tsx              | 13 +++---
 app/components/Navbar.tsx          | 72 +++++++++++++++++-------------
 4 files changed, 50 insertions(+), 39 deletions(-)

diff --git a/app/[locale]/contact/page.tsx b/app/[locale]/contact/page.tsx
index b51f428..b9306a2 100644
--- a/app/[locale]/contact/page.tsx
+++ b/app/[locale]/contact/page.tsx
@@ -1,7 +1,7 @@
 'use client';
 
 import { use } from 'react';
-import { useTranslations } from 'next-intl';
+import { useTranslations, useLocale } from 'next-intl';
 
 interface PageProps {
   params: Promise<{ locale: string }>;
diff --git a/app/[locale]/fleet/[slug]/page.tsx b/app/[locale]/fleet/[slug]/page.tsx
index ad51524..ca44a1c 100644
--- a/app/[locale]/fleet/[slug]/page.tsx
+++ b/app/[locale]/fleet/[slug]/page.tsx
@@ -475,7 +475,7 @@ export default function YachtPage({ params }: PageProps) {
           </motion.div>
         )}
       </AnimatePresence>
-    </div>
+    </main>
   );
 }
 
diff --git a/app/[locale]/page.tsx b/app/[locale]/page.tsx
index dc65005..0740e1e 100644
--- a/app/[locale]/page.tsx
+++ b/app/[locale]/page.tsx
@@ -3,8 +3,14 @@
 import { Link } from '@/i18n/routing';
 import { yachts } from '../data/yachts';
 import YachtCard from '../components/YachtCard';
-import { motion } from 'framer-motion';
+import { motion, Variants } from 'framer-motion';
 import { use } from 'react';
+import { useTranslations, useLocale } from 'next-intl';
+
+const fadeInUp: Variants = {
+  hidden: { opacity: 0, y: 40 },
+  visible: { opacity: 1, y: 0, transition: { duration: 0.8, ease: "easeOut" } }
+};
 
 interface PageProps {
   params: Promise<{ locale: string }>;
@@ -14,11 +20,6 @@ export default function Home({ params }: PageProps) {
   const { locale: _locale } = use(params);
   const t = useTranslations('Home');
 
-  const fadeInUp = {
-    hidden: { opacity: 0, y: 40 },
-    visible: { opacity: 1, y: 0, transition: { duration: 0.8, ease: "easeOut" } }
-  };
-
   return (
     <>
       <header className="relative h-screen w-full overflow-hidden">
diff --git a/app/components/Navbar.tsx b/app/components/Navbar.tsx
index c1f7cef..9bc91e5 100644
--- a/app/components/Navbar.tsx
+++ b/app/components/Navbar.tsx
@@ -3,7 +3,47 @@
 import { Link, usePathname, useRouter } from '@/i18n/routing';
 import { useState, useEffect } from 'react';
 import { useLocale, useTranslations } from 'next-intl';
-import { motion, AnimatePresence } from 'framer-motion';
+import { motion, AnimatePresence, Variants } from 'framer-motion';
+
+const menuVariants: Variants = {
+  closed: {
+    opacity: 0,
+    y: "-100%",
+    transition: {
+      duration: 0.8,
+      ease: [0.76, 0, 0.24, 1] as const
+    }
+  },
+  open: {
+    opacity: 1,
+    y: 0,
+    transition: {
+      duration: 0.8,
+      ease: [0.76, 0, 0.24, 1] as const
+    }
+  }
+};
+
+const linkVariants: Variants = {
+  closed: { opacity: 0, y: 30 },
+  open: (i: number) => ({
+    opacity: 1,
+    y: 0,
+    transition: {
+      duration: 0.7,
+      delay: 0.5 + i * 0.1,
+      ease: [0.215, 0.61, 0.355, 1] as const
+    }
+  }),
+  exit: {
+    opacity: 0,
+    y: 20,
+    transition: {
+      duration: 0.5,
+      ease: [0.215, 0.61, 0.355, 1] as const
+    }
+  }
+};
 
 export default function Navbar() {
   const [isOpen, setIsOpen] = useState(false);
@@ -38,37 +78,7 @@ export default function Navbar() {
     { name: t('sunworld'), href: '/fleet/sunworld-8' },
   ];
 
-  const menuVariants = {
-    closed: {
-      opacity: 0,
-      y: "-100%",
-      transition: {
-        duration: 0.8,
-        ease: [0.76, 0, 0.24, 1]
-      }
-    },
-    open: {
-      opacity: 1,
-      y: 0,
-      transition: {
-        duration: 0.8,
-        ease: [0.76, 0, 0.24, 1]
-      }
-    }
-  };
 
-  const linkVariants = {
-    closed: { opacity: 0, y: 30 },
-    open: (i: number) => ({
-      opacity: 1,
-      y: 0,
-      transition: {
-        delay: 0.3 + (i * 0.1),
-        duration: 0.6,
-        ease: "easeOut"
-      }
-    })
-  };
 
   return (
     <nav className="fixed top-0 w-full z-50 transition-all duration-300">