Merge version_7 into main
Merge version_7 into main
This commit was merged in pull request #6.
This commit is contained in:
@@ -162,4 +162,4 @@ export default function BlogPage() {
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -1237,4 +1237,4 @@ export default function RootLayout({
|
||||
</body>
|
||||
</html>
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -12,8 +12,42 @@ import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
|
||||
import ContactFaq from '@/components/sections/contact/ContactFaq';
|
||||
import FooterMedia from '@/components/sections/footer/FooterMedia';
|
||||
import { Award, Dumbbell, Phone, Trophy, Zap } from "lucide-react";
|
||||
import { useEffect, useRef } from "react";
|
||||
|
||||
export default function LandingPage() {
|
||||
const brandListRef = useRef<HTMLDivElement>(null);
|
||||
|
||||
useEffect(() => {
|
||||
if (!brandListRef.current) return;
|
||||
|
||||
const scrollContainer = brandListRef.current.querySelector('.brand-scroll-container') as HTMLElement;
|
||||
if (!scrollContainer) return;
|
||||
|
||||
const items = scrollContainer.querySelectorAll('.brand-item');
|
||||
const itemCount = items.length;
|
||||
if (itemCount === 0) return;
|
||||
|
||||
let scrollPosition = 0;
|
||||
const itemWidth = (items[0] as HTMLElement).offsetWidth + 32; // includes gap
|
||||
const containerWidth = scrollContainer.offsetWidth;
|
||||
const totalWidth = itemWidth * itemCount;
|
||||
|
||||
const animateScroll = () => {
|
||||
scrollPosition += 1;
|
||||
if (scrollPosition >= totalWidth / 2) {
|
||||
scrollPosition = 0;
|
||||
}
|
||||
scrollContainer.scrollLeft = scrollPosition;
|
||||
requestAnimationFrame(animateScroll);
|
||||
};
|
||||
|
||||
animateScroll();
|
||||
}, []);
|
||||
|
||||
const brands = [
|
||||
"Gold's Gym Partners", "Fitness Canada Certified", "NASM Certified", "ACE Certified", "ISSA Certified", "IIFYM Certified", "PN Level 1 Certified", "TRX Certified", "CrossFit Level 1", "NCCPT Certified"
|
||||
];
|
||||
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="directional-hover"
|
||||
@@ -72,16 +106,23 @@ export default function LandingPage() {
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="logo-ribbon" data-section="logo-ribbon" className="py-2 px-4 bg-background">
|
||||
<div id="logo-ribbon" data-section="logo-ribbon" className="py-8 px-4 bg-background" ref={brandListRef}>
|
||||
<div className="w-content-width mx-auto">
|
||||
<div className="flex flex-col items-center justify-center gap-8">
|
||||
<h3 className="text-center text-lg font-semibold text-foreground">Trusted by Leading Fitness Brands</h3>
|
||||
<div className="flex flex-wrap justify-center items-center gap-8 md:gap-12">
|
||||
<div className="flex items-center justify-center h-12 min-w-32 text-foreground/60 font-medium text-sm">Gold's Gym Partners</div>
|
||||
<div className="flex items-center justify-center h-12 min-w-32 text-foreground/60 font-medium text-sm">Fitness Canada Certified</div>
|
||||
<div className="flex items-center justify-center h-12 min-w-32 text-foreground/60 font-medium text-sm">NASM Certified</div>
|
||||
<div className="flex items-center justify-center h-12 min-w-32 text-foreground/60 font-medium text-sm">ACE Certified</div>
|
||||
<div className="flex items-center justify-center h-12 min-w-32 text-foreground/60 font-medium text-sm">ISSA Certified</div>
|
||||
<div className="brand-scroll-container w-full overflow-x-hidden">
|
||||
<div className="flex gap-8 md:gap-12 whitespace-nowrap">
|
||||
{brands.map((brand, index) => (
|
||||
<div key={`${index}-1`} className="brand-item flex items-center justify-center h-12 min-w-max px-4 text-foreground/60 font-medium text-sm flex-shrink-0">
|
||||
{brand}
|
||||
</div>
|
||||
))}
|
||||
{brands.map((brand, index) => (
|
||||
<div key={`${index}-2`} className="brand-item flex items-center justify-center h-12 min-w-max px-4 text-foreground/60 font-medium text-sm flex-shrink-0">
|
||||
{brand}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -305,4 +346,4 @@ export default function LandingPage() {
|
||||
</div>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user