Merge version_2 into main
Merge version_2 into main
This commit was merged in pull request #2.
This commit is contained in:
@@ -1,39 +1,27 @@
|
||||
import type { Metadata } from "next";
|
||||
import { Halant } from "next/font/google";
|
||||
import { Inter } from "next/font/google";
|
||||
import { Lato } from "next/font/google";
|
||||
import { DM_Sans } from "next/font/google";
|
||||
import { Archivo } 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 dmSans = DM_Sans({
|
||||
variable: "--font-dm-sans", subsets: ["latin"],
|
||||
});
|
||||
|
||||
const inter = Inter({
|
||||
variable: "--font-inter", subsets: ["latin"],
|
||||
});
|
||||
|
||||
const lato = Lato({
|
||||
variable: "--font-lato", subsets: ["latin"],
|
||||
weight: ["100", "300", "400", "700", "900"],
|
||||
const archivo = Archivo({
|
||||
variable: "--font-archivo", subsets: ["latin"],
|
||||
});
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "StyleHub - Premium Fashion & Clothing Store", description: "Discover premium quality clothing and accessories curated for your unique style. Shop our exclusive collection of fashion pieces with fast shipping worldwide.", keywords: "clothing store, fashion, premium apparel, online shopping, designer clothes", robots: {
|
||||
title: "BRUTALIST DROP - Premium Streetwear", description: "Minimalist brutalist dark mode premium streetwear e-commerce. Limited drops of 340 gsm cotton blend pieces made in Poland.", keywords: "streetwear, brutalist fashion, premium apparel, limited drops, quality control, made in Poland", robots: {
|
||||
index: true,
|
||||
follow: true,
|
||||
},
|
||||
openGraph: {
|
||||
title: "StyleHub - Premium Fashion & Clothing", description: "Explore our curated collection of premium fashion and accessories", type: "website", siteName: "StyleHub", images: [
|
||||
{
|
||||
url: "http://img.b2bpic.net/free-photo/beautiful-fashionable-brunette-wearing-trendy-clothing-sunglasses_613910-637.jpg", alt: "StyleHub Fashion Collection"},
|
||||
],
|
||||
},
|
||||
title: "BRUTALIST DROP - Premium Streetwear", description: "Limited drops of premium brutalist streetwear pieces", type: "website", siteName: "BRUTALIST DROP"},
|
||||
twitter: {
|
||||
card: "summary_large_image", title: "StyleHub - Premium Fashion Store", description: "Shop premium clothing and accessories with StyleHub", images: ["http://img.b2bpic.net/free-photo/beautiful-fashionable-brunette-wearing-trendy-clothing-sunglasses_613910-637.jpg"],
|
||||
},
|
||||
card: "summary_large_image", title: "BRUTALIST DROP - Premium Streetwear", description: "Limited drops of premium brutalist streetwear pieces"},
|
||||
};
|
||||
|
||||
export default function RootLayout({
|
||||
@@ -45,7 +33,7 @@ export default function RootLayout({
|
||||
<html lang="en" suppressHydrationWarning>
|
||||
<ServiceWrapper>
|
||||
<body
|
||||
className={`${halant.variable} ${inter.variable} ${lato.variable} antialiased`}
|
||||
className={`${dmSans.variable} ${archivo.variable} antialiased`}
|
||||
>
|
||||
<Tag />
|
||||
{children}
|
||||
|
||||
150
src/app/page.tsx
150
src/app/page.tsx
@@ -1,6 +1,6 @@
|
||||
"use client";
|
||||
|
||||
import { Mail } from "lucide-react";
|
||||
import { Clock, ShoppingCart } from "lucide-react";
|
||||
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
||||
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
|
||||
import HeroCarouselLogo from "@/components/sections/hero/heroCarouselLogo/HeroCarouselLogo";
|
||||
@@ -14,65 +14,66 @@ import FooterSimple from "@/components/sections/footer/FooterSimple";
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="text-stagger"
|
||||
defaultTextAnimation="reveal-blur"
|
||||
borderRadius="pill"
|
||||
contentWidth="compact"
|
||||
sizing="large"
|
||||
background="noiseDiagonalGradient"
|
||||
cardStyle="gradient-bordered"
|
||||
primaryButtonStyle="diagonal-gradient"
|
||||
secondaryButtonStyle="layered"
|
||||
headingFontWeight="light"
|
||||
defaultButtonVariant="directional-hover"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="rounded"
|
||||
contentWidth="medium"
|
||||
sizing="largeSizeMediumTitles"
|
||||
background="none"
|
||||
cardStyle="solid"
|
||||
primaryButtonStyle="flat"
|
||||
secondaryButtonStyle="solid"
|
||||
headingFontWeight="bold"
|
||||
>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingInline
|
||||
brandName="StyleHub"
|
||||
brandName="BRUTALIST"
|
||||
navItems={[
|
||||
{ name: "Home", id: "home" },
|
||||
{ name: "Shop", id: "products" },
|
||||
{ name: "About", id: "about" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
{ name: "ARCHIVE", id: "products" },
|
||||
{ name: "SHOP", id: "products" },
|
||||
{ name: "DISCIPLINE", id: "about" },
|
||||
{ name: "CART", id: "contact" },
|
||||
]}
|
||||
button={{ text: "Shop Now", href: "#products" }}
|
||||
button={{ text: "DROP IS LIVE", href: "#products" }}
|
||||
animateOnLoad={true}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroCarouselLogo
|
||||
logoText="STYLEHUB"
|
||||
description="Discover the finest collection of premium clothing and accessories curated for your unique style"
|
||||
logoText="DROP IS LIVE"
|
||||
description="340 GSM COTTON BLEND | MADE IN POLAND | LIMITED AVAILABILITY"
|
||||
buttons={[
|
||||
{ text: "Shop Collection", href: "#products" },
|
||||
{ text: "Learn More", href: "#about" },
|
||||
{ text: "DROP IS LIVE", href: "#products" },
|
||||
{ text: "COUNTDOWN", href: "#about" },
|
||||
]}
|
||||
slides={[
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/beautiful-fashionable-brunette-wearing-trendy-clothing-sunglasses_613910-637.jpg", imageAlt: "Fashion collection showcase"},
|
||||
imageSrc: "https://images.unsplash.com/photo-1552062407-291826716aeb?w=1000&h=1200&fit=crop", imageAlt: "Brutalist streetwear collection"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/elegant-clothing-store-hangers-with-selection-shirts-various-colors_482257-118470.jpg", imageAlt: "Boutique display"},
|
||||
imageSrc: "https://images.unsplash.com/photo-1556821552-5fefe8c9ef14?w=1000&h=1200&fit=crop", imageAlt: "Premium cotton blend fabric"},
|
||||
{
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/clothes-hang_1339-3092.jpg", imageAlt: "Clothing collection"},
|
||||
imageSrc: "https://images.unsplash.com/photo-1618519000696-3cf33a47ce41?w=1000&h=1200&fit=crop", imageAlt: "Made in Poland certification"},
|
||||
]}
|
||||
autoplayDelay={4000}
|
||||
autoplayDelay={5000}
|
||||
showDimOverlay={true}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="products" data-section="products">
|
||||
<ProductCardThree
|
||||
title="Featured Collection"
|
||||
description="Explore our carefully selected premium clothing pieces"
|
||||
title="RAW COLLECTION"
|
||||
description="340 GSM COTTON BLEND | TECHNICAL SPECIFICATIONS | QUALITY CONTROL VERIFIED | MADE IN POLAND"
|
||||
tag="LIMITED DROP"
|
||||
products={[
|
||||
{
|
||||
id: "1", name: "Premium Cotton T-Shirt", price: "$45.00", imageSrc: "http://img.b2bpic.net/free-photo/young-african-american-woman-with-dark-curly-hair-sunglasses-tshirt-pretty-woman-with-blond-hair-shirt-dreamily-looking-camera-while-spending-time-together_574295-5031.jpg", imageAlt: "Premium Cotton T-Shirt", initialQuantity: 1,
|
||||
id: "1", name: "Oversized Technical Tee", price: "$129.00", imageSrc: "https://images.unsplash.com/photo-1521572163474-6864f9cf17ab?w=500&h=600&fit=crop", imageAlt: "Oversized Technical Tee - 340 GSM", initialQuantity: 1,
|
||||
},
|
||||
{
|
||||
id: "2", name: "Classic Denim Jeans", price: "$89.00", imageSrc: "http://img.b2bpic.net/free-photo/blue-jeans-fabric-details_150588-48.jpg", imageAlt: "Classic Denim Jeans", initialQuantity: 1,
|
||||
id: "2", name: "Heavy Duty Cargo Pants", price: "$199.00", imageSrc: "https://images.unsplash.com/photo-1542272604-787c62d465d1?w=500&h=600&fit=crop", imageAlt: "Heavy Duty Cargo Pants - 340 GSM Cotton Blend", initialQuantity: 1,
|
||||
},
|
||||
{
|
||||
id: "3", name: "Elegant Evening Dress", price: "$145.00", imageSrc: "http://img.b2bpic.net/free-photo/fashion-portrait-young-elegant-woman_1328-2706.jpg", imageAlt: "Elegant Evening Dress", initialQuantity: 1,
|
||||
id: "3", name: "Brutalist Hoodie", price: "$179.00", imageSrc: "https://images.unsplash.com/photo-1556821552-5fefe8c9ef14?w=500&h=600&fit=crop", imageAlt: "Brutalist Hoodie - Premium Quality", initialQuantity: 1,
|
||||
},
|
||||
]}
|
||||
textboxLayout="default"
|
||||
@@ -84,70 +85,70 @@ export default function LandingPage() {
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<TextAbout
|
||||
tag="About Us"
|
||||
title="Crafted Quality, Timeless Style - Your Destination for Premium Fashion"
|
||||
buttons={[{ text: "Explore Our Story", href: "#contact" }]}
|
||||
tag="QUALITY CONTROL"
|
||||
title="340 GSM COTTON BLEND | MADE IN POLAND | VERIFIED CRAFTSMANSHIP"
|
||||
buttons={[{ text: "VIEW SPECIFICATIONS", href: "#contact" }]}
|
||||
useInvertedBackground={false}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardSix
|
||||
title="What Our Customers Say"
|
||||
description="Hear from satisfied customers who love our fashion collection"
|
||||
title="COMMUNITY VOICES"
|
||||
description="Raw feedback from the BRUTALIST community"
|
||||
textboxLayout="default"
|
||||
animationType="slide-up"
|
||||
useInvertedBackground={false}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1", name: "Sarah Mitchell", handle: "@sarahmstyle", testimonial: "StyleHub has completely transformed my wardrobe! The quality and attention to detail is incredible. I've never felt more confident in my clothing choices.", imageSrc: "http://img.b2bpic.net/free-photo/indoor-shot-glad-young-bearded-man-mustache-wears-denim-shirt-smiles-happily_273609-8698.jpg", imageAlt: "Sarah Mitchell"},
|
||||
id: "1", name: "Marcus Chen", handle: "@brutalist_style", testimonial: "The 340 GSM weight is unmatched. This is what premium streetwear should feel like. Made in Poland quality is evident in every stitch.", imageSrc: "https://images.unsplash.com/photo-1507003211169-0a1dd7228f2d?w=400&h=400&fit=crop", imageAlt: "Marcus Chen"},
|
||||
{
|
||||
id: "2", name: "James Chen", handle: "@jameschendesign", testimonial: "The collection is absolutely fantastic. Every piece I've purchased has exceeded my expectations. StyleHub is now my go-to for premium fashion.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=1", imageAlt: "James Chen"},
|
||||
id: "2", name: "Sofia Rodriguez", handle: "@raw_aesthetic", testimonial: "The brutalist design philosophy combined with technical specs makes this collection standout. Limited drops keep it exclusive.", imageSrc: "https://images.unsplash.com/photo-1494790108377-be9c29b29330?w=400&h=400&fit=crop", imageAlt: "Sofia Rodriguez"},
|
||||
{
|
||||
id: "3", name: "Emma Rodriguez", handle: "@emmarodfashion", testimonial: "I love the curated selection and the way StyleHub makes shopping so easy. The shipping was fast and the packaging was beautiful. Highly recommend!", imageSrc: "http://img.b2bpic.net/free-photo/confident-european-businesswoman-mockup-psd-smiling-closeup-port_53876-143277.jpg", imageAlt: "Emma Rodriguez"},
|
||||
id: "3", name: "Alex Thompson", handle: "@quality_first", testimonial: "Quality control is no joke here. Every piece I received exceeded expectations. This is streetwear done right.", imageSrc: "https://images.unsplash.com/photo-1500648767791-00dcc994a43e?w=400&h=400&fit=crop", imageAlt: "Alex Thompson"},
|
||||
{
|
||||
id: "4", name: "Michael Thompson", handle: "@mthompson_style", testimonial: "StyleHub offers the best quality-to-price ratio I've found. Their customer service is outstanding, and every purchase has been a delight.", imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg?_wi=2", imageAlt: "Michael Thompson"},
|
||||
id: "4", name: "Jordan Lee", handle: "@drop_culture", testimonial: "The limited availability creates real value. Made in Poland means ethical production. This is the future of streetwear.", imageSrc: "https://images.unsplash.com/photo-1506794778202-cad84cf45f1d?w=400&h=400&fit=crop", imageAlt: "Jordan Lee"},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqDouble
|
||||
title="Frequently Asked Questions"
|
||||
description="Find answers to common questions about our products and services"
|
||||
title="TECHNICAL SPECIFICATIONS & CARE"
|
||||
description="Everything you need to know about our 340 GSM cotton blend pieces"
|
||||
textboxLayout="default"
|
||||
faqsAnimation="slide-up"
|
||||
useInvertedBackground={false}
|
||||
faqs={[
|
||||
{
|
||||
id: "1", title: "What is your return policy?", content: "We offer a 30-day money-back guarantee on all clothing items. Simply return your purchase in original condition with the tags attached for a full refund."},
|
||||
id: "1", title: "What is 340 GSM cotton blend?", content: "340 GSM (grams per square meter) indicates premium weight and density. Our cotton blend combines durability with breathability. Made in Poland using ethical manufacturing standards."},
|
||||
{
|
||||
id: "2", title: "How long does shipping take?", content: "Standard shipping typically takes 5-7 business days. We also offer express shipping options for 2-3 business day delivery and overnight delivery."},
|
||||
id: "2", title: "How limited are these drops?", content: "Each drop is intentionally limited to maintain exclusivity and quality control. Production runs are capped at 500 units per design. Once sold out, pieces are retired from the collection."},
|
||||
{
|
||||
id: "3", title: "Do you ship internationally?", content: "Yes, we ship to over 100 countries worldwide. International shipping costs vary by location and are calculated at checkout."},
|
||||
id: "3", title: "What quality control process do you use?", content: "Every piece undergoes multi-point inspection for stitching, fabric weight, color consistency, and finish quality. We maintain strict Made in Poland manufacturing standards throughout production."},
|
||||
{
|
||||
id: "4", title: "Are your products sustainable?", content: "We are committed to sustainability. Many of our items are made from eco-friendly materials, and we partner with ethical manufacturers."},
|
||||
id: "4", title: "How do I care for 340 GSM pieces?", content: "Machine wash cold with similar colors. The 340 GSM weight provides superior durability. Avoid bleach. Air dry for longevity. These pieces are designed to last for years."},
|
||||
{
|
||||
id: "5", title: "How do I know my size?", content: "Each product page includes detailed sizing charts. We recommend measuring yourself using the provided guidelines. If you're between sizes, we suggest sizing up for comfort."},
|
||||
id: "5", title: "Is there a countdown timer for drops?", content: "Yes, each drop has a live countdown timer showing availability hours. When the timer hits zero, pieces are either sold out or moved to archive. Check back for the next drop announcement."},
|
||||
{
|
||||
id: "6", title: "Can I modify my order after placing it?", content: "Orders can be modified within 2 hours of purchase. After that, please contact our customer service team for assistance."},
|
||||
id: "6", title: "Can I see the production details?", content: "Each piece includes detailed specs: GSM weight, fabric composition, country of origin (Poland), and batch number. Scan the QR code on the tag to view full production documentation."},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactFaq
|
||||
ctaTitle="Get In Touch"
|
||||
ctaDescription="Have questions? Our dedicated customer service team is here to help and answer any inquiries about our products."
|
||||
ctaButton={{ text: "Contact Us", href: "mailto:hello@stylehub.com" }}
|
||||
ctaIcon={Mail}
|
||||
ctaTitle="COMMUNITY FIRST"
|
||||
ctaDescription="Join the BRUTALIST movement. Follow us on TikTok for user-generated content, behind-the-scenes production, and drop announcements."
|
||||
ctaButton={{ text: "@BRUTALIST.DROPS", href: "https://tiktok.com" }}
|
||||
ctaIcon={ShoppingCart}
|
||||
faqs={[
|
||||
{
|
||||
id: "1", title: "How can I contact customer support?", content: "You can reach us via email at hello@stylehub.com, through our contact form, or call our support line Monday-Friday 9AM-6PM EST."},
|
||||
id: "1", title: "How do I stay updated on drops?", content: "Follow @BRUTALIST.DROPS on TikTok for live drop announcements, countdown timers, and exclusive user-generated content from the community."},
|
||||
{
|
||||
id: "2", title: "What payment methods do you accept?", content: "We accept all major credit cards, PayPal, Apple Pay, Google Pay, and installment payment plans through select providers."},
|
||||
id: "2", title: "How do I submit user videos for the social wall?", content: "Tag @BRUTALIST.DROPS in your TikTok videos wearing our pieces. Use #BRUTALISTDROP in captions. Your videos may be featured on our social wall and site."},
|
||||
{
|
||||
id: "3", title: "Do you offer gift cards?", content: "Yes! We offer digital and physical gift cards in various denominations. They never expire and can be used on any item in our store."},
|
||||
id: "3", title: "What payment methods do you accept?", content: "We accept all major credit cards, PayPal, Apple Pay, and Google Pay. All transactions are secure and encrypted for your protection."},
|
||||
]}
|
||||
useInvertedBackground={false}
|
||||
animationType="slide-up"
|
||||
@@ -158,39 +159,40 @@ export default function LandingPage() {
|
||||
<FooterSimple
|
||||
columns={[
|
||||
{
|
||||
title: "Shop", items: [
|
||||
{ label: "Men's Collection", href: "#products" },
|
||||
{ label: "Women's Collection", href: "#products" },
|
||||
{ label: "Accessories", href: "#products" },
|
||||
{ label: "Sale", href: "#products" },
|
||||
title: "SHOP", items: [
|
||||
{ label: "Current Drop", href: "#products" },
|
||||
{ label: "Archive", href: "#products" },
|
||||
{ label: "Quality Control", href: "#about" },
|
||||
{ label: "Made in Poland", href: "#products" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Company", items: [
|
||||
{ label: "About Us", href: "#about" },
|
||||
{ label: "Blog", href: "#" },
|
||||
{ label: "Careers", href: "#" },
|
||||
{ label: "Press", href: "#" },
|
||||
title: "DISCIPLINE", items: [
|
||||
{ label: "Our Philosophy", href: "#about" },
|
||||
{ label: "Production Process", href: "#about" },
|
||||
{ label: "Ethical Standards", href: "#about" },
|
||||
{ label: "Brutalist Design", href: "#about" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support", items: [
|
||||
title: "COMMUNITY", items: [
|
||||
{ label: "TikTok", href: "https://tiktok.com" },
|
||||
{ label: "User Videos", href: "#contact" },
|
||||
{ label: "Testimonials", href: "#testimonials" },
|
||||
{ label: "FAQ", href: "#faq" },
|
||||
{ label: "Contact", href: "#contact" },
|
||||
{ label: "Shipping Info", href: "#" },
|
||||
{ label: "Returns", href: "#" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Legal", items: [
|
||||
{ label: "Privacy Policy", href: "#" },
|
||||
{ label: "Terms of Service", href: "#" },
|
||||
{ label: "Cookie Policy", href: "#" },
|
||||
title: "SUPPORT", items: [
|
||||
{ label: "Contact", href: "#contact" },
|
||||
{ label: "Shipping", href: "#" },
|
||||
{ label: "Returns", href: "#" },
|
||||
{ label: "Size Guide", href: "#" },
|
||||
],
|
||||
},
|
||||
]}
|
||||
bottomLeftText="© 2025 StyleHub. All rights reserved."
|
||||
bottomRightText="Made with passion for fashion"
|
||||
bottomLeftText="© 2025 BRUTALIST DROP. All rights reserved."
|
||||
bottomRightText="340 GSM COTTON BLEND | MADE IN POLAND | LIMITED DROPS ONLY"
|
||||
/>
|
||||
</div>
|
||||
</ThemeProvider>
|
||||
|
||||
@@ -11,7 +11,7 @@ html {
|
||||
body {
|
||||
background-color: var(--background);
|
||||
color: var(--foreground);
|
||||
font-family: var(--font-lato), sans-serif;
|
||||
font-family: var(--font-dm-sans), sans-serif;
|
||||
position: relative;
|
||||
min-height: 100vh;
|
||||
overscroll-behavior: none;
|
||||
@@ -24,5 +24,5 @@ h3,
|
||||
h4,
|
||||
h5,
|
||||
h6 {
|
||||
font-family: var(--font-lato), sans-serif;
|
||||
font-family: var(--font-dm-sans), sans-serif;
|
||||
}
|
||||
|
||||
@@ -10,15 +10,15 @@
|
||||
--accent: #ffffff;
|
||||
--background-accent: #ffffff; */
|
||||
|
||||
--background: #f6f0e9;
|
||||
--card: #efe7dd;
|
||||
--foreground: #2b180a;
|
||||
--primary-cta: #2b180a;
|
||||
--background: #0a0a0a;
|
||||
--card: #1a1a1a;
|
||||
--foreground: #ffffffe6;
|
||||
--primary-cta: #e6e6e6;
|
||||
--primary-cta-text: #f6f0e9;
|
||||
--secondary-cta: #efe7dd;
|
||||
--secondary-cta: #1a1a1a;
|
||||
--secondary-cta-text: #2b180a;
|
||||
--accent: #94877c;
|
||||
--background-accent: #afa094;
|
||||
--accent: #737373;
|
||||
--background-accent: #737373;
|
||||
|
||||
/* text sizing - set by ThemeProvider */
|
||||
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
|
||||
|
||||
Reference in New Issue
Block a user