diff --git a/src/app/layout.tsx b/src/app/layout.tsx index a5e6bfc..202c726 100644 --- a/src/app/layout.tsx +++ b/src/app/layout.tsx @@ -1,55 +1,20 @@ import type { Metadata } from "next"; -import { Halant } from "next/font/google"; import { Inter } from "next/font/google"; -import { Nunito_Sans } from "next/font/google"; import "./globals.css"; -import { ServiceWrapper } from "@/components/ServiceWrapper"; -import Tag from "@/tag/Tag"; -const halant = Halant({ - variable: "--font-halant", subsets: ["latin"], - weight: ["300", "400", "500", "600", "700"], -}); - -const inter = Inter({ - variable: "--font-inter", subsets: ["latin"], -}); - -const nunitoSans = Nunito_Sans({ - variable: "--font-nunito-sans", subsets: ["latin"], -}); +const inter = Inter({ subsets: ["latin"] }); export const metadata: Metadata = { - title: "SWN Streetwear | Premium Hoodies & T-Shirts", description: "Discover authentic urban streetwear. Shop premium hoodies and t-shirts from SWN. Quality crafted pieces for modern style.", keywords: "streetwear, hoodies, t-shirts, urban fashion, premium apparel, SWN", robots: { - index: true, - follow: true, - }, - openGraph: { - title: "SWN Streetwear | Premium Hoodies & T-Shirts", description: "Discover authentic urban streetwear. Shop premium hoodies and t-shirts from SWN.", type: "website", siteName: "SWN Streetwear", images: [ - { - url: "http://img.b2bpic.net/free-photo/shallow-focus-two-black-men-standing-against-red-wall_181624-56204.jpg", alt: "SWN Streetwear Collection"}, - ], - }, - twitter: { - card: "summary_large_image", title: "SWN Streetwear | Premium Hoodies & T-Shirts", description: "Discover authentic urban streetwear. Shop premium hoodies and t-shirts.", images: [ - "http://img.b2bpic.net/free-photo/shallow-focus-two-black-men-standing-against-red-wall_181624-56204.jpg"], - }, -}; + title: "SWN Streetwear", description: "Premium urban fashion and streetwear"}; export default function RootLayout({ children, -}: Readonly<{ +}: { children: React.ReactNode; -}>) { +}) { return ( - - - - - {children} - + + {children} - ); } diff --git a/src/app/page.tsx b/src/app/page.tsx index e23f9b4..1a45c7a 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -29,10 +29,8 @@ export default function LandingPage() { ); -} \ No newline at end of file +} diff --git a/src/app/products/page.tsx b/src/app/products/page.tsx new file mode 100644 index 0000000..b29f9aa --- /dev/null +++ b/src/app/products/page.tsx @@ -0,0 +1,164 @@ +"use client"; + +import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; +import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen'; +import ProductCardFour from '@/components/sections/product/ProductCardFour'; +import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal'; +import { Package } from "lucide-react"; +import { useState } from "react"; + +export default function ProductsPage() { + const [selectedCategory, setSelectedCategory] = useState(null); + + const allProducts = [ + // Hoodies + { + id: "h1", name: "Classic Black Hoodie", price: "$89.00", variant: "Black 3 Colors", imageSrc: "http://img.b2bpic.net/free-photo/shallow-focus-two-black-men-standing-against-red-wall_181624-56204.jpg?_wi=1", imageAlt: "Classic Black Hoodie", category: "hoodies"}, + { + id: "h2", name: "Premium White Hoodie", price: "$95.00", variant: "White 2 Colors", imageSrc: "http://img.b2bpic.net/free-photo/positive-sportswoman-wears-sweatshirt-carries-fitness-mat-has-good-mood-after-practicing-yoga-workout-sits-relaxed-outdoors-urban-setting-has-happy-expression-people-active-lifestyle_273609-61335.jpg", imageAlt: "Premium White Hoodie", category: "hoodies"}, + { + id: "h3", name: "Charcoal Grey Hoodie", price: "$89.00", variant: "Grey 4 Colors", imageSrc: "http://img.b2bpic.net/free-photo/young-male-performer-dancing-building-stairs_23-2149344057.jpg", imageAlt: "Charcoal Grey Hoodie", category: "hoodies"}, + { + id: "h4", name: "Navy Blue Hoodie", price: "$92.00", variant: "Navy 2 Colors", imageSrc: "http://img.b2bpic.net/free-photo/upset-european-man-white-shirt-with-tattooed-arms-sitting-outdoors_181624-59916.jpg?_wi=1", imageAlt: "Navy Blue Hoodie", category: "hoodies"}, + // T-Shirts + { + id: "t1", name: "Oversized Gray Tee", price: "$45.00", variant: "Gray 5 Colors", imageSrc: "http://img.b2bpic.net/free-photo/upset-european-man-white-shirt-with-tattooed-arms-sitting-outdoors_181624-59916.jpg?_wi=2", imageAlt: "Oversized Gray Tee", category: "tees"}, + { + id: "t2", name: "Classic White Tee", price: "$39.00", variant: "White 3 Colors", imageSrc: "http://img.b2bpic.net/free-photo/beautiful-black-woman-with-afro-curls-hairstylesmiling-hipster-model-white-tshirt-sexy-carefree-female-posing-street-near-brown-wall-cheerful-happy-sunglasses_158538-21447.jpg", imageAlt: "Classic White Tee", category: "tees"}, + { + id: "t3", name: "Minimalist Black Tee", price: "$42.00", variant: "Black 2 Colors", imageSrc: "http://img.b2bpic.net/free-photo/upset-european-man-white-shirt-with-tattooed-arms-sitting-outdoors_181624-59916.jpg?_wi=3", imageAlt: "Minimalist Black Tee", category: "tees"}, + { + id: "t4", name: "Vintage Navy Tee", price: "$48.00", variant: "Navy 4 Colors", imageSrc: "http://img.b2bpic.net/free-photo/shallow-focus-two-black-men-standing-against-red-wall_181624-56204.jpg?_wi=3", imageAlt: "Vintage Navy Tee", category: "tees"}, + ]; + + const displayedProducts = selectedCategory + ? allProducts.filter((p) => p.category === selectedCategory) + : allProducts; + + const hoodieCount = allProducts.filter((p) => p.category === "hoodies").length; + const teeCount = allProducts.filter((p) => p.category === "tees").length; + + const products = displayedProducts.map((p) => ({ + id: p.id, + name: p.name, + price: p.price, + variant: p.variant, + imageSrc: p.imageSrc, + imageAlt: p.imageAlt, + })); + + return ( + + + + + + + + + Our Products + Browse our complete collection of premium hoodies and t-shirts + + + + setSelectedCategory(null)} + className={`px-6 py-2 rounded-full font-medium transition-all ${ + selectedCategory === null + ? "bg-black text-white" + : "bg-gray-200 text-black hover:bg-gray-300" + }`} + > + All Products ({allProducts.length}) + + setSelectedCategory("hoodies")} + className={`px-6 py-2 rounded-full font-medium transition-all ${ + selectedCategory === "hoodies" + ? "bg-black text-white" + : "bg-gray-200 text-black hover:bg-gray-300" + }`} + > + Hoodies ({hoodieCount}) + + setSelectedCategory("tees")} + className={`px-6 py-2 rounded-full font-medium transition-all ${ + selectedCategory === "tees" + ? "bg-black text-white" + : "bg-gray-200 text-black hover:bg-gray-300" + }`} + > + T-Shirts ({teeCount}) + + + + + + + + + + + + ); +}
Browse our complete collection of premium hoodies and t-shirts