ayrisdev/salmakisyatch
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Refactor animation variants and fix JSX text for build stability

Browse Source
This commit is contained in:
ayrisdev
2026-04-14 12:42:58 +03:00
parent 7d51b5eb0b
commit 4ba247e82c
1 changed files with 15 additions and 15 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
app/[locale]/fleet/[slug]/page.tsx
View File

@@ -12,6 +12,16 @@ interface PageProps {
params: Promise<{ locale: string; slug: string }>; 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) { export default function YachtPage({ params }: PageProps) {
const { slug, locale: _locale } = use(params); const { slug, locale: _locale } = use(params);
const yacht = yachts.find((y) => y.slug === slug); const yacht = yachts.find((y) => y.slug === slug);
@@ -50,23 +60,13 @@ export default function YachtPage({ params }: PageProps) {
return null; 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 ( return (
<div className="bg-surface"> <main className="bg-surface min-h-screen">
{/* Editorial Hero Section */} {/* 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 <motion.div
initial={{ scale: 1.1, opacity: 0 }} initial={{ scale: 1.1 }}
animate={{ scale: 1, opacity: 1 }} animate={{ scale: 1 }}
transition={{ duration: 1.5, ease: "easeOut" }} transition={{ duration: 1.5, ease: "easeOut" }}
className="absolute inset-0 z-0" className="absolute inset-0 z-0"
> >
@@ -89,7 +89,7 @@ export default function YachtPage({ params }: PageProps) {
className="flex flex-col items-center" 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"> <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.span>
<motion.h1 variants={fadeInUp} className="text-white font-headline text-5xl md:text-8xl lg:text-9xl mb-4 uppercase tracking-tighter"> <motion.h1 variants={fadeInUp} className="text-white font-headline text-5xl md:text-8xl lg:text-9xl mb-4 uppercase tracking-tighter">
{yacht.name} {yacht.name}