bender/7227b6e0-b0a2-4e28-96c6-77c845beb6b4
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge version_2 into main #1

Merged
bender merged 2 commits from version_2 into main 2026-04-17 05:06:34 +00:00
Conversation 0 Commits 2 Files Changed 2 +40 -305
2 changed files with 40 additions and 305 deletions
Download Patch File Download Diff File Expand all files Collapse all files

333
src/app/page.tsx
View File

@@ -2,16 +2,16 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FaqBase from '@/components/sections/faq/FaqBase';
import FeatureCardTwentyNine from '@/components/sections/feature/featureCardTwentyNine/FeatureCardTwentyNine';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import HeroSplitTestimonial from '@/components/sections/hero/HeroSplitTestimonial';
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import ProductCardFour from '@/components/sections/product/ProductCardFour';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
export default function LandingPage() {
return (
@@ -21,10 +21,10 @@ export default function LandingPage() {
borderRadius="pill"
contentWidth="mediumSmall"
sizing="mediumLargeSizeLargeTitles"
background="noise"
cardStyle="solid"
primaryButtonStyle="double-inset"
secondaryButtonStyle="layered"
background="none"
cardStyle="outline"
primaryButtonStyle="flat"
secondaryButtonStyle="solid"
headingFontWeight="normal"
>
<ReactLenis root>
@@ -32,21 +32,13 @@ export default function LandingPage() {
<NavbarStyleCentered
navItems={[
{
name: "Home",
id: "hero",
},
name: "Home", id: "hero"},
{
name: "About",
id: "about",
},
name: "About", id: "about"},
{
name: "Shop",
id: "products",
},
name: "Shop", id: "products"},
{
name: "Contact",
id: "contact",
},
name: "Contact", id: "contact"},
]}
brandName="MODA"
/>
@@ -56,101 +48,21 @@ export default function LandingPage() {
<HeroSplitTestimonial
useInvertedBackground={false}
background={{
variant: "plain",
}}
variant: "plain"}}
title="Timeless Style for Modern Living"
description="Discover our latest collection of premium clothing, designed for comfort and crafted with sustainability in mind."
testimonials={[
{
name: "Alex R.",
handle: "@alexr",
testimonial: "The best quality clothes I've ever bought online.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/fashionable-portrait-slender-blonde-with-long-hair-light-blue-dress-corduroy-shirt_343596-3370.jpg",
},
{
name: "Sam K.",
handle: "@samk",
testimonial: "So comfortable and stylish for every occasion.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/stylish-woman-having-happy-excited-smile-while-standing-fashionable-summer-clothes-enjoying-sale-prices-shopping-city-mall-style-fashion-consumerism-purchase-concept_273609-820.jpg",
},
{
name: "Jamie T.",
handle: "@jamiet",
testimonial: "Sustainable and chic. My new favorite shop.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-handsome-smiling-young-man-model-wearing-casual-summer-pink-clothes-fashion-stylish-man-posing-round-sunglasses_158538-5339.jpg",
},
{
name: "Riley P.",
handle: "@rileyp",
testimonial: "Customer service was amazing and shipping was fast.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/woman-taking-break-from-gardening_23-2148851408.jpg",
},
{
name: "Casey L.",
handle: "@caseyl",
testimonial: "Finally, a brand that cares about fit and fabric.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/short-haired-curly-woman-with-stylish-bright-glasses-red-shirt-with-long-sleeve-smiles-isolated-lilac_197531-19272.jpg",
},
name: "Alex R.", handle: "@alexr", testimonial: "The best quality clothes I've ever bought online.", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/fashionable-portrait-slender-blonde-with-long-hair-light-blue-dress-corduroy-shirt_343596-3370.jpg"},
]}
buttons={[
{
text: "Shop Collection",
href: "#products",
},
text: "Shop Collection", href: "#products"},
]}
imageSrc="http://img.b2bpic.net/free-photo/portrait-beautiful-fashionable-model-with-natural-blond-hair-posing-red-background-close-up-studio-shot-silk-cocktail-dress_639032-817.jpg"
imageAlt="Model wearing modern clothing"
mediaAnimation="slide-up"
avatars={[
{
src: "http://img.b2bpic.net/free-photo/young-brunette-woman-wearing-white-poloneck-attractive-girl-model-fashion_1139-1613.jpg",
alt: "Model wearing white",
},
{
src: "http://img.b2bpic.net/free-photo/portrait-beautiful-fashionable-model-with-natural-blond-hair-posing-red-background-close-up-studio-shot-silk-cocktail-dress-side-view_639032-823.jpg",
alt: "Model in red background",
},
{
src: "http://img.b2bpic.net/free-photo/beautiful-fashion-model-with-bob-hair-confidently-posing-camera-white-background-model-working-studio_574295-4506.jpg",
alt: "Model posing white",
},
{
src: "http://img.b2bpic.net/free-photo/beautiful-woman-with-trendy-hairstyle_23-2149405998.jpg",
alt: "Model hairstyle portrait",
},
{
src: "http://img.b2bpic.net/free-photo/handsome-man-looking-camera_197531-33408.jpg",
alt: "Man portrait",
},
]}
avatarText="Join our community of over 10,000 satisfied shoppers."
marqueeItems={[
{
type: "text",
text: "Sustainable",
},
{
type: "text",
text: "Ethical",
},
{
type: "text",
text: "Premium",
},
{
type: "text",
text: "Durable",
},
{
type: "text",
text: "Timeless",
},
]}
/>
</div>
@@ -159,24 +71,11 @@ export default function LandingPage() {
useInvertedBackground={false}
heading={[
{
type: "text",
content: "Crafted with Purpose",
},
{
type: "image",
src: "http://img.b2bpic.net/free-photo/man-manufacturing-clothes-medium-shot_23-2149007432.jpg",
alt: "Craftmanship",
},
{
type: "text",
content: "for You",
},
type: "text", content: "Crafted with Purpose"},
]}
buttons={[
{
text: "Our Story",
href: "#",
},
text: "Our Story", href: "#"},
]}
/>
</div>
@@ -189,26 +88,7 @@ export default function LandingPage() {
useInvertedBackground={false}
features={[
{
title: "Organic Cotton",
description: "Soft on skin and the planet.",
imageSrc: "http://img.b2bpic.net/free-photo/fast-fashion-vs-slow-sustainable-fashion_23-2149134025.jpg",
titleImageSrc: "http://img.b2bpic.net/free-photo/spring-wardrobe-switch-top-view_23-2150264138.jpg",
buttonText: "Learn More",
},
{
title: "Fair Trade",
description: "Supporting workers worldwide.",
imageSrc: "http://img.b2bpic.net/free-photo/model-details-wearing-blue-denim-jacket_150588-20.jpg",
titleImageSrc: "http://img.b2bpic.net/free-photo/woman-with-flowers-jacket-spreading-hands_23-2148098447.jpg",
buttonText: "Learn More",
},
{
title: "Durable Design",
description: "Clothes built to last seasons.",
imageSrc: "http://img.b2bpic.net/free-photo/elegance-blonde-girl-fur-coat-store-fur-coats-leather-jackets_627829-8480.jpg",
titleImageSrc: "http://img.b2bpic.net/free-photo/empty-clothing-store-mall_482257-91309.jpg",
buttonText: "Learn More",
},
title: "Organic Cotton", description: "Soft on skin and the planet.", imageSrc: "http://img.b2bpic.net/free-photo/fast-fashion-vs-slow-sustainable-fashion_23-2149134025.jpg", titleImageSrc: "http://img.b2bpic.net/free-photo/spring-wardrobe-switch-top-view_23-2150264138.jpg", buttonText: "Learn More"},
]}
title="Why Choose MODA?"
description="We prioritize quality materials and ethical manufacturing."
@@ -223,47 +103,7 @@ export default function LandingPage() {
useInvertedBackground={false}
products={[
{
id: "1",
name: "Basic Tee",
price: "$29",
variant: "Cotton",
imageSrc: "http://img.b2bpic.net/free-photo/side-view-fashionable-beautiful-woman-shirt-holding-want-buying-elegant-red-dress-brunette-girl-with-long-hair-choosing-look-evening-spanding-time-shoppinh-mall_132075-12220.jpg",
},
{
id: "2",
name: "Denim Jacket",
price: "$89",
variant: "Denim",
imageSrc: "http://img.b2bpic.net/free-photo/sad-contemplative-woman-sitting-by-lake_23-2150516215.jpg",
},
{
id: "3",
name: "Summer Dress",
price: "$69",
variant: "Linen",
imageSrc: "http://img.b2bpic.net/free-photo/full-length-shot-curly-woman-beige-long-trench-red-beret-posing-cafe_197531-16925.jpg",
},
{
id: "4",
name: "Graphic Hoodie",
price: "$59",
variant: "Cotton",
imageSrc: "http://img.b2bpic.net/free-photo/fascinating-brunette-woman-straw-hat-chilling-home-cozy-boho-interior_273443-1394.jpg",
},
{
id: "5",
name: "Slim Fit Jeans",
price: "$79",
variant: "Denim",
imageSrc: "http://img.b2bpic.net/free-photo/blue-jeans-fabric-details_150588-31.jpg",
},
{
id: "6",
name: "Minimalist Scarf",
price: "$39",
variant: "Wool",
imageSrc: "http://img.b2bpic.net/free-photo/happy-father-s-day-composition-father-s-day-top-view_185193-109523.jpg",
},
id: "1", name: "Basic Tee", price: "$29", variant: "Cotton", imageSrc: "http://img.b2bpic.net/free-photo/side-view-fashionable-beautiful-woman-shirt-holding-want-buying-elegant-red-dress-brunette-girl-with-long-hair-choosing-look-evening-spanding-time-shoppinh-mall_132075-12220.jpg"},
]}
title="Our Latest Arrivals"
description="Explore the freshest looks for the new season."
@@ -271,55 +111,16 @@ export default function LandingPage() {
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardThirteen
<TestimonialCardTwelve
animationType="slide-up"
textboxLayout="default"
cardAnimation="slide-up"
useInvertedBackground={false}
testimonials={[
{
id: "1",
name: "Sarah J.",
handle: "@sarahj",
testimonial: "I love the fit of every piece I've bought.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/closeup-portrait-cheerful-young-hipster-guy-with-dreads-smiling-optimistic-delighted-standing_1258-109146.jpg",
},
{
id: "2",
name: "Mark D.",
handle: "@markd",
testimonial: "Simple, elegant, and timeless.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/pretty-tanned-woman-pink-white-outfit-leans-chair-umbrella-street-cafe_197531-17041.jpg",
},
{
id: "3",
name: "Lisa B.",
handle: "@lisab",
testimonial: "Finally, sustainable fashion that looks great.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/dreamy-girl-with-drink-bags_23-2147652079.jpg",
},
{
id: "4",
name: "David P.",
handle: "@davidp",
testimonial: "Will be shopping here again soon.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/pretty-shopper-street_23-2147652063.jpg",
},
{
id: "5",
name: "Elena R.",
handle: "@elenar",
testimonial: "Quality that really stands the test of time.",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/friends-shopping-second-hand-market_23-2149353740.jpg",
},
id: "1", name: "Sarah J.", imageSrc: "http://img.b2bpic.net/free-photo/closeup-portrait-cheerful-young-hipster-guy-with-dreads-smiling-optimistic-delighted-standing_1258-109146.jpg"},
]}
showRating={true}
title="What Our Customers Say"
description="Authentic feedback from our community."
cardTitle="What Our Customers Say"
cardTag="Testimonials"
/>
</div>
@@ -328,14 +129,7 @@ export default function LandingPage() {
textboxLayout="default"
useInvertedBackground={false}
names={[
"Vogue",
"GQ",
"Harper's Bazaar",
"Elle",
"Cosmopolitan",
"InStyle",
"Glamour",
]}
"Vogue", "GQ"]}
title="As Featured In"
description="Industry leaders in fashion innovation."
/>
@@ -347,20 +141,7 @@ export default function LandingPage() {
useInvertedBackground={false}
faqs={[
{
id: "1",
title: "What is your return policy?",
content: "You can return items within 30 days of purchase.",
},
{
id: "2",
title: "Do you ship worldwide?",
content: "Yes, we ship to over 100 countries globally.",
},
{
id: "3",
title: "Are your materials sustainable?",
content: "Yes, we use 100% GOTS certified organic cotton.",
},
id: "1", title: "What is your return policy?", content: "You can return items within 30 days of purchase."},
]}
title="Frequently Asked Questions"
description="Common questions about our products and policies."
@@ -369,67 +150,21 @@ export default function LandingPage() {
</div>
<div id="contact" data-section="contact">
<ContactSplitForm
useInvertedBackground={false}
<ContactSplit
title="Get In Touch"
description="We'd love to hear from you. Drop us a line."
inputs={[
{
name: "name",
type: "text",
placeholder: "Name",
},
{
name: "email",
type: "email",
placeholder: "Email",
},
]}
imageSrc="http://img.b2bpic.net/free-photo/studio-fashion-designers_1098-13784.jpg"
tag="Contact"
useInvertedBackground={false}
mediaAnimation="slide-up"
mediaPosition="right"
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoEmphasis
columns={[
{
items: [
{
label: "About Us",
href: "#about",
},
{
label: "Products",
href: "#products",
},
],
},
{
items: [
{
label: "FAQ",
href: "#faq",
},
{
label: "Contact",
href: "#contact",
},
],
},
{
items: [
{
label: "Terms",
href: "#",
},
{
label: "Privacy",
href: "#",
},
],
},
]}
<FooterLogoReveal
logoText="MODA"
leftLink={{ text: "Privacy", href: "#" }}
rightLink={{ text: "Terms", href: "#" }}
/>
</div>
</ReactLenis>

12
src/app/styles/variables.css
View File

@@ -10,15 +10,15 @@
--accent: #ffffff;
--background-accent: #ffffff; */
--background: #f5f5f5;
--background: #ffffff;
--card: #ffffff;
--foreground: #1c1c1c;
--primary-cta: #1c1c1c;
--foreground: #000000;
--primary-cta: #000000;
--primary-cta-text: #f5f5f5;
--secondary-cta: #ffffff;
--secondary-cta: #f0f0f0;
--secondary-cta-text: #1c1c1c;
--accent: #159c49;
--background-accent: #a8e8ba;
--accent: #e0e0e0;
--background-accent: #f5f5f5;
/* text sizing - set by ThemeProvider */
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);