Refactor animation variants and fix JSX text for build stability

This commit is contained in:
2026-04-14 12:42:58 +03:00
parent 7d51b5eb0b
commit 4ba247e82c

View File

@@ -12,6 +12,16 @@ interface PageProps {
params: Promise<{ locale: string; slug: string }>;
}
const fadeInUp: Variants = {
hidden: { opacity: 0, y: 40 },
visible: { opacity: 1, y: 0, transition: { duration: 0.8, ease: "easeOut" } }
};
const staggerContainer: Variants = {
hidden: { opacity: 0 },
visible: { opacity: 1, transition: { staggerChildren: 0.15 } }
};
export default function YachtPage({ params }: PageProps) {
const { slug, locale: _locale } = use(params);
const yacht = yachts.find((y) => y.slug === slug);
@@ -50,23 +60,13 @@ export default function YachtPage({ params }: PageProps) {
return null;
}
const fadeInUp: Variants = {
hidden: { opacity: 0, y: 40 },
visible: { opacity: 1, y: 0, transition: { duration: 0.8, ease: "easeOut" } }
};
const staggerContainer: Variants = {
hidden: { opacity: 0 },
visible: { opacity: 1, transition: { staggerChildren: 0.15 } }
};
return (
<div className="bg-surface">
<main className="bg-surface min-h-screen">
{/* Editorial Hero Section */}
<section className="relative h-[90vh] md:h-screen w-full overflow-hidden">
<section className="relative h-[70vh] md:h-[90vh] w-full overflow-hidden">
<motion.div
initial={{ scale: 1.1, opacity: 0 }}
animate={{ scale: 1, opacity: 1 }}
initial={{ scale: 1.1 }}
animate={{ scale: 1 }}
transition={{ duration: 1.5, ease: "easeOut" }}
className="absolute inset-0 z-0"
>
@@ -89,7 +89,7 @@ export default function YachtPage({ params }: PageProps) {
className="flex flex-col items-center"
>
<motion.span variants={fadeInUp} className="font-label text-[10px] md:text-xs tracking-[0.5em] text-secondary uppercase mb-6">
The Fleet Collection
{"The Fleet Collection"}
</motion.span>
<motion.h1 variants={fadeInUp} className="text-white font-headline text-5xl md:text-8xl lg:text-9xl mb-4 uppercase tracking-tighter">
{yacht.name}