bender/f590f240-8e06-433b-9fc1-e7f514345fc5
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge version_1 into main #2

Merged
bender merged 3 commits from version_1 into main 2026-03-13 09:32:42 +00:00
Conversation 0 Commits 3 Files Changed 3 +72 -226
3 changed files with 72 additions and 226 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -34,7 +34,7 @@ export default function ContactPage() {
borderRadius="pill"
contentWidth="compact"
sizing="largeSmallSizeMediumTitles"
background="grid"
background="circleGradient"
cardStyle="glass-elevated"
primaryButtonStyle="shadow"
secondaryButtonStyle="radial-glow"
@@ -56,9 +56,9 @@ export default function ContactPage() {
title="Stay Updated with Latest Trends"
description="Subscribe to our newsletter and be the first to know about new collections, exclusive offers, and styling tips from our fashion experts."
tagAnimation="slide-up"
background={{ variant: "grid" }}
background={{ variant: "plain" }}
useInvertedBackground={true}
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=a3zdy1&_wi=2"
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=a3zdy1"
imageAlt="Fashion store environment"
mediaAnimation="blur-reveal"
mediaPosition="right"
@@ -73,35 +73,20 @@ export default function ContactPage() {
<FaqSplitMedia
faqs={[
{
id: "1",
title: "What is your return policy?",
content:
"We offer a 30-day money-back guarantee on all items. If you're not satisfied with your purchase, simply return it within 30 days for a full refund. Items must be unworn and in original condition.",
},
id: "1", title: "What is your return policy?", content:
"We offer a 30-day money-back guarantee on all items. If you're not satisfied with your purchase, simply return it within 30 days for a full refund. Items must be unworn and in original condition."},
{
id: "2",
title: "How long does shipping take?",
content:
"Standard shipping typically takes 5-7 business days. We also offer expedited shipping (2-3 business days) and international shipping options. Free shipping on orders over $50!",
},
id: "2", title: "How long does shipping take?", content:
"Standard shipping typically takes 5-7 business days. We also offer expedited shipping (2-3 business days) and international shipping options. Free shipping on orders over $50!"},
{
id: "3",
title: "Do you have a size guide?",
content:
"Yes! Each product page includes a detailed size chart. We recommend measuring yourself and comparing with our guide to ensure the perfect fit. Contact our team if you need personalized sizing advice.",
},
id: "3", title: "Do you have a size guide?", content:
"Yes! Each product page includes a detailed size chart. We recommend measuring yourself and comparing with our guide to ensure the perfect fit. Contact our team if you need personalized sizing advice."},
{
id: "4",
title: "Are your items authentic?",
content:
"Absolutely. We only source from authorized retailers and work directly with brands. Every item undergoes quality verification before shipping to ensure authenticity and quality standards.",
},
id: "4", title: "Are your items authentic?", content:
"Absolutely. We only source from authorized retailers and work directly with brands. Every item undergoes quality verification before shipping to ensure authenticity and quality standards."},
{
id: "5",
title: "Can I exchange an item?",
content:
"Yes, exchanges are free within 60 days of purchase. Simply contact our support team with your order number and the item you'd like to exchange. We'll process it promptly.",
},
id: "5", title: "Can I exchange an item?", content:
"Yes, exchanges are free within 60 days of purchase. Simply contact our support team with your order number and the item you'd like to exchange. We'll process it promptly."},
]}
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=x8lwqq"
imageAlt="Customer support and help"

205
src/app/page.tsx
View File

@@ -22,7 +22,7 @@ export default function HomePage() {
borderRadius="pill"
contentWidth="compact"
sizing="largeSmallSizeMediumTitles"
background="grid"
background="circleGradient"
cardStyle="glass-elevated"
primaryButtonStyle="shadow"
secondaryButtonStyle="radial-glow"
@@ -39,9 +39,7 @@ export default function HomePage() {
{ name: "Contact", id: "#contact" },
]}
button={{
text: "Shop Now",
href: "/shop",
}}
text: "Shop Now", href: "/shop"}}
/>
</div>
@@ -52,7 +50,7 @@ export default function HomePage() {
tag="New Collection"
tagIcon={Sparkles}
tagAnimation="slide-up"
background={{ variant: "grid" }}
background={{ variant: "plain" }}
useInvertedBackground={false}
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=n3zo80"
imageAlt="Premium clothing collection showcase"
@@ -60,34 +58,20 @@ export default function HomePage() {
mediaAnimation="blur-reveal"
buttons={[
{
text: "Shop Now",
href: "/shop",
},
text: "Shop Now", href: "/shop"},
{
text: "View Lookbook",
href: "#",
},
text: "View Lookbook", href: "#"},
]}
buttonAnimation="slide-up"
testimonials={[
{
name: "Emma Richardson",
handle: "Fashion Enthusiast",
testimonial:
"StyleHub has become my go-to for quality fashion. The selection is incredible and delivery is always on time!",
rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=8x0zp5&_wi=1",
imageAlt: "Emma Richardson",
},
name: "Emma Richardson", handle: "Fashion Enthusiast", testimonial:
"StyleHub has become my go-to for quality fashion. The selection is incredible and delivery is always on time!", rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=8x0zp5", imageAlt: "Emma Richardson"},
{
name: "Michael Chen",
handle: "Professional Shopper",
testimonial:
"Best online clothing store I've found. The quality is unmatched and customer service is exceptional.",
rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=wk89wa&_wi=1",
imageAlt: "Michael Chen",
},
name: "Michael Chen", handle: "Professional Shopper", testimonial:
"Best online clothing store I've found. The quality is unmatched and customer service is exceptional.", rating: 5,
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=wk89wa", imageAlt: "Michael Chen"},
]}
testimonialRotationInterval={5000}
/>
@@ -106,32 +90,15 @@ export default function HomePage() {
gridVariant="three-columns-all-equal-width"
products={[
{
id: "1",
name: "Classic Cotton T-Shirt",
price: "$34.99",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=9hkfcw&_wi=1",
imageAlt: "Classic Cotton T-Shirt",
},
id: "1", name: "Classic Cotton T-Shirt", price: "$34.99", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=9hkfcw", imageAlt: "Classic Cotton T-Shirt"},
{
id: "2",
name: "Elegant Evening Dress",
price: "$89.99",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=snddqc&_wi=1",
imageAlt: "Elegant Evening Dress",
},
id: "2", name: "Elegant Evening Dress", price: "$89.99", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=snddqc", imageAlt: "Elegant Evening Dress"},
{
id: "3",
name: "Premium Denim Jeans",
price: "$64.99",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=itikf6&_wi=1",
imageAlt: "Premium Denim Jeans",
},
id: "3", name: "Premium Denim Jeans", price: "$64.99", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=itikf6", imageAlt: "Premium Denim Jeans"},
]}
buttons={[
{
text: "View All Products",
href: "/shop",
},
text: "View All Products", href: "/shop"},
]}
buttonAnimation="slide-up"
/>
@@ -141,29 +108,19 @@ export default function HomePage() {
<InlineImageSplitTextAbout
heading={[
{
type: "text",
content: "We're passionate about",
},
type: "text", content: "We're passionate about"},
{
type: "text",
content: "quality fashion",
},
type: "text", content: "quality fashion"},
{
type: "text",
content: "that empowers you",
},
type: "text", content: "that empowers you"},
]}
useInvertedBackground={false}
buttonAnimation="slide-up"
buttons={[
{
text: "Our Story",
href: "#",
},
text: "Our Story", href: "#"},
{
text: "Contact Us",
href: "#contact",
},
text: "Contact Us", href: "#contact"},
]}
/>
</div>
@@ -180,37 +137,19 @@ export default function HomePage() {
animationType="opacity"
features={[
{
id: "quality",
label: "Quality",
title: "Premium Materials & Craftsmanship",
items: [
"100% authentic brands",
"Premium fabric selection",
"Rigorous quality control",
"Sustainable practices",
],
id: "quality", label: "Quality", title: "Premium Materials & Craftsmanship", items: [
"100% authentic brands", "Premium fabric selection", "Rigorous quality control", "Sustainable practices"],
buttons: [
{
text: "Learn More",
href: "#",
},
text: "Learn More", href: "#"},
],
},
{
id: "service",
label: "Service",
title: "World-Class Customer Experience",
items: [
"24/7 customer support",
"Easy returns & exchanges",
"Fast shipping worldwide",
"Secure checkout",
],
id: "service", label: "Service", title: "World-Class Customer Experience", items: [
"24/7 customer support", "Easy returns & exchanges", "Fast shipping worldwide", "Secure checkout"],
buttons: [
{
text: "Contact Support",
href: "#contact",
},
text: "Contact Support", href: "#contact"},
],
},
]}
@@ -229,59 +168,23 @@ export default function HomePage() {
animationType="slide-up"
testimonials={[
{
id: "1",
name: "Sarah Johnson",
handle: "@fashionista_sarah",
testimonial:
"Amazing quality and selection! I've been shopping here for months and never been disappointed. The fit is always perfect.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=8x0zp5&_wi=2",
imageAlt: "Sarah Johnson",
},
id: "1", name: "Sarah Johnson", handle: "@fashionista_sarah", testimonial:
"Amazing quality and selection! I've been shopping here for months and never been disappointed. The fit is always perfect.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=8x0zp5", imageAlt: "Sarah Johnson"},
{
id: "2",
name: "David Kumar",
handle: "Style Maven",
testimonial:
"StyleHub is my go-to for professional attire. Great prices and excellent customer service. Highly recommended!",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=wk89wa&_wi=2",
imageAlt: "David Kumar",
},
id: "2", name: "David Kumar", handle: "Style Maven", testimonial:
"StyleHub is my go-to for professional attire. Great prices and excellent customer service. Highly recommended!", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=wk89wa", imageAlt: "David Kumar"},
{
id: "3",
name: "Jessica Chen",
handle: "@jess_style",
testimonial:
"Love the variety and the trend-forward pieces. Delivery is super fast and the quality is consistently great.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=2ajyx4",
imageAlt: "Jessica Chen",
},
id: "3", name: "Jessica Chen", handle: "@jess_style", testimonial:
"Love the variety and the trend-forward pieces. Delivery is super fast and the quality is consistently great.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=2ajyx4", imageAlt: "Jessica Chen"},
{
id: "4",
name: "Marcus Williams",
handle: "Quality Conscious",
testimonial:
"Found exactly what I was looking for. The website is easy to navigate and checkout was smooth. Will definitely shop again!",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=jq3d26",
imageAlt: "Marcus Williams",
},
id: "4", name: "Marcus Williams", handle: "Quality Conscious", testimonial:
"Found exactly what I was looking for. The website is easy to navigate and checkout was smooth. Will definitely shop again!", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=jq3d26", imageAlt: "Marcus Williams"},
{
id: "5",
name: "Lisa Patterson",
handle: "@style_adventures",
testimonial:
"StyleHub understands fashion! The curation is excellent and I trust the quality of everything I buy here.",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=agkdlr",
imageAlt: "Lisa Patterson",
},
id: "5", name: "Lisa Patterson", handle: "@style_adventures", testimonial:
"StyleHub understands fashion! The curation is excellent and I trust the quality of everything I buy here.", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=agkdlr", imageAlt: "Lisa Patterson"},
{
id: "6",
name: "James Anderson",
handle: "Casual Dresser",
testimonial:
"Best online shopping experience I've had. Great selection, fair prices, and reliable shipping. 10/10!",
imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=j133ns",
imageAlt: "James Anderson",
},
id: "6", name: "James Anderson", handle: "Casual Dresser", testimonial:
"Best online shopping experience I've had. Great selection, fair prices, and reliable shipping. 10/10!", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=j133ns", imageAlt: "James Anderson"},
]}
speed={40}
topMarqueeDirection="left"
@@ -298,25 +201,9 @@ export default function HomePage() {
textboxLayout="default"
useInvertedBackground={true}
names={[
"Nordstrom",
"Zara",
"H&M",
"Uniqlo",
"Forever 21",
"Gap",
"SHEIN",
"ASOS",
]}
"Nordstrom", "Zara", "H&M", "Uniqlo", "Forever 21", "Gap", "SHEIN", "ASOS"]}
logos={[
"https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=3ppcbs",
"https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=le1k2v",
"https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=tpfhha",
"https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=qtmi1d",
"https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=zf6jjl",
"https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=t7bngh",
"https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=doc1xc",
"https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=7gdf0c",
]}
"https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=3ppcbs", "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=le1k2v", "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=tpfhha", "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=qtmi1d", "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=zf6jjl", "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=t7bngh", "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=doc1xc", "https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=7gdf0c"]}
speed={40}
showCard={true}
/>
@@ -329,9 +216,9 @@ export default function HomePage() {
title="Stay Updated with Latest Trends"
description="Subscribe to our newsletter and be the first to know about new collections, exclusive offers, and styling tips from our fashion experts."
tagAnimation="slide-up"
background={{ variant: "grid" }}
background={{ variant: "plain" }}
useInvertedBackground={true}
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=a3zdy1&_wi=1"
imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/default/no-image.jpg?id=a3zdy1"
imageAlt="Fashion store environment"
mediaAnimation="blur-reveal"
mediaPosition="right"
@@ -345,13 +232,9 @@ export default function HomePage() {
<FooterLogoReveal
logoText="StyleHub"
leftLink={{
text: "Privacy Policy",
href: "#",
}}
text: "Privacy Policy", href: "#"}}
rightLink={{
text: "Terms of Service",
href: "#",
}}
text: "Terms of Service", href: "#"}}
/>
</div>
</ThemeProvider>

52
src/components/shared/SvgTextLogo/SvgTextLogo.tsx
View File

@@ -1,51 +1,29 @@
"use client";
import { memo } from "react";
import useSvgTextLogo from "./useSvgTextLogo";
import { cls } from "@/lib/utils";
import React from 'react';
interface SvgTextLogoProps {
logoText: string;
adjustHeightFactor?: number;
verticalAlign?: "top" | "center";
text: string;
className?: string;
}
const SvgTextLogo = memo<SvgTextLogoProps>(function SvgTextLogo({
logoText,
adjustHeightFactor,
verticalAlign = "top",
className = "",
}) {
const { svgRef, textRef, viewBox, aspectRatio } = useSvgTextLogo(logoText, false, adjustHeightFactor);
const SvgTextLogo: React.FC<SvgTextLogoProps> = ({ text, className = '' }) => {
return (
<svg
ref={svgRef}
viewBox={viewBox}
className={cls("w-full", className)}
style={{ aspectRatio: aspectRatio }}
preserveAspectRatio="none"
role="img"
aria-label={`${logoText} logo`}
viewBox="0 0 200 50"
className={`w-auto h-8 ${className}`}
xmlns="http://www.w3.org/2000/svg"
>
<text
ref={textRef}
x="0"
y={verticalAlign === "center" ? "50%" : "0"}
className="font-bold fill-current"
style={{
fontSize: "20px",
letterSpacing: "-0.02em",
dominantBaseline: verticalAlign === "center" ? "middle" : "text-before-edge"
}}
x="10"
y="35"
fontSize="32"
fontWeight="bold"
fill="currentColor"
dominantBaseline="auto"
>
{logoText}
{text}
</text>
</svg>
);
});
};
SvgTextLogo.displayName = "SvgTextLogo";
export default SvgTextLogo;
export default SvgTextLogo;