feat: Add social proof sections to homepage

- Add TrustBadges component with ratings, customer count, secure payment icons
- Add AsSeenIn media logos banner
- Add BeforeAfterGallery with interactive gallery
- Add TestimonialsSection (already existed, now integrated into homepage)
- Connect all sections in homepage page.tsx

Sections added to homepage flow:
1. HeroVideo
2. TrustBadges
3. AsSeenIn
4. Products Grid
5. BeforeAfterGallery
6. Brand Story
7. Benefits
8. TestimonialsSection
9. Newsletter
This commit is contained in:
Unchained
2026-03-21 18:58:33 +02:00
parent 26212dec1c
commit d381cba302
4 changed files with 266 additions and 0 deletions

View File

@@ -3,6 +3,10 @@ import Header from "@/components/layout/Header";
import Footer from "@/components/layout/Footer";
import HeroVideo from "@/components/home/HeroVideo";
import ProductCard from "@/components/product/ProductCard";
import TrustBadges from "@/components/home/TrustBadges";
import AsSeenIn from "@/components/home/AsSeenIn";
import TestimonialsSection from "@/components/home/TestimonialsSection";
import BeforeAfterGallery from "@/components/home/BeforeAfterGallery";
export const metadata = {
title: "ManoonOils - Premium Natural Oils for Hair & Skin",
@@ -30,6 +34,12 @@ export default async function Homepage() {
{/* Hero Section with Video Background */}
<HeroVideo />
{/* Trust Badges */}
<TrustBadges />
{/* As Seen In */}
<AsSeenIn />
{/* Main Content */}
<div id="main-content" className="scroll-mt-[72px] lg:scroll-mt-[72px]">
{/* Products Grid Section */}
@@ -69,6 +79,9 @@ export default async function Homepage() {
</section>
)}
{/* Before/After Gallery */}
<BeforeAfterGallery />
{/* Brand Story Section */}
<section className="py-24 px-4 sm:px-6 lg:px-8 bg-[#f8f9fa]">
<div className="max-w-7xl mx-auto">
@@ -148,6 +161,9 @@ export default async function Homepage() {
</div>
</section>
{/* Testimonials Section */}
<TestimonialsSection />
{/* Newsletter Section */}
<section className="py-28 lg:py-32 px-4 sm:px-6 lg:px-8 bg-[#1a1a1a] text-white">
<div className="max-w-7xl mx-auto">