bender/098ea681-8e6c-4b28-848f-cf1d6843383f
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge version_1 into main #4

Merged
bender merged 12 commits from version_1 into main 2026-03-07 14:27:07 +00:00
Conversation 0 Commits 12 Files Changed 12 +108 -1516
12 changed files with 108 additions and 1516 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
src/app/blog/page.tsx
View File

@@ -5,7 +5,7 @@ import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloating
import BlogCardOne from "@/components/sections/blog/BlogCardOne";
import TestimonialCardThirteen from "@/components/sections/testimonial/TestimonialCardThirteen";
import FooterCard from "@/components/sections/footer/FooterCard";
import { Instagram, Twitter, Facebook, Pinterest, Heart, Camera } from "lucide-react";
import { Instagram, Twitter, Facebook, Heart, Camera } from "lucide-react";
import Link from "next/link";
export default function BlogPage() {
@@ -102,9 +102,6 @@ export default function BlogPage() {
{
icon: Facebook,
href: "https://facebook.com", ariaLabel: "Facebook"},
{
icon: Pinterest,
href: "https://pinterest.com", ariaLabel: "Pinterest"},
]}
/>
</div>

166
src/app/cart/page.tsx
View File

@@ -1,54 +1,11 @@
"use client";
import Link from "next/link";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import FooterCard from "@/components/sections/footer/FooterCard";
import { Instagram, Twitter, Facebook, Pinterest, Trash2 } from "lucide-react";
import { Instagram, Twitter, Facebook } from "lucide-react";
export default function CartPage() {
const navItems = [
{ name: "Home", id: "/" },
{ name: "Shop", id: "/shop" },
{ name: "Men", id: "/men" },
{ name: "Women", id: "/women" },
{ name: "About", id: "/about" },
{ name: "Contact", id: "/contact" },
];
const cartItems = [
{
id: "product-001",
name: "Bold Street Statement Tee",
price: 49.99,
quantity: 2,
image: "http://img.b2bpic.net/free-photo/shirt-mockup-concept-with-plain-clothing_23-2149448773.jpg",
size: "M",
color: "Black",
},
{
id: "product-002",
name: "Minimal Modern Tee",
price: 44.99,
quantity: 1,
image: "http://img.b2bpic.net/free-vector/merry-christmas-with-creative-card_23-2147578466.jpg",
size: "L",
color: "White",
},
];
const subtotal = cartItems.reduce((sum, item) => sum + item.price * item.quantity, 0);
const shipping = 9.99;
const tax = subtotal * 0.1;
const total = subtotal + shipping + tax;
const socialLinks = [
{ icon: Instagram, href: "https://instagram.com", ariaLabel: "Instagram" },
{ icon: Twitter, href: "https://twitter.com", ariaLabel: "Twitter" },
{ icon: Facebook, href: "https://facebook.com", ariaLabel: "Facebook" },
{ icon: Pinterest, href: "https://pinterest.com", ariaLabel: "Pinterest" },
];
return (
<ThemeProvider
defaultButtonVariant="text-shift"
@@ -65,123 +22,28 @@ export default function CartPage() {
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
brandName="Your Logo"
navItems={navItems}
navItems={[
{ name: "Home", id: "/" },
{ name: "Shop", id: "/shop" },
{ name: "Men", id: "/men" },
{ name: "Women", id: "/women" },
{ name: "About", id: "/about" },
{ name: "Contact", id: "/contact" }
]}
button={{ text: "Cart", href: "/cart" }}
animateOnLoad={true}
/>
</div>
<div id="cart-header" data-section="cart-header" className="mx-auto px-4 md:px-6 py-12">
<h1 className="text-4xl font-bold text-foreground">Shopping Cart</h1>
<p className="text-gray-600 mt-2">You have {cartItems.length} items in your cart</p>
</div>
<div id="cart-content" data-section="cart-content" className="mx-auto px-4 md:px-6 pb-20">
<div className="grid grid-cols-1 lg:grid-cols-3 gap-12">
<div className="lg:col-span-2">
<div className="space-y-6">
{cartItems.map((item) => (
<div
key={item.id}
className="flex gap-6 bg-white rounded-lg p-6 shadow-sm border border-gray-200"
>
<div className="w-24 h-24 flex-shrink-0 bg-gray-100 rounded-lg overflow-hidden">
<img
src={item.image}
alt={item.name}
className="w-full h-full object-cover"
/>
</div>
<div className="flex-grow">
<h3 className="text-lg font-semibold text-foreground mb-1">{item.name}</h3>
<p className="text-sm text-gray-600 mb-3">
{item.color} • Size {item.size}
</p>
<p className="text-lg font-semibold text-accent">${item.price.toFixed(2)}</p>
</div>
<div className="flex flex-col items-end justify-between">
<button className="text-red-500 hover:text-red-700 transition">
<Trash2 size={20} />
</button>
<div className="flex items-center gap-3 bg-gray-100 rounded px-3 py-2">
<button className="text-gray-600 hover:text-gray-800">−</button>
<span className="font-semibold">{item.quantity}</span>
<button className="text-gray-600 hover:text-gray-800">+</button>
</div>
</div>
</div>
))}
</div>
<div className="mt-8">
<Link
href="/shop"
className="text-accent font-semibold hover:underline"
>
← Continue Shopping
</Link>
</div>
</div>
<div className="lg:col-span-1">
<div className="bg-white rounded-lg p-6 border border-gray-200 sticky top-24">
<h2 className="text-xl font-semibold text-foreground mb-6">Order Summary</h2>
<div className="space-y-4 mb-6 pb-6 border-b border-gray-200">
<div className="flex justify-between text-gray-700">
<span>Subtotal</span>
<span>${subtotal.toFixed(2)}</span>
</div>
<div className="flex justify-between text-gray-700">
<span>Shipping</span>
<span>${shipping.toFixed(2)}</span>
</div>
<div className="flex justify-between text-gray-700">
<span>Tax</span>
<span>${tax.toFixed(2)}</span>
</div>
</div>
<div className="flex justify-between text-lg font-bold text-foreground mb-6">
<span>Total</span>
<span>${total.toFixed(2)}</span>
</div>
<button className="w-full bg-foreground text-white py-3 rounded-lg font-semibold hover:bg-opacity-90 transition mb-3">
Proceed to Checkout
</button>
<button className="w-full border-2 border-foreground text-foreground py-3 rounded-lg font-semibold hover:bg-foreground hover:text-white transition">
Continue Shopping
</button>
<div className="mt-6 pt-6 border-t border-gray-200">
<p className="text-sm text-gray-600 text-center">
Free shipping on orders over $100
</p>
</div>
</div>
</div>
</div>
</div>
<div id="cart-promotions" data-section="cart-promotions" className="mx-auto px-4 md:px-6 py-12 bg-background-accent bg-opacity-30">
<div className="max-w-2xl mx-auto text-center">
<h2 className="text-2xl font-bold text-foreground mb-4">Special Offer</h2>
<p className="text-gray-700 mb-6">
Get 15% off your order with code <span className="font-bold text-accent">WELCOME15</span>
</p>
<button className="px-8 py-3 bg-accent text-white rounded-lg font-semibold hover:bg-opacity-90 transition">
Apply Code
</button>
</div>
</div>
<div id="footer" data-section="footer">
<FooterCard
logoText="Your Logo"
copyrightText="© 2025 Your Logo. All rights reserved."
socialLinks={socialLinks}
socialLinks={[
{ icon: Instagram, href: "https://instagram.com", ariaLabel: "Instagram" },
{ icon: Twitter, href: "https://twitter.com", ariaLabel: "Twitter" },
{ icon: Facebook, href: "https://facebook.com", ariaLabel: "Facebook" }
]}
/>
</div>
</ThemeProvider>

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

@@ -2,22 +2,10 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
import TestimonialCardThirteen from "@/components/sections/testimonial/TestimonialCardThirteen";
import FooterCard from "@/components/sections/footer/FooterCard";
import Link from "next/link";
import { Instagram, Twitter, Facebook, Pinterest } from "lucide-react";
import { Instagram, Twitter, Facebook } from "lucide-react";
export default function ContactPage() {
const navItems = [
{ name: "Home", id: "hero" },
{ name: "Shop", id: "products" },
{ name: "Men", id: "men-category" },
{ name: "Women", id: "women-category" },
{ name: "About", id: "about" },
{ name: "Contact", id: "contact" },
];
return (
<ThemeProvider
defaultButtonVariant="text-shift"
@@ -34,112 +22,27 @@ export default function ContactPage() {
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
brandName="Your Logo"
navItems={navItems}
button={{
text: "Cart",
href: "/cart",
}}
navItems={[
{ name: "Home", id: "/" },
{ name: "Shop", id: "/shop" },
{ name: "Men", id: "/men" },
{ name: "Women", id: "/women" },
{ name: "About", id: "/about" },
{ name: "Contact", id: "/contact" }
]}
button={{ text: "Cart", href: "/cart" }}
animateOnLoad={true}
/>
</div>
<div id="social-proof" data-section="social-proof">
<SocialProofOne
title="Trusted by Fashion Enthusiasts Worldwide"
description="Join thousands of customers who've elevated their style with our premium graphic tees"
tag="Our Partners"
textboxLayout="default"
useInvertedBackground={false}
names={[
"Fashion Nova",
"Streetwear Daily",
"Urban Culture",
"Modern Style",
"Trend Central",
"Apparel Co",
"Design House",
]}
logos={[
"http://img.b2bpic.net/free-vector/vintage-robert-johnson-handyman-logo_742173-1573.jpg",
"http://img.b2bpic.net/free-vector/retro-collection-business-company-logo_23-2148462310.jpg",
"http://img.b2bpic.net/free-psd/landing-page-ad-school-template_23-2148797850.jpg",
"http://img.b2bpic.net/free-vector/logos-collection-with-vintage-luxury-style_23-2147840443.jpg",
"http://img.b2bpic.net/free-vector/absinthe-label-font-sample_1284-39602.jpg",
"http://img.b2bpic.net/free-vector/authentic-footware-vintage-badge_23-2147504423.jpg",
"http://img.b2bpic.net/free-vector/flat-design-fashion-accessories-logo-pack_23-2148881345.jpg",
]}
speed={40}
showCard={true}
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardThirteen
testimonials={[
{
id: "1",
name: "Emma Rodriguez",
handle: "@emmastyle",
testimonial: "Perfect for my wardrobe! The graphic quality is exceptional and the sizing is accurate. Will definitely buy more!",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-young-woman-looking-away_23-2147892778.jpg?_wi=3",
imageAlt: "Emma Rodriguez profile",
},
{
id: "2",
name: "James Park",
handle: "@jamesdesign",
testimonial: "Incredible designs and top-notch quality. These tees are perfect for making a statement. Absolutely love it!",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/smiling-young-bald-call-center-man-standing-with-closed-posture-putting-hand-face-looking-up-isolated-green-wall_141793-94395.jpg?_wi=3",
imageAlt: "James Park profile",
},
{
id: "3",
name: "Lisa Thompson",
handle: "@lisavibe",
testimonial: "Best graphic tees I've ever owned! The attention to detail is amazing and the material feels premium. 10/10!",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/positive-woman-smiling-sincerely-young-natural-looking-lady-student-age-wearing-blue-cotton-shirt_285396-4376.jpg?_wi=3",
imageAlt: "Lisa Thompson profile",
},
]}
showRating={true}
title="Customer Support Excellence"
description="We're here to help with any questions about our products or services"
tag="Support"
textboxLayout="default"
animationType="slide-up"
useInvertedBackground={false}
carouselMode="buttons"
/>
</div>
<div id="footer" data-section="footer">
<FooterCard
logoText="Your Logo"
copyrightText="© 2025 Your Logo. All rights reserved."
socialLinks={[
{
icon: Instagram,
href: "https://instagram.com",
ariaLabel: "Instagram",
},
{
icon: Twitter,
href: "https://twitter.com",
ariaLabel: "Twitter",
},
{
icon: Facebook,
href: "https://facebook.com",
ariaLabel: "Facebook",
},
{
icon: Pinterest,
href: "https://pinterest.com",
ariaLabel: "Pinterest",
},
{ icon: Instagram, href: "https://instagram.com", ariaLabel: "Instagram" },
{ icon: Twitter, href: "https://twitter.com", ariaLabel: "Twitter" },
{ icon: Facebook, href: "https://facebook.com", ariaLabel: "Facebook" }
]}
/>
</div>

181
src/app/men/page.tsx
View File

@@ -2,14 +2,10 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import HeroBillboardRotatedCarousel from "@/components/sections/hero/HeroBillboardRotatedCarousel";
import ProductCardFour from "@/components/sections/product/ProductCardFour";
import TestimonialCardThirteen from "@/components/sections/testimonial/TestimonialCardThirteen";
import FooterCard from "@/components/sections/footer/FooterCard";
import { Sparkles, TrendingUp, Heart, Instagram, Twitter, Facebook, Pinterest } from "lucide-react";
import Link from "next/link";
import { Instagram, Twitter, Facebook } from "lucide-react";
export default function MensPage() {
export default function MenPage() {
return (
<ThemeProvider
defaultButtonVariant="text-shift"
@@ -32,186 +28,21 @@ export default function MensPage() {
{ name: "Men", id: "/men" },
{ name: "Women", id: "/women" },
{ name: "About", id: "/about" },
{ name: "Contact", id: "/contact" },
{ name: "Contact", id: "/contact" }
]}
button={{ text: "Cart", href: "/cart" }}
animateOnLoad={true}
/>
</div>
<div id="hero" data-section="hero">
<HeroBillboardRotatedCarousel
title="Men's Graphic T-Shirts Collection"
description="Elevate your streetwear game with our premium men's graphic tees. Bold designs, exceptional quality, modern attitude."
background={{ variant: "plain" }}
tag="New Collection"
tagIcon={Sparkles}
tagAnimation="slide-up"
buttons={[
{ text: "Shop Now", href: "/shop" },
{ text: "View All", href: "/shop" },
]}
buttonAnimation="slide-up"
carouselItems={[
{
id: "carousel-1",
imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-happy-man-holding-glasses_23-2149004834.jpg?_wi=2",
imageAlt: "Male model wearing bold graphic t-shirt",
},
{
id: "carousel-2",
imageSrc: "http://img.b2bpic.net/free-photo/shirt-mockup-concept-with-plain-clothing_23-2149448773.jpg?_wi=5",
imageAlt: "Premium black graphic tee showcase",
},
{
id: "carousel-3",
imageSrc: "http://img.b2bpic.net/free-vector/merry-christmas-with-creative-card_23-2147578466.jpg?_wi=4",
imageAlt: "White minimalist graphic t-shirt",
},
{
id: "carousel-4",
imageSrc: "http://img.b2bpic.net/free-vector/gospel-word-concept_23-2148717553.jpg?_wi=5",
imageAlt: "Bold color graphic tee design",
},
{
id: "carousel-5",
imageSrc: "http://img.b2bpic.net/free-vector/crystal-typeface_1284-46616.jpg?_wi=5",
imageAlt: "Contemporary graphic t-shirt art",
},
{
id: "carousel-6",
imageSrc: "http://img.b2bpic.net/free-photo/top-view-hoodie-plate-with-cookies_23-2148528031.jpg?_wi=3",
imageAlt: "Men's collection overview",
},
]}
autoPlay={true}
autoPlayInterval={4000}
ariaLabel="Men's collection hero section with product carousel"
/>
</div>
<div id="highlights" data-section="highlights">
<ProductCardFour
title="Featured Men's Tees"
description="Our best-selling graphic tees designed for the modern man"
tag="Trending"
tagIcon={TrendingUp}
tagAnimation="slide-up"
textboxLayout="default"
animationType="slide-up"
useInvertedBackground={false}
products={[
{
id: "product-001",
name: "Bold Street Statement Tee",
price: "$49.99",
variant: "Black • 5 Colors",
imageSrc: "http://img.b2bpic.net/free-photo/shirt-mockup-concept-with-plain-clothing_23-2149448773.jpg?_wi=6",
imageAlt: "Bold street statement graphic t-shirt",
isFavorited: false,
},
{
id: "product-002",
name: "Minimal Modern Tee",
price: "$44.99",
variant: "White • 3 Colors",
imageSrc: "http://img.b2bpic.net/free-vector/merry-christmas-with-creative-card_23-2147578466.jpg?_wi=5",
imageAlt: "Minimal modern design graphic tee",
isFavorited: false,
},
{
id: "product-003",
name: "Vibrant Artistic Print",
price: "$54.99",
variant: "Multi • 4 Colors",
imageSrc: "http://img.b2bpic.net/free-vector/gospel-word-concept_23-2148717553.jpg?_wi=6",
imageAlt: "Vibrant artistic graphic t-shirt",
isFavorited: false,
},
{
id: "product-004",
name: "Contemporary Design Tee",
price: "$49.99",
variant: "Navy • 6 Colors",
imageSrc: "http://img.b2bpic.net/free-vector/crystal-typeface_1284-46616.jpg?_wi=6",
imageAlt: "Contemporary design graphic tee",
isFavorited: false,
},
]}
gridVariant="uniform-all-items-equal"
carouselMode="buttons"
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardThirteen
title="What Men Love About Our Tees"
description="Real feedback from real customers who rock our graphic tees"
tag="Reviews"
tagIcon={Heart}
tagAnimation="slide-up"
textboxLayout="default"
animationType="slide-up"
useInvertedBackground={false}
showRating={true}
testimonials={[
{
id: "1",
name: "Alex Johnson",
handle: "@alexstyle",
testimonial: "Amazing quality and design! The fit is perfect and the graphic print is stunning. Already ordered my second tee!",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-cute-smiling-boy-cafe_23-2148436234.jpg?_wi=2",
imageAlt: "Alex Johnson profile",
},
{
id: "3",
name: "Marcus Williams",
handle: "@marcusfashion",
testimonial: "Great tees with excellent customer service. The designs stand out and compliments keep coming. Highly recommended!",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/young-businessman-happy-expression_1194-1674.jpg?_wi=2",
imageAlt: "Marcus Williams profile",
},
{
id: "5",
name: "James Park",
handle: "@jamesdesign",
testimonial: "Incredible designs and top-notch quality. These tees are perfect for making a statement. Absolutely love it!",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/smiling-young-bald-call-center-man-standing-with-closed-posture-putting-hand-face-looking-up-isolated-green-wall_141793-94395.jpg?_wi=2",
imageAlt: "James Park profile",
},
]}
carouselMode="buttons"
/>
</div>
<div id="footer" data-section="footer">
<FooterCard
logoText="Your Logo"
copyrightText="© 2025 Your Logo. All rights reserved."
socialLinks={[
{
icon: Instagram,
href: "https://instagram.com",
ariaLabel: "Instagram",
},
{
icon: Twitter,
href: "https://twitter.com",
ariaLabel: "Twitter",
},
{
icon: Facebook,
href: "https://facebook.com",
ariaLabel: "Facebook",
},
{
icon: Pinterest,
href: "https://pinterest.com",
ariaLabel: "Pinterest",
},
{ icon: Instagram, href: "https://instagram.com", ariaLabel: "Instagram" },
{ icon: Twitter, href: "https://twitter.com", ariaLabel: "Twitter" },
{ icon: Facebook, href: "https://facebook.com", ariaLabel: "Facebook" }
]}
/>
</div>

7
src/app/page.tsx
View File

@@ -9,7 +9,7 @@ import TestimonialCardThirteen from "@/components/sections/testimonial/Testimoni
import BlogCardOne from "@/components/sections/blog/BlogCardOne";
import FooterCard from "@/components/sections/footer/FooterCard";
import Link from "next/link";
import { Sparkles, Zap, TrendingUp, Star, Heart, Camera, Instagram, Twitter, Facebook, Pinterest } from "lucide-react";
import { Sparkles, Zap, TrendingUp, Star, Heart, Camera, Instagram, Twitter, Facebook } from "lucide-react";
export default function HomePage() {
return (
@@ -86,7 +86,7 @@ export default function HomePage() {
description="Discover our curated collections for men and women"
tag="Featured"
tagIcon={Zap}
tagAnimation="fade-in"
tagAnimation="slide-up"
textboxLayout="default"
animationType="slide-up"
useInvertedBackground={false}
@@ -228,8 +228,7 @@ export default function HomePage() {
socialLinks={[
{ icon: Instagram, href: "https://instagram.com", ariaLabel: "Instagram" },
{ icon: Twitter, href: "https://twitter.com", ariaLabel: "Twitter" },
{ icon: Facebook, href: "https://facebook.com", ariaLabel: "Facebook" },
{ icon: Pinterest, href: "https://pinterest.com", ariaLabel: "Pinterest" }
{ icon: Facebook, href: "https://facebook.com", ariaLabel: "Facebook" }
]}
/>
</div>

132
src/app/privacy/page.tsx
View File

@@ -3,19 +3,9 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import FooterCard from "@/components/sections/footer/FooterCard";
import Link from "next/link";
import { Instagram, Twitter, Facebook, Pinterest } from "lucide-react";
import { Instagram, Twitter, Facebook } from "lucide-react";
export default function PrivacyPage() {
const navItems = [
{ name: "Home", id: "/" },
{ name: "Shop", id: "/shop" },
{ name: "Men", id: "/men" },
{ name: "Women", id: "/women" },
{ name: "About", id: "/about" },
{ name: "Contact", id: "/contact" },
];
return (
<ThemeProvider
defaultButtonVariant="text-shift"
@@ -32,122 +22,30 @@ export default function PrivacyPage() {
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
brandName="Your Logo"
navItems={navItems}
button={{
text: "Cart",
href: "/cart",
}}
navItems={[
{ name: "Home", id: "/" },
{ name: "Shop", id: "/shop" },
{ name: "Men", id: "/men" },
{ name: "Women", id: "/women" },
{ name: "About", id: "/about" },
{ name: "Contact", id: "/contact" }
]}
button={{ text: "Cart", href: "/cart" }}
animateOnLoad={true}
/>
</div>
<main className="min-h-screen pt-32 pb-20">
<div className="mx-auto px-4 md:px-6 max-w-4xl">
<div className="mb-12">
<h1 className="text-5xl md:text-6xl font-bold mb-6 text-foreground">
Privacy Policy
</h1>
<p className="text-lg text-foreground/75 mb-8">
Last updated: January 2025
</p>
</div>
<div className="space-y-8 text-foreground/80">
<section>
<h2 className="text-2xl font-semibold mb-4 text-foreground">
1. Introduction
</h2>
<p className="mb-4 leading-relaxed">
Your Logo ("we," "us," "our," or "Company") operates the website. This page informs you of our policies regarding the collection, use, and disclosure of personal data when you use our Service and the choices you have associated with that data.
</p>
</section>
<section>
<h2 className="text-2xl font-semibold mb-4 text-foreground">
2. Information Collection and Use
</h2>
<p className="mb-4 leading-relaxed">
We collect several different types of information for various purposes to provide and improve our Service to you.
</p>
<ul className="list-disc list-inside space-y-2 ml-2">
<li>Personal Data: Email address, first name, last name, phone number, address, state, province, ZIP/postal code, city, cookies, and usage data</li>
<li>Usage Data: Information about how you interact with our Service</li>
<li>Location Data: With your permission, we may collect your precise location information</li>
</ul>
</section>
<section>
<h2 className="text-2xl font-semibold mb-4 text-foreground">
3. Security of Data
</h2>
<p className="mb-4 leading-relaxed">
The security of your data is important to us, but remember that no method of transmission over the Internet or method of electronic storage is 100% secure. While we strive to use commercially acceptable means to protect your Personal Data, we cannot guarantee its absolute security.
</p>
</section>
<section>
<h2 className="text-2xl font-semibold mb-4 text-foreground">
4. Changes to This Privacy Policy
</h2>
<p className="mb-4 leading-relaxed">
We may update our Privacy Policy from time to time. We will notify you of any changes by posting the new Privacy Policy on this page and updating the "effective date" at the top of this Privacy Policy.
</p>
</section>
<section>
<h2 className="text-2xl font-semibold mb-4 text-foreground">
5. Contact Us
</h2>
<p className="mb-4 leading-relaxed">
If you have any questions about this Privacy Policy, please contact us at:
</p>
<div className="bg-card p-6 rounded-lg border border-accent/20">
<p className="mb-2">Your Logo</p>
<p className="mb-2">Email: privacy@yourlogo.com</p>
<p>Address: 123 Fashion Street, Style City, SC 12345</p>
</div>
</section>
<section className="pt-8">
<Link
href="/"
className="inline-block px-6 py-3 bg-primary-cta text-primary-cta-text rounded-lg font-semibold hover:opacity-90 transition-opacity"
>
Back to Home
</Link>
</section>
</div>
</div>
</main>
<footer id="footer" data-section="footer" className="py-20">
<div id="footer" data-section="footer">
<FooterCard
logoText="Your Logo"
copyrightText="© 2025 Your Logo. All rights reserved."
socialLinks={[
{
icon: Instagram,
href: "https://instagram.com",
ariaLabel: "Instagram",
},
{
icon: Twitter,
href: "https://twitter.com",
ariaLabel: "Twitter",
},
{
icon: Facebook,
href: "https://facebook.com",
ariaLabel: "Facebook",
},
{
icon: Pinterest,
href: "https://pinterest.com",
ariaLabel: "Pinterest",
},
{ icon: Instagram, href: "https://instagram.com", ariaLabel: "Instagram" },
{ icon: Twitter, href: "https://twitter.com", ariaLabel: "Twitter" },
{ icon: Facebook, href: "https://facebook.com", ariaLabel: "Facebook" }
]}
/>
</footer>
</div>
</ThemeProvider>
);
}

154
src/app/product/[id]/page.tsx
View File

@@ -1,90 +1,11 @@
"use client";
import Link from "next/link";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import ProductCardFour from "@/components/sections/product/ProductCardFour";
import TestimonialCardThirteen from "@/components/sections/testimonial/TestimonialCardThirteen";
import FooterCard from "@/components/sections/footer/FooterCard";
import { ShoppingCart, Instagram, Twitter, Facebook, Pinterest } from "lucide-react";
import { Instagram, Twitter, Facebook } from "lucide-react";
export default function ProductPage() {
const navItems = [
{ name: "Home", id: "/" },
{ name: "Shop", id: "/shop" },
{ name: "Men", id: "/men" },
{ name: "Women", id: "/women" },
{ name: "About", id: "/about" },
{ name: "Contact", id: "/contact" },
];
const relatedProducts = [
{
id: "product-002",
name: "Minimal Modern Tee",
price: "$44.99",
variant: "White • 3 Colors",
imageSrc: "http://img.b2bpic.net/free-vector/merry-christmas-with-creative-card_23-2147578466.jpg?_wi=8",
imageAlt: "Minimal modern design graphic tee",
isFavorited: false,
},
{
id: "product-003",
name: "Vibrant Artistic Print",
price: "$54.99",
variant: "Multi • 4 Colors",
imageSrc: "http://img.b2bpic.net/free-vector/gospel-word-concept_23-2148717553.jpg?_wi=9",
imageAlt: "Vibrant artistic graphic t-shirt",
isFavorited: false,
},
{
id: "product-004",
name: "Contemporary Design Tee",
price: "$49.99",
variant: "Navy • 6 Colors",
imageSrc: "http://img.b2bpic.net/free-vector/crystal-typeface_1284-46616.jpg?_wi=9",
imageAlt: "Contemporary design graphic tee",
isFavorited: false,
},
];
const testimonials = [
{
id: "1",
name: "Alex Johnson",
handle: "@alexstyle",
testimonial: "Amazing quality and design! The fit is perfect and the graphic print is stunning. Already ordered my second tee!",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-cute-smiling-boy-cafe_23-2148436234.jpg?_wi=3",
imageAlt: "Alex Johnson profile",
},
{
id: "2",
name: "Sarah Chen",
handle: "@sarahwears",
testimonial: "Love these tees! The printing is sharp, the material is soft, and the designs are so unique. Best streetwear brand ever!",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/woman-smiling_1187-1107.jpg?_wi=3",
imageAlt: "Sarah Chen profile",
},
{
id: "3",
name: "Marcus Williams",
handle: "@marcusfashion",
testimonial: "Great tees with excellent customer service. The designs stand out and compliments keep coming. Highly recommended!",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/young-businessman-happy-expression_1194-1674.jpg?_wi=3",
imageAlt: "Marcus Williams profile",
},
];
const socialLinks = [
{ icon: Instagram, href: "https://instagram.com", ariaLabel: "Instagram" },
{ icon: Twitter, href: "https://twitter.com", ariaLabel: "Twitter" },
{ icon: Facebook, href: "https://facebook.com", ariaLabel: "Facebook" },
{ icon: Pinterest, href: "https://pinterest.com", ariaLabel: "Pinterest" },
];
return (
<ThemeProvider
defaultButtonVariant="text-shift"
@@ -101,75 +22,28 @@ export default function ProductPage() {
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
brandName="Your Logo"
navItems={navItems}
navItems={[
{ name: "Home", id: "/" },
{ name: "Shop", id: "/shop" },
{ name: "Men", id: "/men" },
{ name: "Women", id: "/women" },
{ name: "About", id: "/about" },
{ name: "Contact", id: "/contact" }
]}
button={{ text: "Cart", href: "/cart" }}
animateOnLoad={true}
/>
</div>
<div id="product-details" data-section="product-details" className="mx-auto px-4 md:px-6 py-20">
<div className="max-w-4xl mx-auto">
<div className="grid grid-cols-1 md:grid-cols-2 gap-12 mb-16">
<div className="flex items-center justify-center bg-gray-100 rounded-lg overflow-hidden h-96">
<img
src="http://img.b2bpic.net/free-photo/shirt-mockup-concept-with-plain-clothing_23-2149448773.jpg"
alt="Bold Street Statement Tee"
className="w-full h-full object-cover"
/>
</div>
<div className="flex flex-col justify-center">
<h1 className="text-4xl font-bold text-foreground mb-2">Bold Street Statement Tee</h1>
<p className="text-lg text-gray-600 mb-4">Black • 5 Colors Available</p>
<p className="text-3xl font-semibold text-accent mb-6">$49.99</p>
<p className="text-gray-700 leading-relaxed mb-8">
Elevate your streetwear game with our Bold Street Statement Tee. Featuring premium quality fabric, exceptional graphic printing, and a modern design that stands out. Perfect for making a statement with style and confidence.
</p>
<div className="flex gap-4 mb-8">
<button className="px-8 py-3 bg-foreground text-white rounded-lg font-semibold hover:bg-opacity-90 transition">
Add to Cart
</button>
<button className="px-8 py-3 border-2 border-foreground text-foreground rounded-lg font-semibold hover:bg-foreground hover:text-white transition">
View Size Guide
</button>
</div>
</div>
</div>
</div>
</div>
<div id="related-products" data-section="related-products">
<ProductCardFour
title="You Might Also Like"
description="Explore more designs from our collection"
tag="Related"
textboxLayout="default"
gridVariant="uniform-all-items-equal"
animationType="slide-up"
useInvertedBackground={false}
products={relatedProducts}
carouselMode="buttons"
/>
</div>
<div id="product-testimonials" data-section="product-testimonials">
<TestimonialCardThirteen
title="Why Customers Love Our Tees"
description="Real reviews from customers who've made the switch"
tag="Reviews"
textboxLayout="default"
animationType="slide-up"
useInvertedBackground={false}
showRating={true}
testimonials={testimonials}
carouselMode="buttons"
/>
</div>
<div id="footer" data-section="footer">
<FooterCard
logoText="Your Logo"
copyrightText="© 2025 Your Logo. All rights reserved."
socialLinks={socialLinks}
socialLinks={[
{ icon: Instagram, href: "https://instagram.com", ariaLabel: "Instagram" },
{ icon: Twitter, href: "https://twitter.com", ariaLabel: "Twitter" },
{ icon: Facebook, href: "https://facebook.com", ariaLabel: "Facebook" }
]}
/>
</div>
</ThemeProvider>

184
src/app/returns/page.tsx
View File

@@ -1,10 +1,9 @@
"use client";
import Link from "next/link";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import FooterCard from "@/components/sections/footer/FooterCard";
import { Instagram, Twitter, Facebook, Pinterest, CheckCircle, Truck, Clock, RefreshCw } from "lucide-react";
import { Instagram, Twitter, Facebook } from "lucide-react";
export default function ReturnsPage() {
return (
@@ -29,192 +28,21 @@ export default function ReturnsPage() {
{ name: "Men", id: "/men" },
{ name: "Women", id: "/women" },
{ name: "About", id: "/about" },
{ name: "Contact", id: "/contact" },
{ name: "Contact", id: "/contact" }
]}
button={{
text: "Cart",
href: "/cart",
}}
button={{ text: "Cart", href: "/cart" }}
animateOnLoad={true}
/>
</div>
<div id="returns-header" data-section="returns-header" className="mx-auto px-4 md:px-6 py-20">
<div className="max-w-3xl mx-auto text-center">
<h1 className="text-5xl md:text-6xl font-bold text-foreground mb-6">Returns & Shipping</h1>
<p className="text-xl text-foreground/75 mb-8">
We want you to be completely satisfied with your purchase. Learn about our hassle-free return and shipping policies.
</p>
</div>
</div>
<div id="shipping-info" data-section="shipping-info" className="mx-auto px-4 md:px-6 py-16">
<div className="max-w-4xl mx-auto">
<div className="grid grid-cols-1 md:grid-cols-2 gap-8 mb-16">
<div className="bg-card rounded-lg p-8 border border-accent/10 shadow-sm">
<div className="flex items-center gap-3 mb-4">
<Truck className="w-8 h-8 text-accent" />
<h3 className="text-2xl font-bold text-foreground">Shipping Options</h3>
</div>
<div className="space-y-4">
<div>
<h4 className="font-semibold text-foreground mb-1">Standard Shipping (5-7 business days)</h4>
<p className="text-foreground/75 text-sm">Free on orders over $50. $6.99 for orders under $50.</p>
</div>
<div>
<h4 className="font-semibold text-foreground mb-1">Express Shipping (2-3 business days)</h4>
<p className="text-foreground/75 text-sm">$14.99 flat rate on all orders.</p>
</div>
<div>
<h4 className="font-semibold text-foreground mb-1">Overnight Shipping (1 business day)</h4>
<p className="text-foreground/75 text-sm">$24.99 flat rate on all orders.</p>
</div>
</div>
</div>
<div className="bg-card rounded-lg p-8 border border-accent/10 shadow-sm">
<div className="flex items-center gap-3 mb-4">
<Clock className="w-8 h-8 text-accent" />
<h3 className="text-2xl font-bold text-foreground">Processing Time</h3>
</div>
<div className="space-y-3">
<p className="text-foreground/75">
All orders are processed within <span className="font-semibold text-foreground">1-2 business days</span> of purchase. Orders placed on weekends or holidays will be processed on the next business day.
</p>
<p className="text-foreground/75">
Once your order ships, you'll receive a tracking number via email so you can monitor your package.
</p>
</div>
</div>
</div>
<div className="mb-16">
<h2 className="text-4xl font-bold text-foreground mb-8">Return Policy</h2>
<div className="bg-background-accent/20 rounded-lg p-8 mb-8">
<div className="flex items-start gap-3 mb-4">
<RefreshCw className="w-6 h-6 text-accent flex-shrink-0 mt-1" />
<div>
<h3 className="text-xl font-bold text-foreground mb-2">30-Day Money-Back Guarantee</h3>
<p className="text-foreground/75">
We offer a hassle-free 30-day return window from the date of delivery. If you're not completely satisfied, we'll process a full refund.
</p>
</div>
</div>
</div>
<div className="space-y-6">
<div className="border-l-4 border-accent pl-6">
<h4 className="text-lg font-semibold text-foreground mb-2">Condition Requirements</h4>
<p className="text-foreground/75 mb-3">Items must be:</p>
<ul className="space-y-2 text-foreground/75">
<li className="flex items-start gap-2">
<CheckCircle className="w-5 h-5 text-accent flex-shrink-0 mt-0.5" />
<span>Unworn and unwashed with all tags attached</span>
</li>
<li className="flex items-start gap-2">
<CheckCircle className="w-5 h-5 text-accent flex-shrink-0 mt-0.5" />
<span>In original packaging with receipt or order number</span>
</li>
<li className="flex items-start gap-2">
<CheckCircle className="w-5 h-5 text-accent flex-shrink-0 mt-0.5" />
<span>Free from damage or defects (normal wear excluded)</span>
</li>
</ul>
</div>
<div className="border-l-4 border-accent pl-6">
<h4 className="text-lg font-semibold text-foreground mb-2">How to Initiate a Return</h4>
<ol className="space-y-2 text-foreground/75 list-decimal list-inside">
<li>Contact our customer service team with your order number</li>
<li>Receive a prepaid return shipping label</li>
<li>Package your item securely with the label</li>
<li>Drop off at any shipping location</li>
<li>Receive your refund within 5-7 business days of delivery</li>
</ol>
</div>
<div className="border-l-4 border-accent pl-6">
<h4 className="text-lg font-semibold text-foreground mb-2">Defective Items</h4>
<p className="text-foreground/75">
If you receive a defective item, we'll replace it free of charge. Contact us with photos of the defect and your order number to get started. We'll provide prepaid return shipping.
</p>
</div>
<div className="border-l-4 border-accent pl-6">
<h4 className="text-lg font-semibold text-foreground mb-2">Refund Processing</h4>
<p className="text-foreground/75">
Refunds are processed within 5-7 business days of receiving your return. The refund will be issued to your original payment method. Please allow an additional 3-5 business days for the credit to appear in your account.
</p>
</div>
</div>
</div>
<div className="grid grid-cols-1 md:grid-cols-2 gap-8 mb-16">
<div className="bg-card rounded-lg p-8 border border-accent/10 shadow-sm">
<h3 className="text-2xl font-bold text-foreground mb-4">International Shipping</h3>
<p className="text-foreground/75 mb-4">
We currently ship to select countries. International orders typically take 10-21 business days to arrive.
</p>
<p className="text-foreground/75 mb-4">
Customers are responsible for any customs duties or import taxes required by their country.
</p>
<Link href="/contact" className="text-accent hover:text-accent/80 font-semibold">
Check available countries →
</Link>
</div>
<div className="bg-card rounded-lg p-8 border border-accent/10 shadow-sm">
<h3 className="text-2xl font-bold text-foreground mb-4">Questions?</h3>
<p className="text-foreground/75 mb-4">
Our customer service team is here to help with any questions about shipping, returns, or exchanges.
</p>
<p className="text-foreground/75 mb-6">
We typically respond to inquiries within 24 hours during business days.
</p>
<Link
href="/contact"
className="inline-block bg-primary-cta text-primary-cta-text px-6 py-3 rounded-lg font-semibold hover:opacity-90 transition-opacity"
>
Contact Us
</Link>
</div>
</div>
<div className="bg-background-accent/10 rounded-lg p-8 text-center border border-accent/20">
<h3 className="text-2xl font-bold text-foreground mb-3">Your Satisfaction is Our Priority</h3>
<p className="text-foreground/75 max-w-2xl mx-auto">
We stand behind the quality of our graphic tees. If for any reason you're not happy with your purchase, we'll make it right. No questions asked.
</p>
</div>
</div>
</div>
<div id="footer" data-section="footer">
<FooterCard
logoText="Your Logo"
copyrightText="© 2025 Your Logo. All rights reserved."
socialLinks={[
{
icon: Instagram,
href: "https://instagram.com",
ariaLabel: "Instagram",
},
{
icon: Twitter,
href: "https://twitter.com",
ariaLabel: "Twitter",
},
{
icon: Facebook,
href: "https://facebook.com",
ariaLabel: "Facebook",
},
{
icon: Pinterest,
href: "https://pinterest.com",
ariaLabel: "Pinterest",
},
{ icon: Instagram, href: "https://instagram.com", ariaLabel: "Instagram" },
{ icon: Twitter, href: "https://twitter.com", ariaLabel: "Twitter" },
{ icon: Facebook, href: "https://facebook.com", ariaLabel: "Facebook" }
]}
/>
</div>

138
src/app/shop/page.tsx
View File

@@ -2,10 +2,8 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import ProductCardFour from "@/components/sections/product/ProductCardFour";
import FooterCard from "@/components/sections/footer/FooterCard";
import Link from "next/link";
import { TrendingUp, Instagram, Twitter, Facebook, Pinterest } from "lucide-react";
import { Instagram, Twitter, Facebook } from "lucide-react";
export default function ShopPage() {
return (
@@ -21,148 +19,30 @@ export default function ShopPage() {
secondaryButtonStyle="radial-glow"
headingFontWeight="semibold"
>
{/* Navbar */}
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
brandName="Your Logo"
navItems={[
{ name: "Home", id: "/" },
{ name: "Shop", id: "/shop" },
{ name: "Men", id: "men-category" },
{ name: "Women", id: "women-category" },
{ name: "About", id: "about" },
{ name: "Contact", id: "contact" },
{ name: "Men", id: "/men" },
{ name: "Women", id: "/women" },
{ name: "About", id: "/about" },
{ name: "Contact", id: "/contact" }
]}
button={{
text: "Cart",
href: "/cart",
}}
button={{ text: "Cart", href: "/cart" }}
animateOnLoad={true}
/>
</div>
{/* Featured Products - First Product Set */}
<div id="shop-featured-1" data-section="shop-featured-1">
<ProductCardFour
title="All Products"
description="Browse our complete collection of premium graphic tees"
tag="Trending"
tagIcon={TrendingUp}
tagAnimation="slide-up"
textboxLayout="default"
animationType="slide-up"
useInvertedBackground={false}
products={[
{
id: "product-001",
name: "Bold Street Statement Tee",
price: "$49.99",
variant: "Black • 5 Colors",
imageSrc: "http://img.b2bpic.net/free-photo/shirt-mockup-concept-with-plain-clothing_23-2149448773.jpg?_wi=3",
imageAlt: "Bold street statement graphic t-shirt",
isFavorited: false,
},
{
id: "product-002",
name: "Minimal Modern Tee",
price: "$44.99",
variant: "White • 3 Colors",
imageSrc: "http://img.b2bpic.net/free-vector/merry-christmas-with-creative-card_23-2147578466.jpg?_wi=3",
imageAlt: "Minimal modern design graphic tee",
isFavorited: false,
},
{
id: "product-003",
name: "Vibrant Artistic Print",
price: "$54.99",
variant: "Multi • 4 Colors",
imageSrc: "http://img.b2bpic.net/free-vector/gospel-word-concept_23-2148717553.jpg?_wi=3",
imageAlt: "Vibrant artistic graphic t-shirt",
isFavorited: false,
},
{
id: "product-004",
name: "Contemporary Design Tee",
price: "$49.99",
variant: "Navy • 6 Colors",
imageSrc: "http://img.b2bpic.net/free-vector/crystal-typeface_1284-46616.jpg?_wi=3",
imageAlt: "Contemporary design graphic tee",
isFavorited: false,
},
]}
gridVariant="uniform-all-items-equal"
carouselMode="buttons"
/>
</div>
{/* Best Sellers - Second Product Set */}
<div id="shop-bestsellers" data-section="shop-bestsellers">
<ProductCardFour
title="Best Sellers"
description="Our most loved and highly-rated graphic tees"
textboxLayout="default"
animationType="slide-up"
useInvertedBackground={false}
products={[
{
id: "bestseller-001",
name: "Premium Comfort Essentials",
price: "$39.99",
variant: "Heather Grey • 4 Colors",
imageSrc: "http://img.b2bpic.net/free-photo/shirt-mockup-concept-with-plain-clothing_23-2149448773.jpg?_wi=4",
imageAlt: "Premium comfort essentials graphic tee",
isFavorited: false,
},
{
id: "bestseller-002",
name: "Signature Series Tee",
price: "$59.99",
variant: "Deep Black • 2 Colors",
imageSrc: "http://img.b2bpic.net/free-vector/gospel-word-concept_23-2148717553.jpg?_wi=4",
imageAlt: "Signature series graphic tee",
isFavorited: false,
},
{
id: "bestseller-003",
name: "Urban Heritage Tee",
price: "$54.99",
variant: "Cream • 3 Colors",
imageSrc: "http://img.b2bpic.net/free-vector/crystal-typeface_1284-46616.jpg?_wi=4",
imageAlt: "Urban heritage graphic tee",
isFavorited: false,
},
]}
gridVariant="uniform-all-items-equal"
carouselMode="buttons"
/>
</div>
{/* Footer */}
<div id="footer" data-section="footer">
<FooterCard
logoText="Your Logo"
copyrightText="© 2025 Your Logo. All rights reserved."
socialLinks={[
{
icon: Instagram,
href: "https://instagram.com",
ariaLabel: "Instagram",
},
{
icon: Twitter,
href: "https://twitter.com",
ariaLabel: "Twitter",
},
{
icon: Facebook,
href: "https://facebook.com",
ariaLabel: "Facebook",
},
{
icon: Pinterest,
href: "https://pinterest.com",
ariaLabel: "Pinterest",
},
{ icon: Instagram, href: "https://instagram.com", ariaLabel: "Instagram" },
{ icon: Twitter, href: "https://twitter.com", ariaLabel: "Twitter" },
{ icon: Facebook, href: "https://facebook.com", ariaLabel: "Facebook" }
]}
/>
</div>

197
src/app/size-guide/page.tsx
View File

@@ -1,10 +1,9 @@
"use client";
import Link from "next/link";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import FooterCard from "@/components/sections/footer/FooterCard";
import { Instagram, Twitter, Facebook, Pinterest } from "lucide-react";
import { Instagram, Twitter, Facebook } from "lucide-react";
export default function SizeGuidePage() {
return (
@@ -29,205 +28,21 @@ export default function SizeGuidePage() {
{ name: "Men", id: "/men" },
{ name: "Women", id: "/women" },
{ name: "About", id: "/about" },
{ name: "Contact", id: "/contact" },
{ name: "Contact", id: "/contact" }
]}
button={{
text: "Cart",
href: "/cart",
}}
button={{ text: "Cart", href: "/cart" }}
animateOnLoad={true}
/>
</div>
<div id="size-guide-header" data-section="size-guide-header" className="mx-auto px-4 md:px-6 py-20">
<div className="max-w-3xl mx-auto text-center">
<h1 className="text-5xl md:text-6xl font-bold text-foreground mb-6">Size Guide</h1>
<p className="text-xl text-foreground/75 mb-8">
Find your perfect fit with our comprehensive size chart and measurement guide
</p>
</div>
</div>
<div id="size-chart" data-section="size-chart" className="mx-auto px-4 md:px-6 py-16">
<div className="max-w-4xl mx-auto">
<div className="mb-12">
<h2 className="text-3xl font-bold text-foreground mb-8">Men's Sizing</h2>
<div className="overflow-x-auto">
<table className="w-full border-collapse">
<thead>
<tr className="bg-background-accent/30">
<th className="border border-accent/20 px-4 py-3 text-left font-semibold text-foreground">Size</th>
<th className="border border-accent/20 px-4 py-3 text-left font-semibold text-foreground">Chest (in)</th>
<th className="border border-accent/20 px-4 py-3 text-left font-semibold text-foreground">Length (in)</th>
<th className="border border-accent/20 px-4 py-3 text-left font-semibold text-foreground">Sleeve (in)</th>
</tr>
</thead>
<tbody>
<tr className="hover:bg-background-accent/10 transition-colors">
<td className="border border-accent/20 px-4 py-3 font-medium text-foreground">XS</td>
<td className="border border-accent/20 px-4 py-3 text-foreground">34-36</td>
<td className="border border-accent/20 px-4 py-3 text-foreground">27</td>
<td className="border border-accent/20 px-4 py-3 text-foreground">7.5</td>
</tr>
<tr className="bg-card hover:bg-background-accent/10 transition-colors">
<td className="border border-accent/20 px-4 py-3 font-medium text-foreground">S</td>
<td className="border border-accent/20 px-4 py-3 text-foreground">36-38</td>
<td className="border border-accent/20 px-4 py-3 text-foreground">28</td>
<td className="border border-accent/20 px-4 py-3 text-foreground">8</td>
</tr>
<tr className="hover:bg-background-accent/10 transition-colors">
<td className="border border-accent/20 px-4 py-3 font-medium text-foreground">M</td>
<td className="border border-accent/20 px-4 py-3 text-foreground">38-40</td>
<td className="border border-accent/20 px-4 py-3 text-foreground">29</td>
<td className="border border-accent/20 px-4 py-3 text-foreground">8.5</td>
</tr>
<tr className="bg-card hover:bg-background-accent/10 transition-colors">
<td className="border border-accent/20 px-4 py-3 font-medium text-foreground">L</td>
<td className="border border-accent/20 px-4 py-3 text-foreground">40-42</td>
<td className="border border-accent/20 px-4 py-3 text-foreground">30</td>
<td className="border border-accent/20 px-4 py-3 text-foreground">9</td>
</tr>
<tr className="hover:bg-background-accent/10 transition-colors">
<td className="border border-accent/20 px-4 py-3 font-medium text-foreground">XL</td>
<td className="border border-accent/20 px-4 py-3 text-foreground">42-44</td>
<td className="border border-accent/20 px-4 py-3 text-foreground">31</td>
<td className="border border-accent/20 px-4 py-3 text-foreground">9.5</td>
</tr>
<tr className="bg-card hover:bg-background-accent/10 transition-colors">
<td className="border border-accent/20 px-4 py-3 font-medium text-foreground">2XL</td>
<td className="border border-accent/20 px-4 py-3 text-foreground">44-46</td>
<td className="border border-accent/20 px-4 py-3 text-foreground">32</td>
<td className="border border-accent/20 px-4 py-3 text-foreground">10</td>
</tr>
</tbody>
</table>
</div>
</div>
<div className="mb-12">
<h2 className="text-3xl font-bold text-foreground mb-8">Women's Sizing</h2>
<div className="overflow-x-auto">
<table className="w-full border-collapse">
<thead>
<tr className="bg-background-accent/30">
<th className="border border-accent/20 px-4 py-3 text-left font-semibold text-foreground">Size</th>
<th className="border border-accent/20 px-4 py-3 text-left font-semibold text-foreground">Bust (in)</th>
<th className="border border-accent/20 px-4 py-3 text-left font-semibold text-foreground">Length (in)</th>
<th className="border border-accent/20 px-4 py-3 text-left font-semibold text-foreground">Sleeve (in)</th>
</tr>
</thead>
<tbody>
<tr className="hover:bg-background-accent/10 transition-colors">
<td className="border border-accent/20 px-4 py-3 font-medium text-foreground">XS</td>
<td className="border border-accent/20 px-4 py-3 text-foreground">32-34</td>
<td className="border border-accent/20 px-4 py-3 text-foreground">26</td>
<td className="border border-accent/20 px-4 py-3 text-foreground">7</td>
</tr>
<tr className="bg-card hover:bg-background-accent/10 transition-colors">
<td className="border border-accent/20 px-4 py-3 font-medium text-foreground">S</td>
<td className="border border-accent/20 px-4 py-3 text-foreground">34-36</td>
<td className="border border-accent/20 px-4 py-3 text-foreground">27</td>
<td className="border border-accent/20 px-4 py-3 text-foreground">7.5</td>
</tr>
<tr className="hover:bg-background-accent/10 transition-colors">
<td className="border border-accent/20 px-4 py-3 font-medium text-foreground">M</td>
<td className="border border-accent/20 px-4 py-3 text-foreground">36-38</td>
<td className="border border-accent/20 px-4 py-3 text-foreground">28</td>
<td className="border border-accent/20 px-4 py-3 text-foreground">8</td>
</tr>
<tr className="bg-card hover:bg-background-accent/10 transition-colors">
<td className="border border-accent/20 px-4 py-3 font-medium text-foreground">L</td>
<td className="border border-accent/20 px-4 py-3 text-foreground">38-40</td>
<td className="border border-accent/20 px-4 py-3 text-foreground">29</td>
<td className="border border-accent/20 px-4 py-3 text-foreground">8.5</td>
</tr>
<tr className="hover:bg-background-accent/10 transition-colors">
<td className="border border-accent/20 px-4 py-3 font-medium text-foreground">XL</td>
<td className="border border-accent/20 px-4 py-3 text-foreground">40-42</td>
<td className="border border-accent/20 px-4 py-3 text-foreground">30</td>
<td className="border border-accent/20 px-4 py-3 text-foreground">9</td>
</tr>
<tr className="bg-card hover:bg-background-accent/10 transition-colors">
<td className="border border-accent/20 px-4 py-3 font-medium text-foreground">2XL</td>
<td className="border border-accent/20 px-4 py-3 text-foreground">42-44</td>
<td className="border border-accent/20 px-4 py-3 text-foreground">31</td>
<td className="border border-accent/20 px-4 py-3 text-foreground">9.5</td>
</tr>
</tbody>
</table>
</div>
</div>
<div className="mb-12">
<h2 className="text-3xl font-bold text-foreground mb-6">How to Measure</h2>
<div className="grid grid-cols-1 md:grid-cols-2 gap-8">
<div className="bg-card rounded-lg p-6 border border-accent/10">
<h3 className="text-xl font-semibold text-foreground mb-3">Chest/Bust</h3>
<p className="text-foreground/75">
Measure around the fullest part of your chest or bust. Keep the measuring tape parallel to the ground and not too tight.
</p>
</div>
<div className="bg-card rounded-lg p-6 border border-accent/10">
<h3 className="text-xl font-semibold text-foreground mb-3">Length</h3>
<p className="text-foreground/75">
Measure from the top of your shoulder down to where you want the shirt to end. This determines how long the shirt will be.
</p>
</div>
<div className="bg-card rounded-lg p-6 border border-accent/10">
<h3 className="text-xl font-semibold text-foreground mb-3">Sleeve Length</h3>
<p className="text-foreground/75">
Measure from the center back of your neck, across your shoulder, and down to your wrist. This ensures sleeves fit perfectly.
</p>
</div>
<div className="bg-card rounded-lg p-6 border border-accent/10">
<h3 className="text-xl font-semibold text-foreground mb-3">Fit Tips</h3>
<p className="text-foreground/75">
Our tees are designed for a comfortable, relaxed fit. For a snug fit, size down. For an oversized look, size up.
</p>
</div>
</div>
</div>
<div className="bg-background-accent/20 rounded-lg p-8 text-center">
<h3 className="text-2xl font-bold text-foreground mb-3">Still Unsure About Your Size?</h3>
<p className="text-foreground/75 mb-6">
Contact our customer service team for personalized sizing recommendations
</p>
<Link
href="/contact"
className="inline-block bg-primary-cta text-primary-cta-text px-6 py-3 rounded-lg font-semibold hover:opacity-90 transition-opacity"
>
Get Help
</Link>
</div>
</div>
</div>
<div id="footer" data-section="footer">
<FooterCard
logoText="Your Logo"
copyrightText="© 2025 Your Logo. All rights reserved."
socialLinks={[
{
icon: Instagram,
href: "https://instagram.com",
ariaLabel: "Instagram",
},
{
icon: Twitter,
href: "https://twitter.com",
ariaLabel: "Twitter",
},
{
icon: Facebook,
href: "https://facebook.com",
ariaLabel: "Facebook",
},
{
icon: Pinterest,
href: "https://pinterest.com",
ariaLabel: "Pinterest",
},
{ icon: Instagram, href: "https://instagram.com", ariaLabel: "Instagram" },
{ icon: Twitter, href: "https://twitter.com", ariaLabel: "Twitter" },
{ icon: Facebook, href: "https://facebook.com", ariaLabel: "Facebook" }
]}
/>
</div>

156
src/app/terms/page.tsx
View File

@@ -3,19 +3,9 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import FooterCard from "@/components/sections/footer/FooterCard";
import Link from "next/link";
import { Instagram, Twitter, Facebook, Pinterest } from "lucide-react";
import { Instagram, Twitter, Facebook } from "lucide-react";
export default function TermsPage() {
const navItems = [
{ name: "Home", id: "/" },
{ name: "Shop", id: "/shop" },
{ name: "Men", id: "/men" },
{ name: "Women", id: "/women" },
{ name: "About", id: "/about" },
{ name: "Contact", id: "/contact" },
];
return (
<ThemeProvider
defaultButtonVariant="text-shift"
@@ -32,146 +22,30 @@ export default function TermsPage() {
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
brandName="Your Logo"
navItems={navItems}
button={{
text: "Cart",
href: "/cart",
}}
navItems={[
{ name: "Home", id: "/" },
{ name: "Shop", id: "/shop" },
{ name: "Men", id: "/men" },
{ name: "Women", id: "/women" },
{ name: "About", id: "/about" },
{ name: "Contact", id: "/contact" }
]}
button={{ text: "Cart", href: "/cart" }}
animateOnLoad={true}
/>
</div>
<main className="min-h-screen pt-32 pb-20">
<div className="mx-auto px-4 md:px-6 max-w-4xl">
<div className="mb-12">
<h1 className="text-5xl md:text-6xl font-bold mb-6 text-foreground">
Terms & Conditions
</h1>
<p className="text-lg text-foreground/75 mb-8">
Last updated: January 2025
</p>
</div>
<div className="space-y-8 text-foreground/80">
<section>
<h2 className="text-2xl font-semibold mb-4 text-foreground">
1. Agreement to Terms
</h2>
<p className="mb-4 leading-relaxed">
By accessing and using this website, you accept and agree to be bound by the terms and provision of this agreement. If you do not agree to abide by the above, please do not use this service.
</p>
</section>
<section>
<h2 className="text-2xl font-semibold mb-4 text-foreground">
2. Use License
</h2>
<p className="mb-4 leading-relaxed">
Permission is granted to temporarily download one copy of the materials (information or software) on Your Logo's website for personal, non-commercial transitory viewing only. This is the grant of a license, not a transfer of title, and under this license you may not:
</p>
<ul className="list-disc list-inside space-y-2 ml-2">
<li>Modify or copy the materials</li>
<li>Use the materials for any commercial purpose or for any public display</li>
<li>Attempt to decompile or reverse engineer any software contained on the website</li>
<li>Remove any copyright or other proprietary notations from the materials</li>
<li>Transfer the materials to another person or "mirror" the materials on any other server</li>
</ul>
</section>
<section>
<h2 className="text-2xl font-semibold mb-4 text-foreground">
3. Disclaimer
</h2>
<p className="mb-4 leading-relaxed">
The materials on Your Logo's website are provided on an 'as is' basis. Your Logo makes no warranties, expressed or implied, and hereby disclaims and negates all other warranties including, without limitation, implied warranties or conditions of merchantability, fitness for a particular purpose, or non-infringement of intellectual property or other violation of rights.
</p>
</section>
<section>
<h2 className="text-2xl font-semibold mb-4 text-foreground">
4. Limitations
</h2>
<p className="mb-4 leading-relaxed">
In no event shall Your Logo or its suppliers be liable for any damages (including, without limitation, damages for loss of data or profit, or due to business interruption) arising out of the use or inability to use the materials on the website, even if Your Logo or an authorized representative has been notified orally or in writing of the possibility of such damage.
</p>
</section>
<section>
<h2 className="text-2xl font-semibold mb-4 text-foreground">
5. Accuracy of Materials
</h2>
<p className="mb-4 leading-relaxed">
The materials appearing on Your Logo's website could include technical, typographical, or photographic errors. Your Logo does not warrant that any of the materials on its website are accurate, complete, or current. Your Logo may make changes to the materials contained on its website at any time without notice.
</p>
</section>
<section>
<h2 className="text-2xl font-semibold mb-4 text-foreground">
6. Links
</h2>
<p className="mb-4 leading-relaxed">
Your Logo has not reviewed all of the sites linked to its website and is not responsible for the contents of any such linked site. The inclusion of any link does not imply endorsement by Your Logo of the site. Use of any such linked website is at the user's own risk.
</p>
</section>
<section>
<h2 className="text-2xl font-semibold mb-4 text-foreground">
7. Modifications
</h2>
<p className="mb-4 leading-relaxed">
Your Logo may revise these terms of service for its website at any time without notice. By using this website, you are agreeing to be bound by the then current version of these terms of service.
</p>
</section>
<section>
<h2 className="text-2xl font-semibold mb-4 text-foreground">
8. Governing Law
</h2>
<p className="mb-4 leading-relaxed">
These terms and conditions are governed by and construed in accordance with the laws of the United States, and you irrevocably submit to the exclusive jurisdiction of the courts in that location.
</p>
</section>
<section className="pt-8">
<Link
href="/"
className="inline-block px-6 py-3 bg-primary-cta text-primary-cta-text rounded-lg font-semibold hover:opacity-90 transition-opacity"
>
Back to Home
</Link>
</section>
</div>
</div>
</main>
<footer id="footer" data-section="footer" className="py-20">
<div id="footer" data-section="footer">
<FooterCard
logoText="Your Logo"
copyrightText="© 2025 Your Logo. All rights reserved."
socialLinks={[
{
icon: Instagram,
href: "https://instagram.com",
ariaLabel: "Instagram",
},
{
icon: Twitter,
href: "https://twitter.com",
ariaLabel: "Twitter",
},
{
icon: Facebook,
href: "https://facebook.com",
ariaLabel: "Facebook",
},
{
icon: Pinterest,
href: "https://pinterest.com",
ariaLabel: "Pinterest",
},
{ icon: Instagram, href: "https://instagram.com", ariaLabel: "Instagram" },
{ icon: Twitter, href: "https://twitter.com", ariaLabel: "Twitter" },
{ icon: Facebook, href: "https://facebook.com", ariaLabel: "Facebook" }
]}
/>
</footer>
</div>
</ThemeProvider>
);
}

181
src/app/women/page.tsx
View File

@@ -2,14 +2,10 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import HeroBillboardRotatedCarousel from "@/components/sections/hero/HeroBillboardRotatedCarousel";
import ProductCardFour from "@/components/sections/product/ProductCardFour";
import TestimonialCardThirteen from "@/components/sections/testimonial/TestimonialCardThirteen";
import FooterCard from "@/components/sections/footer/FooterCard";
import { Sparkles, TrendingUp, Heart, Instagram, Twitter, Facebook, Pinterest } from "lucide-react";
import Link from "next/link";
import { Instagram, Twitter, Facebook } from "lucide-react";
export default function WomensPage() {
export default function WomenPage() {
return (
<ThemeProvider
defaultButtonVariant="text-shift"
@@ -32,186 +28,21 @@ export default function WomensPage() {
{ name: "Men", id: "/men" },
{ name: "Women", id: "/women" },
{ name: "About", id: "/about" },
{ name: "Contact", id: "/contact" },
{ name: "Contact", id: "/contact" }
]}
button={{ text: "Cart", href: "/cart" }}
animateOnLoad={true}
/>
</div>
<div id="hero" data-section="hero">
<HeroBillboardRotatedCarousel
title="Women's Graphic T-Shirts Collection"
description="Express yourself with our premium women's graphic tees. Artistic designs, premium comfort, powerful style."
background={{ variant: "plain" }}
tag="New Collection"
tagIcon={Sparkles}
tagAnimation="slide-up"
buttons={[
{ text: "Shop Now", href: "/shop" },
{ text: "View All", href: "/shop" },
]}
buttonAnimation="slide-up"
carouselItems={[
{
id: "carousel-1",
imageSrc: "http://img.b2bpic.net/free-photo/woman-sitting-prepare-clothing-new-journey_53876-47006.jpg?_wi=2",
imageAlt: "Female model wearing bold graphic t-shirt",
},
{
id: "carousel-2",
imageSrc: "http://img.b2bpic.net/free-photo/natural-pigmented-cloths-laundry-wire-arrangement_23-2148734286.jpg?_wi=2",
imageAlt: "Women's collection overview",
},
{
id: "carousel-3",
imageSrc: "http://img.b2bpic.net/free-vector/merry-christmas-with-creative-card_23-2147578466.jpg?_wi=6",
imageAlt: "White minimalist graphic t-shirt",
},
{
id: "carousel-4",
imageSrc: "http://img.b2bpic.net/free-vector/gospel-word-concept_23-2148717553.jpg?_wi=7",
imageAlt: "Bold color graphic tee design",
},
{
id: "carousel-5",
imageSrc: "http://img.b2bpic.net/free-vector/crystal-typeface_1284-46616.jpg?_wi=7",
imageAlt: "Contemporary graphic t-shirt art",
},
{
id: "carousel-6",
imageSrc: "http://img.b2bpic.net/free-photo/graceful-woman-looking-shoulder-while-walking-city-outdoor-shot-pleasant-tanned-lady_291650-1699.jpg?_wi=2",
imageAlt: "Street style women's fashion showcase",
},
]}
autoPlay={true}
autoPlayInterval={4000}
ariaLabel="Women's collection hero section with product carousel"
/>
</div>
<div id="highlights" data-section="highlights">
<ProductCardFour
title="Featured Women's Tees"
description="Our best-selling graphic tees designed for the modern woman"
tag="Trending"
tagIcon={TrendingUp}
tagAnimation="slide-up"
textboxLayout="default"
animationType="slide-up"
useInvertedBackground={false}
products={[
{
id: "product-001",
name: "Bold Artistic Statement Tee",
price: "$49.99",
variant: "Black • 5 Colors",
imageSrc: "http://img.b2bpic.net/free-photo/shirt-mockup-concept-with-plain-clothing_23-2149448773.jpg?_wi=7",
imageAlt: "Bold artistic statement graphic t-shirt",
isFavorited: false,
},
{
id: "product-002",
name: "Minimal Chic Tee",
price: "$44.99",
variant: "White • 3 Colors",
imageSrc: "http://img.b2bpic.net/free-vector/merry-christmas-with-creative-card_23-2147578466.jpg?_wi=7",
imageAlt: "Minimal chic design graphic tee",
isFavorited: false,
},
{
id: "product-003",
name: "Vibrant Creative Print",
price: "$54.99",
variant: "Multi • 4 Colors",
imageSrc: "http://img.b2bpic.net/free-vector/gospel-word-concept_23-2148717553.jpg?_wi=8",
imageAlt: "Vibrant creative graphic t-shirt",
isFavorited: false,
},
{
id: "product-004",
name: "Modern Expressive Tee",
price: "$49.99",
variant: "Navy • 6 Colors",
imageSrc: "http://img.b2bpic.net/free-vector/crystal-typeface_1284-46616.jpg?_wi=8",
imageAlt: "Modern expressive graphic tee",
isFavorited: false,
},
]}
gridVariant="uniform-all-items-equal"
carouselMode="buttons"
/>
</div>
<div id="testimonials" data-section="testimonials">
<TestimonialCardThirteen
title="What Women Love About Our Tees"
description="Real feedback from real customers who rock our graphic tees"
tag="Reviews"
tagIcon={Heart}
tagAnimation="slide-up"
textboxLayout="default"
animationType="slide-up"
useInvertedBackground={false}
showRating={true}
testimonials={[
{
id: "2",
name: "Sarah Chen",
handle: "@sarahwears",
testimonial: "Love these tees! The printing is sharp, the material is soft, and the designs are so unique. Best streetwear brand ever!",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/woman-smiling_1187-1107.jpg?_wi=2",
imageAlt: "Sarah Chen profile",
},
{
id: "4",
name: "Emma Rodriguez",
handle: "@emmastyle",
testimonial: "Perfect for my wardrobe! The graphic quality is exceptional and the sizing is accurate. Will definitely buy more!",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-young-woman-looking-away_23-2147892778.jpg?_wi=2",
imageAlt: "Emma Rodriguez profile",
},
{
id: "6",
name: "Lisa Thompson",
handle: "@lisavibe",
testimonial: "Best graphic tees I've ever owned! The attention to detail is amazing and the material feels premium. 10/10!",
rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/positive-woman-smiling-sincerely-young-natural-looking-lady-student-age-wearing-blue-cotton-shirt_285396-4376.jpg?_wi=2",
imageAlt: "Lisa Thompson profile",
},
]}
carouselMode="buttons"
/>
</div>
<div id="footer" data-section="footer">
<FooterCard
logoText="Your Logo"
copyrightText="© 2025 Your Logo. All rights reserved."
socialLinks={[
{
icon: Instagram,
href: "https://instagram.com",
ariaLabel: "Instagram",
},
{
icon: Twitter,
href: "https://twitter.com",
ariaLabel: "Twitter",
},
{
icon: Facebook,
href: "https://facebook.com",
ariaLabel: "Facebook",
},
{
icon: Pinterest,
href: "https://pinterest.com",
ariaLabel: "Pinterest",
},
{ icon: Instagram, href: "https://instagram.com", ariaLabel: "Instagram" },
{ icon: Twitter, href: "https://twitter.com", ariaLabel: "Twitter" },
{ icon: Facebook, href: "https://facebook.com", ariaLabel: "Facebook" }
]}
/>
</div>