bender/9add1df6-2905-473e-ae90-c15bc9e7d534
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge version_2 into main #3

Merged
bender merged 7 commits from version_2 into main 2026-03-05 13:08:05 +00:00
Conversation 0 Commits 7 Files Changed 7 +435 -212
7 changed files with 435 additions and 212 deletions
Download Patch File Download Diff File Expand all files Collapse all files

85
src/app/about/page.tsx Normal file
View File

@@ -0,0 +1,85 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
import { HeroSplit } from "@/components/sections/hero/HeroSplit";
import FooterCard from "@/components/sections/footer/FooterCard";
import { Instagram, Facebook, Twitter, Linkedin, Info } from "lucide-react";
export default function AboutPage() {
const navItems = [
{ name: "Shop", id: "/products" },
{ name: "Collections", id: "/collections" },
{ name: "About", id: "/about" },
{ name: "Support", id: "/support" },
{ name: "Contact", id: "/contact" },
];
return (
<ThemeProvider
defaultButtonVariant="text-stagger"
defaultTextAnimation="background-highlight"
borderRadius="pill"
contentWidth="mediumSmall"
sizing="mediumSizeLargeTitles"
background="circleGradient"
cardStyle="glass-elevated"
primaryButtonStyle="diagonal-gradient"
secondaryButtonStyle="layered"
headingFontWeight="medium"
>
<div id="nav" data-section="nav">
<NavbarStyleFullscreen
navItems={navItems}
brandName="Femme Couture"
bottomLeftText="Premium Women's Fashion"
bottomRightText="support@femmecouture.com"
/>
</div>
<div id="about" data-section="about">
<HeroSplit
title="About Femme Couture"
description="We are dedicated to providing premium women's fashion with unique design and exceptional quality. Our mission is to empower women through stylish, comfortable, and sustainably crafted clothing that celebrates individuality and confidence."
tag="Our Story"
tagIcon={Info}
tagAnimation="slide-up"
background={{ variant: "radial-gradient" }}
imageSrc="http://img.b2bpic.net/free-photo/beautiful-woman-outside-street_1303-14337.jpg"
imageAlt="Femme Couture story"
imagePosition="right"
mediaAnimation="slide-up"
buttons={[
{ text: "Shop Our Collection", href: "/products" },
]}
buttonAnimation="slide-up"
/>
</div>
<div id="footer" data-section="footer">
<FooterCard
logoText="Femme Couture"
copyrightText="© 2025 Femme Couture. All rights reserved. Crafted with elegance."
socialLinks={[
{
icon: Instagram,
href: "https://instagram.com/femmecouture", ariaLabel: "Instagram"
},
{
icon: Facebook,
href: "https://facebook.com/femmecouture", ariaLabel: "Facebook"
},
{
icon: Twitter,
href: "https://twitter.com/femmecouture", ariaLabel: "Twitter"
},
{
icon: Linkedin,
href: "https://linkedin.com/company/femmecouture", ariaLabel: "LinkedIn"
},
]}
/>
</div>
</ThemeProvider>
);
}

56
src/app/collections/page.tsx
View File

@@ -22,7 +22,7 @@ export default function CollectionsPage() {
borderRadius="pill"
contentWidth="mediumSmall"
sizing="mediumSizeLargeTitles"
background="noise"
background="circleGradient"
cardStyle="glass-elevated"
primaryButtonStyle="diagonal-gradient"
secondaryButtonStyle="layered"
@@ -37,45 +37,35 @@ export default function CollectionsPage() {
/>
</div>
<div id="collections-view" data-section="collections-view">
<div id="collections" data-section="collections" className="py-20">
<FeatureCardThree
title="Explore Our Collections"
description="Discover curated collections tailored to every style, occasion, and season. Each collection is carefully crafted to offer the best quality and trends."
tag="Collections"
title="Browse Collections"
description="Explore our diverse range of styles tailored for every occasion and preference."
tag="All Collections"
tagIcon={Palette}
textboxLayout="default"
useInvertedBackground={false}
features={[
{
id: "01",
title: "Casual Wear",
description: "Comfortable everyday styles perfect for work, shopping, and relaxation",
imageSrc: "http://img.b2bpic.net/free-photo/pretty-young-woman-outdoor_624325-645.jpg?_wi=2",
imageAlt: "Casual wear collection",
id: "01", title: "Casual Wear", description: "Comfortable everyday styles perfect for work, shopping, and relaxation", imageSrc: "http://img.b2bpic.net/free-photo/pretty-young-woman-outdoor_624325-645.jpg", imageAlt: "Casual wear collection"
},
{
id: "02",
title: "Formal Dresses",
description: "Elegant formal wear for special occasions, weddings, and evening events",
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-woman-fancy-dress-walking-down-street-fashion-beauty-makeup-evening-dress-smiling-girl-posing-model-luxury-wearing-accessories-blonde-volume-hair-lipstick-eyes-perfect_343629-184.jpg?_wi=2",
imageAlt: "Formal dress collection",
id: "02", title: "Formal Dresses", description: "Elegant formal wear for special occasions, weddings, and evening events", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-woman-fancy-dress-walking-down-street-fashion-beauty-makeup-evening-dress-smiling-girl-posing-model-luxury-wearing-accessories-blonde-volume-hair-lipstick-eyes-perfect_343629-184.jpg", imageAlt: "Formal dress collection"
},
{
id: "03",
title: "Active & Sports",
description: "Performance-driven activewear for gym, yoga, and outdoor activities",
imageSrc: "http://img.b2bpic.net/free-photo/female-sitting-studio-near-gray-wall_158538-3587.jpg?_wi=2",
imageAlt: "Active and sports wear",
id: "03", title: "Active & Sports", description: "Performance-driven activewear for gym, yoga, and outdoor activities", imageSrc: "http://img.b2bpic.net/free-photo/female-sitting-studio-near-gray-wall_158538-3587.jpg", imageAlt: "Active and sports wear"
},
{
id: "04",
title: "Accessories",
description: "Complete your look with premium bags, belts, scarves, and jewelry",
imageSrc: "http://img.b2bpic.net/free-photo/view-women-bag-stuff_93675-131548.jpg?_wi=2",
imageAlt: "Fashion accessories collection",
id: "04", title: "Accessories", description: "Complete your look with premium bags, belts, scarves, and jewelry", imageSrc: "http://img.b2bpic.net/free-photo/view-women-bag-stuff_93675-131548.jpg", imageAlt: "Fashion accessories collection"
},
{
id: "05", title: "Seasonal Trends", description: "Latest seasonal collections featuring current fashion trends and styles", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-young-woman-wearing-fashionable-clothes-walking-down-street_839833-3813.jpg", imageAlt: "Seasonal trends collection"
},
{
id: "06", title: "Premium Collection", description: "Luxury items curated for the most discerning fashion enthusiasts", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-woman-evening-dress-sitting-chair_285396-7788.jpg", imageAlt: "Premium collection"
},
]}
gridVariant="four-items-2x2-equal-grid"
gridVariant="bento-grid"
animationType="slide-up"
carouselMode="buttons"
/>
@@ -88,27 +78,23 @@ export default function CollectionsPage() {
socialLinks={[
{
icon: Instagram,
href: "https://instagram.com/femmecouture",
ariaLabel: "Instagram",
href: "https://instagram.com/femmecouture", ariaLabel: "Instagram"
},
{
icon: Facebook,
href: "https://facebook.com/femmecouture",
ariaLabel: "Facebook",
href: "https://facebook.com/femmecouture", ariaLabel: "Facebook"
},
{
icon: Twitter,
href: "https://twitter.com/femmecouture",
ariaLabel: "Twitter",
href: "https://twitter.com/femmecouture", ariaLabel: "Twitter"
},
{
icon: Linkedin,
href: "https://linkedin.com/company/femmecouture",
ariaLabel: "LinkedIn",
href: "https://linkedin.com/company/femmecouture", ariaLabel: "LinkedIn"
},
]}
/>
</div>
</ThemeProvider>
);
}
}

171
src/app/contact/page.tsx
View File

@@ -3,9 +3,9 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
import ContactText from "@/components/sections/contact/ContactText";
import FaqSplitText from "@/components/sections/faq/FaqSplitText";
import FooterCard from "@/components/sections/footer/FooterCard";
import { Instagram, Facebook, Twitter, Linkedin } from "lucide-react";
import { Instagram, Facebook, Twitter, Linkedin, Mail } from "lucide-react";
import { useState } from "react";
export default function ContactPage() {
const navItems = [
@@ -16,6 +16,17 @@ export default function ContactPage() {
{ name: "Contact", id: "/contact" },
];
const [formData, setFormData] = useState({
name: "", email: "", subject: "", message: ""});
const handleSubmit = (e: React.FormEvent) => {
e.preventDefault();
console.log("Form submitted:", formData);
// Here you would typically send the form data to a backend
alert("Thank you for your message! We'll get back to you soon.");
setFormData({ name: "", email: "", subject: "", message: "" });
};
return (
<ThemeProvider
defaultButtonVariant="text-stagger"
@@ -23,7 +34,7 @@ export default function ContactPage() {
borderRadius="pill"
contentWidth="mediumSmall"
sizing="mediumSizeLargeTitles"
background="noise"
background="circleGradient"
cardStyle="glass-elevated"
primaryButtonStyle="diagonal-gradient"
secondaryButtonStyle="layered"
@@ -38,46 +49,126 @@ export default function ContactPage() {
/>
</div>
<div id="contact" data-section="contact">
<div id="contact" data-section="contact" className="py-20">
<div className="mx-auto max-w-4xl px-4 md:px-8">
<div className="mb-12 text-center">
<h1 className="text-5xl md:text-6xl font-bold mb-4">Get in Touch</h1>
<p className="text-lg md:text-xl text-foreground/70 mb-8">
Have questions? We'd love to hear from you. Send us a message and we'll respond as soon as possible.
</p>
</div>
<div className="grid md:grid-cols-2 gap-12 mb-12">
<div className="bg-card rounded-lg p-8">
<h2 className="text-2xl font-bold mb-4">Contact Information</h2>
<div className="space-y-6">
<div>
<h3 className="font-semibold mb-2">Email</h3>
<p className="text-foreground/70">support@femmecouture.com</p>
</div>
<div>
<h3 className="font-semibold mb-2">Phone</h3>
<p className="text-foreground/70">+1 (555) 123-4567</p>
</div>
<div>
<h3 className="font-semibold mb-2">Address</h3>
<p className="text-foreground/70">
123 Fashion Street<br />
New York, NY 10001<br />
United States
</p>
</div>
<div>
<h3 className="font-semibold mb-2">Hours</h3>
<p className="text-foreground/70">
Monday - Friday: 9:00 AM - 6:00 PM EST<br />
Saturday: 10:00 AM - 4:00 PM EST<br />
Sunday: Closed
</p>
</div>
<div>
<h3 className="font-semibold mb-4">Follow Us</h3>
<div className="flex gap-4">
<a href="https://instagram.com/femmecouture" target="_blank" rel="noopener noreferrer" className="text-primary-cta hover:opacity-70">
<Instagram size={24} />
</a>
<a href="https://facebook.com/femmecouture" target="_blank" rel="noopener noreferrer" className="text-primary-cta hover:opacity-70">
<Facebook size={24} />
</a>
<a href="https://twitter.com/femmecouture" target="_blank" rel="noopener noreferrer" className="text-primary-cta hover:opacity-70">
<Twitter size={24} />
</a>
</div>
</div>
</div>
</div>
<div className="bg-card rounded-lg p-8">
<h2 className="text-2xl font-bold mb-6">Send us a Message</h2>
<form onSubmit={handleSubmit} className="space-y-4">
<div>
<label className="block text-sm font-medium mb-2">Name</label>
<input
type="text"
value={formData.name}
onChange={(e) => setFormData({ ...formData, name: e.target.value })}
className="w-full px-4 py-2 bg-background border border-accent rounded-lg focus:outline-none focus:ring-2 focus:ring-primary-cta"
required
/>
</div>
<div>
<label className="block text-sm font-medium mb-2">Email</label>
<input
type="email"
value={formData.email}
onChange={(e) => setFormData({ ...formData, email: e.target.value })}
className="w-full px-4 py-2 bg-background border border-accent rounded-lg focus:outline-none focus:ring-2 focus:ring-primary-cta"
required
/>
</div>
<div>
<label className="block text-sm font-medium mb-2">Subject</label>
<input
type="text"
value={formData.subject}
onChange={(e) => setFormData({ ...formData, subject: e.target.value })}
className="w-full px-4 py-2 bg-background border border-accent rounded-lg focus:outline-none focus:ring-2 focus:ring-primary-cta"
required
/>
</div>
<div>
<label className="block text-sm font-medium mb-2">Message</label>
<textarea
value={formData.message}
onChange={(e) => setFormData({ ...formData, message: e.target.value })}
className="w-full px-4 py-2 bg-background border border-accent rounded-lg focus:outline-none focus:ring-2 focus:ring-primary-cta h-32 resize-none"
required
/>
</div>
<button
type="submit"
className="w-full bg-primary-cta text-primary-cta-text py-3 rounded-lg font-semibold hover:opacity-90 transition-opacity"
>
Send Message
</button>
</form>
</div>
</div>
</div>
</div>
<div id="contact-section" data-section="contact-section">
<ContactText
text="Have a question about our products or services? We're here to help! Reach out to our dedicated support team and we'll get back to you as soon as possible."
text="Thank you for choosing Femme Couture! We're committed to providing exceptional customer service and premium fashion. Your satisfaction is our priority."
animationType="entrance-slide"
background={{ variant: "plain" }}
useInvertedBackground={true}
buttons={[
{ text: "Email Support", href: "mailto:support@femmecouture.com" },
{ text: "Back to Shop", href: "/products" },
]}
/>
</div>
<div id="support" data-section="support">
<FaqSplitText
sideTitle="Customer Support"
sideDescription="Common questions answered. If you need further assistance, please don't hesitate to contact us directly."
textPosition="left"
useInvertedBackground={false}
faqs={[
{
id: "1",
title: "How do I contact customer support?",
content: "You can reach our support team via email at support@femmecouture.com or use the contact form on this page. We typically respond within 24 hours.",
},
{
id: "2",
title: "What are your business hours?",
content: "We operate 24/7 for online inquiries. Our email support team responds Monday through Friday, 9 AM to 6 PM EST. For urgent matters, please call our hotline.",
},
{
id: "3",
title: "Do you offer phone support?",
content: "Yes! Call our customer service team at 1-800-FASHION (1-800-327-4746). Phone support is available Monday to Friday, 10 AM to 8 PM EST.",
},
]}
faqsAnimation="slide-up"
/>
</div>
<div id="footer" data-section="footer">
<FooterCard
logoText="Femme Couture"
@@ -85,27 +176,23 @@ export default function ContactPage() {
socialLinks={[
{
icon: Instagram,
href: "https://instagram.com/femmecouture",
ariaLabel: "Instagram",
href: "https://instagram.com/femmecouture", ariaLabel: "Instagram"
},
{
icon: Facebook,
href: "https://facebook.com/femmecouture",
ariaLabel: "Facebook",
href: "https://facebook.com/femmecouture", ariaLabel: "Facebook"
},
{
icon: Twitter,
href: "https://twitter.com/femmecouture",
ariaLabel: "Twitter",
href: "https://twitter.com/femmecouture", ariaLabel: "Twitter"
},
{
icon: Linkedin,
href: "https://linkedin.com/company/femmecouture",
ariaLabel: "LinkedIn",
href: "https://linkedin.com/company/femmecouture", ariaLabel: "LinkedIn"
},
]}
/>
</div>
</ThemeProvider>
);
}
}

61
src/app/layout.tsx
View File

@@ -1,64 +1,26 @@
import type { Metadata } from "next";
import { Public_Sans } from "next/font/google";
import { Inter } from "next/font/google";
import "./globals.css";
import { ServiceWrapper } from "@/components/ServiceWrapper";
import Tag from "@/tag/Tag";
const publicSans = Public_Sans({
variable: "--font-public-sans",
subsets: ["latin"],
});
import "./styles/variables.css";
import "./styles/base.css";
const inter = Inter({
variable: "--font-inter",
subsets: ["latin"],
variable: "--font-inter", subsets: ["latin"],
});
export const metadata: Metadata = {
title: "Femme Couture - Premium Women's Fashion & Designer Clothing",
description: "Shop premium women's fashion, casual wear, formal dresses, and accessories. Discover timeless styles with fast shipping and 30-day returns. Join 50K+ happy customers.",
keywords: "women's fashion, clothing store, dresses, designer wear, premium fashion, casual wear, formal dresses, online shopping",
robots: {
index: true,
follow: true,
},
openGraph: {
title: "Femme Couture - Premium Women's Fashion",
description: "Discover elegant, timeless women's fashion pieces. Shop casual wear, formal dresses, and accessories with free returns.",
type: "website",
siteName: "Femme Couture",
images: [
{
url: "http://img.b2bpic.net/free-photo/two-young-beautiful-smiling-hipster-female-trendy-white-sweater-coat_158538-16965.jpg",
alt: "Femme Couture Premium Fashion Collection",
},
],
},
twitter: {
card: "summary_large_image",
title: "Femme Couture - Premium Women's Fashion",
description: "Shop the latest women's fashion collection with premium quality and stunning designs.",
images: [
"http://img.b2bpic.net/free-photo/two-young-beautiful-smiling-hipster-female-trendy-white-sweater-coat_158538-16965.jpg",
],
},
};
title: "Femme Couture - Premium Women's Fashion E-Commerce", description: "Discover premium women's clothing with unique design, advanced features, admin panel, and multi-language support."};
export default function RootLayout({
children,
}: Readonly<{
}: {
children: React.ReactNode;
}>) {
}) {
return (
<html lang="en" suppressHydrationWarning>
<ServiceWrapper>
<body
className={`${publicSans.variable} ${inter.variable} antialiased`}
>
<Tag />
{children}
<html lang="en">
<body className={inter.variable}>
{children}
<script
dangerouslySetInnerHTML={{
__html: `
@@ -1426,7 +1388,6 @@ export default function RootLayout({
}}
/>
</body>
</ServiceWrapper>
</html>
);
}
}

74
src/app/page.tsx
View File

@@ -73,17 +73,23 @@ export default function HomePage() {
useInvertedBackground={false}
products={[
{
id: "1", name: "Elegant Summer Dress", price: "$89.99", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-young-woman-wearing-fashionable-clothes-walking-down-street_839833-3813.jpg", imageAlt: "Elegant summer dress in floral print"},
id: "1", name: "Elegant Summer Dress", price: "$89.99", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-young-woman-wearing-fashionable-clothes-walking-down-street_839833-3813.jpg", imageAlt: "Elegant summer dress in floral print"
},
{
id: "2", name: "Classic White Blazer", price: "$129.99", imageSrc: "http://img.b2bpic.net/free-photo/fashion-portrait-young-elegant-woman_1328-2740.jpg", imageAlt: "Classic white blazer for professional wear"},
id: "2", name: "Classic White Blazer", price: "$129.99", imageSrc: "http://img.b2bpic.net/free-photo/fashion-portrait-young-elegant-woman_1328-2740.jpg", imageAlt: "Classic white blazer for professional wear"
},
{
id: "3", name: "Denim Jacket", price: "$99.99", imageSrc: "http://img.b2bpic.net/free-photo/woman-model-demonstrating-winter-cloths_1303-16949.jpg", imageAlt: "Vintage-style denim jacket"},
id: "3", name: "Denim Jacket", price: "$99.99", imageSrc: "http://img.b2bpic.net/free-photo/woman-model-demonstrating-winter-cloths_1303-16949.jpg", imageAlt: "Vintage-style denim jacket"
},
{
id: "4", name: "Silk Evening Gown", price: "$249.99", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-woman-evening-dress-sitting-chair_285396-7788.jpg", imageAlt: "Luxurious silk evening gown"},
id: "4", name: "Silk Evening Gown", price: "$249.99", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-woman-evening-dress-sitting-chair_285396-7788.jpg", imageAlt: "Luxurious silk evening gown"
},
{
id: "5", name: "Casual T-Shirt", price: "$34.99", imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-woman-looking-away_23-2148665449.jpg", imageAlt: "Comfortable casual t-shirt"},
id: "5", name: "Casual T-Shirt", price: "$34.99", imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-woman-looking-away_23-2148665449.jpg", imageAlt: "Comfortable casual t-shirt"
},
{
id: "6", name: "Wide-Leg Trousers", price: "$119.99", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-woman-outside-street_1303-14337.jpg", imageAlt: "Tailored wide-leg trousers"},
id: "6", name: "Wide-Leg Trousers", price: "$119.99", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-woman-outside-street_1303-14337.jpg", imageAlt: "Tailored wide-leg trousers"
},
]}
gridVariant="three-columns-all-equal-width"
animationType="slide-up"
@@ -101,13 +107,17 @@ export default function HomePage() {
useInvertedBackground={false}
features={[
{
id: "01", title: "Casual Wear", description: "Comfortable everyday styles perfect for work, shopping, and relaxation", imageSrc: "http://img.b2bpic.net/free-photo/pretty-young-woman-outdoor_624325-645.jpg", imageAlt: "Casual wear collection"},
id: "01", title: "Casual Wear", description: "Comfortable everyday styles perfect for work, shopping, and relaxation", imageSrc: "http://img.b2bpic.net/free-photo/pretty-young-woman-outdoor_624325-645.jpg", imageAlt: "Casual wear collection"
},
{
id: "02", title: "Formal Dresses", description: "Elegant formal wear for special occasions, weddings, and evening events", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-woman-fancy-dress-walking-down-street-fashion-beauty-makeup-evening-dress-smiling-girl-posing-model-luxury-wearing-accessories-blonde-volume-hair-lipstick-eyes-perfect_343629-184.jpg", imageAlt: "Formal dress collection"},
id: "02", title: "Formal Dresses", description: "Elegant formal wear for special occasions, weddings, and evening events", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-woman-fancy-dress-walking-down-street-fashion-beauty-makeup-evening-dress-smiling-girl-posing-model-luxury-wearing-accessories-blonde-volume-hair-lipstick-eyes-perfect_343629-184.jpg", imageAlt: "Formal dress collection"
},
{
id: "03", title: "Active & Sports", description: "Performance-driven activewear for gym, yoga, and outdoor activities", imageSrc: "http://img.b2bpic.net/free-photo/female-sitting-studio-near-gray-wall_158538-3587.jpg", imageAlt: "Active and sports wear"},
id: "03", title: "Active & Sports", description: "Performance-driven activewear for gym, yoga, and outdoor activities", imageSrc: "http://img.b2bpic.net/free-photo/female-sitting-studio-near-gray-wall_158538-3587.jpg", imageAlt: "Active and sports wear"
},
{
id: "04", title: "Accessories", description: "Complete your look with premium bags, belts, scarves, and jewelry", imageSrc: "http://img.b2bpic.net/free-photo/view-women-bag-stuff_93675-131548.jpg", imageAlt: "Fashion accessories collection"},
id: "04", title: "Accessories", description: "Complete your look with premium bags, belts, scarves, and jewelry", imageSrc: "http://img.b2bpic.net/free-photo/view-women-bag-stuff_93675-131548.jpg", imageAlt: "Fashion accessories collection"
},
]}
gridVariant="four-items-2x2-equal-grid"
animationType="slide-up"
@@ -126,16 +136,20 @@ export default function HomePage() {
testimonials={[
{
id: "1", name: "Sarah Mitchell", role: "Fashion Blogger", company: "Style Chronicles", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/casual-smile-street-style-background-spring_1139-777.jpg", imageAlt: "Sarah Mitchell testimonial"},
imageSrc: "http://img.b2bpic.net/free-photo/casual-smile-street-style-background-spring_1139-777.jpg", imageAlt: "Sarah Mitchell testimonial"
},
{
id: "2", name: "Emma Johnson", role: "Marketing Manager", company: "Creative Agency", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/cheerful-employee-with-crossed-arms_1098-3148.jpg", imageAlt: "Emma Johnson testimonial"},
imageSrc: "http://img.b2bpic.net/free-photo/cheerful-employee-with-crossed-arms_1098-3148.jpg", imageAlt: "Emma Johnson testimonial"
},
{
id: "3", name: "Jessica Chen", role: "Event Planner", company: "Elegant Events", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/closeup-portrait-mixed-race-woman-with-neon-makeup-poses-camera-new-beauty-concept-authentic-identity_633478-2196.jpg", imageAlt: "Jessica Chen testimonial"},
imageSrc: "http://img.b2bpic.net/free-photo/closeup-portrait-mixed-race-woman-with-neon-makeup-poses-camera-new-beauty-concept-authentic-identity_633478-2196.jpg", imageAlt: "Jessica Chen testimonial"
},
{
id: "4", name: "Rachel Williams", role: "Corporate Executive", company: "Tech Innovations", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/well-dressed-employee-outdoors_1098-2197.jpg", imageAlt: "Rachel Williams testimonial"},
imageSrc: "http://img.b2bpic.net/free-photo/well-dressed-employee-outdoors_1098-2197.jpg", imageAlt: "Rachel Williams testimonial"
},
]}
kpiItems={[
{ value: "50K+", label: "Happy Customers" },
@@ -154,17 +168,23 @@ export default function HomePage() {
useInvertedBackground={false}
faqs={[
{
id: "1", title: "How do I place an order?", content: "Browse our collections, select your desired items, choose size and color, add to cart, and proceed to checkout. Follow the simple steps to complete your purchase."},
id: "1", title: "How do I place an order?", content: "Browse our collections, select your desired items, choose size and color, add to cart, and proceed to checkout. Follow the simple steps to complete your purchase."
},
{
id: "2", title: "What are the available sizes?", content: "We offer sizes XS, S, M, L, XL, and XXL. Each product page displays a detailed size chart to help you find the perfect fit. If you're between sizes, we recommend sizing up."},
id: "2", title: "What are the available sizes?", content: "We offer sizes XS, S, M, L, XL, and XXL. Each product page displays a detailed size chart to help you find the perfect fit. If you're between sizes, we recommend sizing up."
},
{
id: "3", title: "What is your return policy?", content: "We offer a 30-day return policy for all items in original condition with tags attached. Returns are free, and we'll process refunds within 5-7 business days of receiving your return."},
id: "3", title: "What is your return policy?", content: "We offer a 30-day return policy for all items in original condition with tags attached. Returns are free, and we'll process refunds within 5-7 business days of receiving your return."
},
{
id: "4", title: "How long does shipping take?", content: "Standard shipping takes 5-7 business days. Express shipping (2-3 days) and overnight shipping are also available. You'll receive a tracking number via email."},
id: "4", title: "How long does shipping take?", content: "Standard shipping takes 5-7 business days. Express shipping (2-3 days) and overnight shipping are also available. You'll receive a tracking number via email."
},
{
id: "5", title: "Do you offer international shipping?", content: "Yes! We ship to over 100 countries worldwide. International shipping rates and delivery times vary by location. Customs and import duties may apply."},
id: "5", title: "Do you offer international shipping?", content: "Yes! We ship to over 100 countries worldwide. International shipping rates and delivery times vary by location. Customs and import duties may apply."
},
{
id: "6", title: "How can I track my order?", content: "Once your order ships, you'll receive an email with a tracking number. You can also log into your account to view real-time order status and tracking information."},
id: "6", title: "How can I track my order?", content: "Once your order ships, you'll receive an email with a tracking number. You can also log into your account to view real-time order status and tracking information."
},
]}
faqsAnimation="slide-up"
buttons={[{ text: "Contact Support", href: "/contact" }]}
@@ -191,19 +211,23 @@ export default function HomePage() {
socialLinks={[
{
icon: Instagram,
href: "https://instagram.com/femmecouture", ariaLabel: "Instagram"},
href: "https://instagram.com/femmecouture", ariaLabel: "Instagram"
},
{
icon: Facebook,
href: "https://facebook.com/femmecouture", ariaLabel: "Facebook"},
href: "https://facebook.com/femmecouture", ariaLabel: "Facebook"
},
{
icon: Twitter,
href: "https://twitter.com/femmecouture", ariaLabel: "Twitter"},
href: "https://twitter.com/femmecouture", ariaLabel: "Twitter"
},
{
icon: Linkedin,
href: "https://linkedin.com/company/femmecouture", ariaLabel: "LinkedIn"},
href: "https://linkedin.com/company/femmecouture", ariaLabel: "LinkedIn"
},
]}
/>
</div>
</ThemeProvider>
);
}
}

97
src/app/products/page.tsx
View File

@@ -4,7 +4,8 @@ import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
import ProductCardOne from "@/components/sections/product/ProductCardOne";
import FooterCard from "@/components/sections/footer/FooterCard";
import { Instagram, Facebook, Twitter, Linkedin, Star } from "lucide-react";
import { Instagram, Facebook, Twitter, Linkedin, ShoppingCart, Star } from "lucide-react";
import { useState } from "react";
export default function ProductsPage() {
const navItems = [
@@ -15,6 +16,29 @@ export default function ProductsPage() {
{ name: "Contact", id: "/contact" },
];
const [cart, setCart] = useState<any[]>([]);
const allProducts = [
{
id: "1", name: "Elegant Summer Dress", price: "$89.99", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-young-woman-wearing-fashionable-clothes-walking-down-street_839833-3813.jpg", imageAlt: "Elegant summer dress in floral print", onFavorite: () => console.log("Favorited"),
onProductClick: () => console.log("Product clicked"),
},
{
id: "2", name: "Classic White Blazer", price: "$129.99", imageSrc: "http://img.b2bpic.net/free-photo/fashion-portrait-young-elegant-woman_1328-2740.jpg", imageAlt: "Classic white blazer for professional wear"},
{
id: "3", name: "Denim Jacket", price: "$99.99", imageSrc: "http://img.b2bpic.net/free-photo/woman-model-demonstrating-winter-cloths_1303-16949.jpg", imageAlt: "Vintage-style denim jacket"},
{
id: "4", name: "Silk Evening Gown", price: "$249.99", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-woman-evening-dress-sitting-chair_285396-7788.jpg", imageAlt: "Luxurious silk evening gown"},
{
id: "5", name: "Casual T-Shirt", price: "$34.99", imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-woman-looking-away_23-2148665449.jpg", imageAlt: "Comfortable casual t-shirt"},
{
id: "6", name: "Wide-Leg Trousers", price: "$119.99", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-woman-outside-street_1303-14337.jpg", imageAlt: "Tailored wide-leg trousers"},
{
id: "7", name: "Leather Crossbody Bag", price: "$159.99", imageSrc: "http://img.b2bpic.net/free-photo/view-women-bag-stuff_93675-131548.jpg", imageAlt: "Premium leather crossbody bag"},
{
id: "8", name: "Wool Coat", price: "$299.99", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-woman-outside-street_1303-14337.jpg", imageAlt: "Elegant wool winter coat"},
];
return (
<ThemeProvider
defaultButtonVariant="text-stagger"
@@ -22,7 +46,7 @@ export default function ProductsPage() {
borderRadius="pill"
contentWidth="mediumSmall"
sizing="mediumSizeLargeTitles"
background="noise"
background="circleGradient"
cardStyle="glass-elevated"
primaryButtonStyle="diagonal-gradient"
secondaryButtonStyle="layered"
@@ -37,59 +61,16 @@ export default function ProductsPage() {
/>
</div>
<div id="all-products" data-section="all-products">
<div id="products" data-section="products" className="py-20">
<ProductCardOne
title="All Products"
description="Browse our complete collection of premium women's fashion. From everyday essentials to statement pieces, find something you love."
tag="Full Collection"
tagIcon={Star}
description="Browse our complete collection of premium women's fashion. Find the perfect piece for any occasion."
tag="Complete Collection"
tagIcon={ShoppingCart}
textboxLayout="default"
useInvertedBackground={false}
products={[
{
id: "1",
name: "Elegant Summer Dress",
price: "$89.99",
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-young-woman-wearing-fashionable-clothes-walking-down-street_839833-3813.jpg?_wi=2",
imageAlt: "Elegant summer dress in floral print",
},
{
id: "2",
name: "Classic White Blazer",
price: "$129.99",
imageSrc: "http://img.b2bpic.net/free-photo/fashion-portrait-young-elegant-woman_1328-2740.jpg?_wi=2",
imageAlt: "Classic white blazer for professional wear",
},
{
id: "3",
name: "Denim Jacket",
price: "$99.99",
imageSrc: "http://img.b2bpic.net/free-photo/woman-model-demonstrating-winter-cloths_1303-16949.jpg?_wi=2",
imageAlt: "Vintage-style denim jacket",
},
{
id: "4",
name: "Silk Evening Gown",
price: "$249.99",
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-woman-evening-dress-sitting-chair_285396-7788.jpg?_wi=2",
imageAlt: "Luxurious silk evening gown",
},
{
id: "5",
name: "Casual T-Shirt",
price: "$34.99",
imageSrc: "http://img.b2bpic.net/free-photo/portrait-young-woman-looking-away_23-2148665449.jpg?_wi=2",
imageAlt: "Comfortable casual t-shirt",
},
{
id: "6",
name: "Wide-Leg Trousers",
price: "$119.99",
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-woman-outside-street_1303-14337.jpg?_wi=2",
imageAlt: "Tailored wide-leg trousers",
},
]}
gridVariant="three-columns-all-equal-width"
products={allProducts}
gridVariant="four-items-2x2-equal-grid"
animationType="slide-up"
carouselMode="buttons"
/>
@@ -102,27 +83,23 @@ export default function ProductsPage() {
socialLinks={[
{
icon: Instagram,
href: "https://instagram.com/femmecouture",
ariaLabel: "Instagram",
href: "https://instagram.com/femmecouture", ariaLabel: "Instagram"
},
{
icon: Facebook,
href: "https://facebook.com/femmecouture",
ariaLabel: "Facebook",
href: "https://facebook.com/femmecouture", ariaLabel: "Facebook"
},
{
icon: Twitter,
href: "https://twitter.com/femmecouture",
ariaLabel: "Twitter",
href: "https://twitter.com/femmecouture", ariaLabel: "Twitter"
},
{
icon: Linkedin,
href: "https://linkedin.com/company/femmecouture",
ariaLabel: "LinkedIn",
href: "https://linkedin.com/company/femmecouture", ariaLabel: "LinkedIn"
},
]}
/>
</div>
</ThemeProvider>
);
}
}

103
src/app/support/page.tsx Normal file
View File

@@ -0,0 +1,103 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from "@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen";
import FaqSplitText from "@/components/sections/faq/FaqSplitText";
import FooterCard from "@/components/sections/footer/FooterCard";
import { Instagram, Facebook, Twitter, Linkedin } from "lucide-react";
export default function SupportPage() {
const navItems = [
{ name: "Shop", id: "/products" },
{ name: "Collections", id: "/collections" },
{ name: "About", id: "/about" },
{ name: "Support", id: "/support" },
{ name: "Contact", id: "/contact" },
];
return (
<ThemeProvider
defaultButtonVariant="text-stagger"
defaultTextAnimation="background-highlight"
borderRadius="pill"
contentWidth="mediumSmall"
sizing="mediumSizeLargeTitles"
background="circleGradient"
cardStyle="glass-elevated"
primaryButtonStyle="diagonal-gradient"
secondaryButtonStyle="layered"
headingFontWeight="medium"
>
<div id="nav" data-section="nav">
<NavbarStyleFullscreen
navItems={navItems}
brandName="Femme Couture"
bottomLeftText="Premium Women's Fashion"
bottomRightText="support@femmecouture.com"
/>
</div>
<div id="support" data-section="support" className="py-20">
<FaqSplitText
sideTitle="Customer Support Center"
sideDescription="Find answers to frequently asked questions about ordering, shipping, returns, sizing, payment options, and customer service. Our support team is available 24/7 to assist you."
textPosition="left"
useInvertedBackground={false}
faqs={[
{
id: "1", title: "How do I place an order?", content: "Browse our collections, select your desired items, choose size and color, add to cart, and proceed to checkout. Follow the simple steps to complete your purchase. You'll receive a confirmation email with order details."
},
{
id: "2", title: "What are the available sizes?", content: "We offer sizes XS, S, M, L, XL, and XXL. Each product page displays a detailed size chart to help you find the perfect fit. If you're between sizes, we recommend sizing up. All measurements are provided in both inches and centimeters."
},
{
id: "3", title: "What is your return policy?", content: "We offer a 30-day return policy for all items in original condition with tags attached. Returns are free, and we'll process refunds within 5-7 business days of receiving your return. Simply contact our support team to initiate the return process."
},
{
id: "4", title: "How long does shipping take?", content: "Standard shipping takes 5-7 business days. Express shipping (2-3 days) and overnight shipping are also available. You'll receive a tracking number via email. Shipping times may vary during peak seasons."
},
{
id: "5", title: "Do you offer international shipping?", content: "Yes! We ship to over 100 countries worldwide. International shipping rates and delivery times vary by location. Customs and import duties may apply. Please check our shipping page for rates to your country."
},
{
id: "6", title: "How can I track my order?", content: "Once your order ships, you'll receive an email with a tracking number. You can also log into your account to view real-time order status and tracking information. Most orders can be tracked 24-48 hours after shipment."
},
{
id: "7", title: "What payment methods do you accept?", content: "We accept all major credit cards (Visa, Mastercard, American Express), PayPal, Apple Pay, Google Pay, and digital wallets. All payments are processed securely using industry-standard encryption."
},
{
id: "8", title: "Can I modify or cancel my order?", content: "Orders can be modified or cancelled within 2 hours of placement. After that, please contact our support team as soon as possible. We'll do our best to help if your order hasn't been shipped yet."
},
]}
faqsAnimation="slide-up"
buttons={[{ text: "Contact Our Team", href: "/contact" }]}
/>
</div>
<div id="footer" data-section="footer">
<FooterCard
logoText="Femme Couture"
copyrightText="© 2025 Femme Couture. All rights reserved. Crafted with elegance."
socialLinks={[
{
icon: Instagram,
href: "https://instagram.com/femmecouture", ariaLabel: "Instagram"
},
{
icon: Facebook,
href: "https://facebook.com/femmecouture", ariaLabel: "Facebook"
},
{
icon: Twitter,
href: "https://twitter.com/femmecouture", ariaLabel: "Twitter"
},
{
icon: Linkedin,
href: "https://linkedin.com/company/femmecouture", ariaLabel: "LinkedIn"
},
]}
/>
</div>
</ThemeProvider>
);
}