Merge version_1 into main #2
@@ -19,8 +19,7 @@ export default function AboutPage() {
|
||||
|
||||
const footerColumns = [
|
||||
{
|
||||
title: "Quick Links",
|
||||
items: [
|
||||
title: "Quick Links", items: [
|
||||
{ label: "Home", href: "/" },
|
||||
{ label: "Menu", href: "/menu" },
|
||||
{ label: "Gallery", href: "/gallery" },
|
||||
@@ -28,8 +27,7 @@ export default function AboutPage() {
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Services",
|
||||
items: [
|
||||
title: "Services", items: [
|
||||
{ label: "Weddings", href: "#" },
|
||||
{ label: "Corporate Events", href: "#" },
|
||||
{ label: "Birthday Parties", href: "#" },
|
||||
@@ -37,8 +35,7 @@ export default function AboutPage() {
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Contact",
|
||||
items: [
|
||||
title: "Contact", items: [
|
||||
{ label: "Phone: (609) 751-8484", href: "tel:(609) 751-8484" },
|
||||
{ label: "Email: info@CupcakeCarnivale.com", href: "mailto:info@CupcakeCarnivale.com" },
|
||||
{ label: "Philadelphia, PA & NJ", href: "#" },
|
||||
@@ -54,7 +51,7 @@ export default function AboutPage() {
|
||||
borderRadius="rounded"
|
||||
contentWidth="mediumSmall"
|
||||
sizing="mediumLargeSizeMediumTitles"
|
||||
background="blurBottom"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-depth"
|
||||
primaryButtonStyle="shadow"
|
||||
secondaryButtonStyle="solid"
|
||||
@@ -65,9 +62,7 @@ export default function AboutPage() {
|
||||
brandName="Cupcake Carnivale"
|
||||
navItems={navItems}
|
||||
button={{
|
||||
text: "Order Cupcakes",
|
||||
href: "/contact",
|
||||
}}
|
||||
text: "Order Cupcakes", href: "/contact"}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -81,7 +76,7 @@ export default function AboutPage() {
|
||||
{ src: "http://img.b2bpic.net/free-photo/beautiful-afro-american-woman-smiling_23-2148336914.jpg", alt: "Delighted customer" },
|
||||
]}
|
||||
avatarText="Our Story"
|
||||
background={{ variant: "blurBottom" }}
|
||||
background={{ variant: "plain" }}
|
||||
buttonAnimation="slide-up"
|
||||
ariaLabel="About hero section"
|
||||
/>
|
||||
@@ -92,13 +87,11 @@ export default function AboutPage() {
|
||||
title="The Story Behind Cupcake Carnivale"
|
||||
description="Founded by pastry chef Jeffrey Jimenez, Cupcake Carnivale is an award-winning mobile cupcake truck serving the Philadelphia and New Jersey communities with artisan gourmet cupcakes baked fresh daily using the finest ingredients. We believe every cupcake should be a celebration of quality, creativity, and joy. Our mission is to bring happiness to every event and create memorable moments through our delicious creations."
|
||||
tag="Our Journey"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/people-holding-delicious-burger-meal_23-2151433744.jpg?_wi=2"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/people-holding-delicious-burger-meal_23-2151433744.jpg"
|
||||
imageAlt="Cupcake Carnivale award-winning truck in action"
|
||||
buttons={[
|
||||
{
|
||||
text: "Order Now",
|
||||
href: "/contact",
|
||||
},
|
||||
text: "Order Now", href: "/contact"},
|
||||
]}
|
||||
useInvertedBackground={true}
|
||||
/>
|
||||
|
||||
@@ -18,8 +18,7 @@ export default function GalleryPage() {
|
||||
|
||||
const footerColumns = [
|
||||
{
|
||||
title: "Quick Links",
|
||||
items: [
|
||||
title: "Quick Links", items: [
|
||||
{ label: "Home", href: "/" },
|
||||
{ label: "Menu", href: "/menu" },
|
||||
{ label: "Gallery", href: "/gallery" },
|
||||
@@ -27,8 +26,7 @@ export default function GalleryPage() {
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Services",
|
||||
items: [
|
||||
title: "Services", items: [
|
||||
{ label: "Weddings", href: "#" },
|
||||
{ label: "Corporate Events", href: "#" },
|
||||
{ label: "Birthday Parties", href: "#" },
|
||||
@@ -36,8 +34,7 @@ export default function GalleryPage() {
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Contact",
|
||||
items: [
|
||||
title: "Contact", items: [
|
||||
{ label: "Phone: (609) 751-8484", href: "tel:(609) 751-8484" },
|
||||
{ label: "Email: info@CupcakeCarnivale.com", href: "mailto:info@CupcakeCarnivale.com" },
|
||||
{ label: "Philadelphia, PA & NJ", href: "#" },
|
||||
@@ -53,7 +50,7 @@ export default function GalleryPage() {
|
||||
borderRadius="rounded"
|
||||
contentWidth="mediumSmall"
|
||||
sizing="mediumLargeSizeMediumTitles"
|
||||
background="blurBottom"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-depth"
|
||||
primaryButtonStyle="shadow"
|
||||
secondaryButtonStyle="solid"
|
||||
@@ -64,9 +61,7 @@ export default function GalleryPage() {
|
||||
brandName="Cupcake Carnivale"
|
||||
navItems={navItems}
|
||||
button={{
|
||||
text: "Order Cupcakes",
|
||||
href: "/contact",
|
||||
}}
|
||||
text: "Order Cupcakes", href: "/contact"}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -80,7 +75,7 @@ export default function GalleryPage() {
|
||||
{ src: "http://img.b2bpic.net/free-photo/beautiful-afro-american-woman-smiling_23-2148336914.jpg", alt: "Delighted customer" },
|
||||
]}
|
||||
avatarText="Browse Our Collections"
|
||||
background={{ variant: "blurBottom" }}
|
||||
background={{ variant: "plain" }}
|
||||
buttonAnimation="slide-up"
|
||||
ariaLabel="Gallery hero section"
|
||||
/>
|
||||
@@ -92,35 +87,14 @@ export default function GalleryPage() {
|
||||
description="Our signature cupcake display featuring the most beloved flavors beautifully arranged and photographed"
|
||||
products={[
|
||||
{
|
||||
id: "1",
|
||||
brand: "Cupcake Carnivale",
|
||||
name: "Red Velvet",
|
||||
price: "Fresh Daily",
|
||||
rating: 5,
|
||||
reviewCount: "450+",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/delicious-rainbow-cupcake-still-life_23-2150423835.jpg",
|
||||
imageAlt: "Red Velvet cupcake in showcase",
|
||||
},
|
||||
id: "1", brand: "Cupcake Carnivale", name: "Red Velvet", price: "Fresh Daily", rating: 5,
|
||||
reviewCount: "450+", imageSrc: "http://img.b2bpic.net/free-photo/delicious-rainbow-cupcake-still-life_23-2150423835.jpg", imageAlt: "Red Velvet cupcake in showcase"},
|
||||
{
|
||||
id: "2",
|
||||
brand: "Cupcake Carnivale",
|
||||
name: "Chocolate Delight",
|
||||
price: "Fresh Daily",
|
||||
rating: 5,
|
||||
reviewCount: "380+",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/closeup-shot-delicious-cupcake-with-cream-cherry-top-books_181624-30451.jpg",
|
||||
imageAlt: "Chocolate cupcake with cherry topping",
|
||||
},
|
||||
id: "2", brand: "Cupcake Carnivale", name: "Chocolate Delight", price: "Fresh Daily", rating: 5,
|
||||
reviewCount: "380+", imageSrc: "http://img.b2bpic.net/free-photo/closeup-shot-delicious-cupcake-with-cream-cherry-top-books_181624-30451.jpg", imageAlt: "Chocolate cupcake with cherry topping"},
|
||||
{
|
||||
id: "3",
|
||||
brand: "Cupcake Carnivale",
|
||||
name: "Vanilla Dream",
|
||||
price: "Fresh Daily",
|
||||
rating: 5,
|
||||
reviewCount: "290+",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/modern-birthday-composition-with-lovely-cupcake_23-2147997591.jpg?_wi=3",
|
||||
imageAlt: "Vanilla cupcake with sprinkles",
|
||||
},
|
||||
id: "3", brand: "Cupcake Carnivale", name: "Vanilla Dream", price: "Fresh Daily", rating: 5,
|
||||
reviewCount: "290+", imageSrc: "http://img.b2bpic.net/free-photo/modern-birthday-composition-with-lovely-cupcake_23-2147997591.jpg", imageAlt: "Vanilla cupcake with sprinkles"},
|
||||
]}
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
animationType="slide-up"
|
||||
@@ -135,35 +109,14 @@ export default function GalleryPage() {
|
||||
description="Cupcake Carnivale creating magical displays for weddings, corporate events, and special celebrations"
|
||||
products={[
|
||||
{
|
||||
id: "1",
|
||||
brand: "Cupcake Carnivale",
|
||||
name: "Wedding Tower Display",
|
||||
price: "Custom Event",
|
||||
rating: 5,
|
||||
reviewCount: "125+",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/wedding-couple-cutting-wedding-cake_1303-10522.jpg",
|
||||
imageAlt: "Wedding cupcake tower display",
|
||||
},
|
||||
id: "1", brand: "Cupcake Carnivale", name: "Wedding Tower Display", price: "Custom Event", rating: 5,
|
||||
reviewCount: "125+", imageSrc: "http://img.b2bpic.net/free-photo/wedding-couple-cutting-wedding-cake_1303-10522.jpg", imageAlt: "Wedding cupcake tower display"},
|
||||
{
|
||||
id: "2",
|
||||
brand: "Cupcake Carnivale",
|
||||
name: "Festival Booth",
|
||||
price: "Community",
|
||||
rating: 5,
|
||||
reviewCount: "89+",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/colorful-macaroons-cupcake-paper-holder-inside-display-cabinet_23-2148028039.jpg",
|
||||
imageAlt: "Cupcake festival booth display",
|
||||
},
|
||||
id: "2", brand: "Cupcake Carnivale", name: "Festival Booth", price: "Community", rating: 5,
|
||||
reviewCount: "89+", imageSrc: "http://img.b2bpic.net/free-photo/colorful-macaroons-cupcake-paper-holder-inside-display-cabinet_23-2148028039.jpg", imageAlt: "Cupcake festival booth display"},
|
||||
{
|
||||
id: "3",
|
||||
brand: "Cupcake Carnivale",
|
||||
name: "Celebration Platter",
|
||||
price: "Party Perfect",
|
||||
rating: 5,
|
||||
reviewCount: "156+",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/festive-sweet-buffet_78826-2499.jpg",
|
||||
imageAlt: "Corporate event cupcake display",
|
||||
},
|
||||
id: "3", brand: "Cupcake Carnivale", name: "Celebration Platter", price: "Party Perfect", rating: 5,
|
||||
reviewCount: "156+", imageSrc: "http://img.b2bpic.net/free-photo/festive-sweet-buffet_78826-2499.jpg", imageAlt: "Corporate event cupcake display"},
|
||||
]}
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
animationType="slide-up"
|
||||
@@ -178,35 +131,14 @@ export default function GalleryPage() {
|
||||
description="Close-up photography showcasing the intricate decoration and premium quality of each cupcake creation"
|
||||
products={[
|
||||
{
|
||||
id: "1",
|
||||
brand: "Cupcake Carnivale",
|
||||
name: "Frosting Artistry",
|
||||
price: "Premium Quality",
|
||||
rating: 5,
|
||||
reviewCount: "210+",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/top-view-composition-chocolate-cupcakes_23-2148654052.jpg?_wi=3",
|
||||
imageAlt: "Close-up of cupcake frosting details",
|
||||
},
|
||||
id: "1", brand: "Cupcake Carnivale", name: "Frosting Artistry", price: "Premium Quality", rating: 5,
|
||||
reviewCount: "210+", imageSrc: "http://img.b2bpic.net/free-photo/top-view-composition-chocolate-cupcakes_23-2148654052.jpg", imageAlt: "Close-up of cupcake frosting details"},
|
||||
{
|
||||
id: "2",
|
||||
brand: "Cupcake Carnivale",
|
||||
name: "Gourmet Toppings",
|
||||
price: "Premium Quality",
|
||||
rating: 5,
|
||||
reviewCount: "187+",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/top-view-cupcakes-with-raspberries-arrangement_23-2149162718.jpg?_wi=3",
|
||||
imageAlt: "Cupcakes with berry toppings",
|
||||
},
|
||||
id: "2", brand: "Cupcake Carnivale", name: "Gourmet Toppings", price: "Premium Quality", rating: 5,
|
||||
reviewCount: "187+", imageSrc: "http://img.b2bpic.net/free-photo/top-view-cupcakes-with-raspberries-arrangement_23-2149162718.jpg", imageAlt: "Cupcakes with berry toppings"},
|
||||
{
|
||||
id: "3",
|
||||
brand: "Cupcake Carnivale",
|
||||
name: "Birthday Celebration",
|
||||
price: "Party Special",
|
||||
rating: 5,
|
||||
reviewCount: "198+",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/delicious-rainbow-cupcake-still-life_23-2150423819.jpg",
|
||||
imageAlt: "Birthday cupcake with decorations",
|
||||
},
|
||||
id: "3", brand: "Cupcake Carnivale", name: "Birthday Celebration", price: "Party Special", rating: 5,
|
||||
reviewCount: "198+", imageSrc: "http://img.b2bpic.net/free-photo/delicious-rainbow-cupcake-still-life_23-2150423819.jpg", imageAlt: "Birthday cupcake with decorations"},
|
||||
]}
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
animationType="slide-up"
|
||||
|
||||
101
src/app/page.tsx
101
src/app/page.tsx
@@ -22,8 +22,7 @@ export default function HomePage() {
|
||||
|
||||
const footerColumns = [
|
||||
{
|
||||
title: "Quick Links",
|
||||
items: [
|
||||
title: "Quick Links", items: [
|
||||
{ label: "Home", href: "/" },
|
||||
{ label: "Menu", href: "/menu" },
|
||||
{ label: "Gallery", href: "/gallery" },
|
||||
@@ -31,8 +30,7 @@ export default function HomePage() {
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Services",
|
||||
items: [
|
||||
title: "Services", items: [
|
||||
{ label: "Weddings", href: "#" },
|
||||
{ label: "Corporate Events", href: "#" },
|
||||
{ label: "Birthday Parties", href: "#" },
|
||||
@@ -40,8 +38,7 @@ export default function HomePage() {
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Contact",
|
||||
items: [
|
||||
title: "Contact", items: [
|
||||
{ label: "Phone: (609) 751-8484", href: "tel:(609) 751-8484" },
|
||||
{ label: "Email: info@CupcakeCarnivale.com", href: "mailto:info@CupcakeCarnivale.com" },
|
||||
{ label: "Philadelphia, PA & NJ", href: "#" },
|
||||
@@ -57,7 +54,7 @@ export default function HomePage() {
|
||||
borderRadius="rounded"
|
||||
contentWidth="mediumSmall"
|
||||
sizing="mediumLargeSizeMediumTitles"
|
||||
background="blurBottom"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-depth"
|
||||
primaryButtonStyle="shadow"
|
||||
secondaryButtonStyle="solid"
|
||||
@@ -68,9 +65,7 @@ export default function HomePage() {
|
||||
brandName="Cupcake Carnivale"
|
||||
navItems={navItems}
|
||||
button={{
|
||||
text: "Order Cupcakes",
|
||||
href: "#contact-cta",
|
||||
}}
|
||||
text: "Order Cupcakes", href: "#contact-cta"}}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -88,7 +83,7 @@ export default function HomePage() {
|
||||
{ text: "View Menu", href: "/menu" },
|
||||
{ text: "See Gallery", href: "/gallery" },
|
||||
]}
|
||||
background={{ variant: "blurBottom" }}
|
||||
background={{ variant: "plain" }}
|
||||
buttonAnimation="slide-up"
|
||||
ariaLabel="Hero section"
|
||||
/>
|
||||
@@ -100,65 +95,23 @@ export default function HomePage() {
|
||||
description="Discover our signature flavors crafted with premium ingredients and passion"
|
||||
products={[
|
||||
{
|
||||
id: "1",
|
||||
brand: "Cupcake Carnivale",
|
||||
name: "Red Velvet Carnivale",
|
||||
price: "Fresh Daily",
|
||||
rating: 5,
|
||||
reviewCount: "450+",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/slice-carrot-pie-with-sugar-powder_114579-17120.jpg?_wi=1",
|
||||
imageAlt: "Red Velvet Cupcake",
|
||||
},
|
||||
id: "1", brand: "Cupcake Carnivale", name: "Red Velvet Carnivale", price: "Fresh Daily", rating: 5,
|
||||
reviewCount: "450+", imageSrc: "http://img.b2bpic.net/free-photo/slice-carrot-pie-with-sugar-powder_114579-17120.jpg", imageAlt: "Red Velvet Cupcake"},
|
||||
{
|
||||
id: "2",
|
||||
brand: "Cupcake Carnivale",
|
||||
name: "Chocolate Jubilee",
|
||||
price: "Fresh Daily",
|
||||
rating: 5,
|
||||
reviewCount: "380+",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/top-view-composition-chocolate-cupcakes_23-2148654052.jpg?_wi=1",
|
||||
imageAlt: "Chocolate Jubilee Cupcake",
|
||||
},
|
||||
id: "2", brand: "Cupcake Carnivale", name: "Chocolate Jubilee", price: "Fresh Daily", rating: 5,
|
||||
reviewCount: "380+", imageSrc: "http://img.b2bpic.net/free-photo/top-view-composition-chocolate-cupcakes_23-2148654052.jpg", imageAlt: "Chocolate Jubilee Cupcake"},
|
||||
{
|
||||
id: "3",
|
||||
brand: "Cupcake Carnivale",
|
||||
name: "Vanilla Sideshow",
|
||||
price: "Fresh Daily",
|
||||
rating: 5,
|
||||
reviewCount: "290+",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/modern-birthday-composition-with-lovely-cupcake_23-2147997591.jpg?_wi=1",
|
||||
imageAlt: "Vanilla Sideshow Cupcake",
|
||||
},
|
||||
id: "3", brand: "Cupcake Carnivale", name: "Vanilla Sideshow", price: "Fresh Daily", rating: 5,
|
||||
reviewCount: "290+", imageSrc: "http://img.b2bpic.net/free-photo/modern-birthday-composition-with-lovely-cupcake_23-2147997591.jpg", imageAlt: "Vanilla Sideshow Cupcake"},
|
||||
{
|
||||
id: "4",
|
||||
brand: "Cupcake Carnivale",
|
||||
name: "Luscious Lemon",
|
||||
price: "Fresh Daily",
|
||||
rating: 5,
|
||||
reviewCount: "320+",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/modern-birthday-composition-with-lovely-cupcake_23-2147997562.jpg?_wi=1",
|
||||
imageAlt: "Luscious Lemon Cupcake",
|
||||
},
|
||||
id: "4", brand: "Cupcake Carnivale", name: "Luscious Lemon", price: "Fresh Daily", rating: 5,
|
||||
reviewCount: "320+", imageSrc: "http://img.b2bpic.net/free-photo/modern-birthday-composition-with-lovely-cupcake_23-2147997562.jpg", imageAlt: "Luscious Lemon Cupcake"},
|
||||
{
|
||||
id: "5",
|
||||
brand: "Cupcake Carnivale",
|
||||
name: "Cookies & Cream",
|
||||
price: "Fresh Daily",
|
||||
rating: 5,
|
||||
reviewCount: "410+",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/top-view-cupcakes-with-raspberries-arrangement_23-2149162718.jpg?_wi=1",
|
||||
imageAlt: "Cookies and Cream Cupcake",
|
||||
},
|
||||
id: "5", brand: "Cupcake Carnivale", name: "Cookies & Cream", price: "Fresh Daily", rating: 5,
|
||||
reviewCount: "410+", imageSrc: "http://img.b2bpic.net/free-photo/top-view-cupcakes-with-raspberries-arrangement_23-2149162718.jpg", imageAlt: "Cookies and Cream Cupcake"},
|
||||
{
|
||||
id: "6",
|
||||
brand: "Cupcake Carnivale",
|
||||
name: "Cookie Dough",
|
||||
price: "Fresh Daily",
|
||||
rating: 5,
|
||||
reviewCount: "340+",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/fresh-homemade-delicious-blueberry-muffins_114579-38811.jpg?_wi=1",
|
||||
imageAlt: "Cookie Dough Cupcake",
|
||||
},
|
||||
id: "6", brand: "Cupcake Carnivale", name: "Cookie Dough", price: "Fresh Daily", rating: 5,
|
||||
reviewCount: "340+", imageSrc: "http://img.b2bpic.net/free-photo/fresh-homemade-delicious-blueberry-muffins_114579-38811.jpg", imageAlt: "Cookie Dough Cupcake"},
|
||||
]}
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
animationType="slide-up"
|
||||
@@ -172,7 +125,7 @@ export default function HomePage() {
|
||||
title="The Story Behind Cupcake Carnivale"
|
||||
description="Founded by pastry chef Jeffrey Jimenez, Cupcake Carnivale is an award-winning mobile cupcake truck serving the Philadelphia and New Jersey communities with artisan gourmet cupcakes baked fresh daily using the finest ingredients. We believe every cupcake should be a celebration."
|
||||
tag="Our Story"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/people-holding-delicious-burger-meal_23-2151433744.jpg?_wi=1"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/people-holding-delicious-burger-meal_23-2151433744.jpg"
|
||||
imageAlt="Cupcake Carnivale award-winning truck"
|
||||
buttons={[{ text: "Learn More", href: "/about" }]}
|
||||
useInvertedBackground={true}
|
||||
@@ -185,15 +138,7 @@ export default function HomePage() {
|
||||
description="Join hundreds of happy customers who have made Cupcake Carnivale their go-to cupcake truck"
|
||||
tag="Partners"
|
||||
names={[
|
||||
"Philadelphia Event Planning Co",
|
||||
"New Jersey Catering Services",
|
||||
"Downtown Corporate Events",
|
||||
"Wedding Day Experts",
|
||||
"Party Perfect Planners",
|
||||
"Celebration Station",
|
||||
"Corporate Catering Plus",
|
||||
"Dream Event Designs",
|
||||
]}
|
||||
"Philadelphia Event Planning Co", "New Jersey Catering Services", "Downtown Corporate Events", "Wedding Day Experts", "Party Perfect Planners", "Celebration Station", "Corporate Catering Plus", "Dream Event Designs"]}
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
speed={40}
|
||||
@@ -228,13 +173,11 @@ export default function HomePage() {
|
||||
{ name: "phone", type: "tel", placeholder: "(609) 751-8484", required: false },
|
||||
]}
|
||||
textarea={{
|
||||
name: "message",
|
||||
placeholder: "Tell us about your event...",
|
||||
rows: 5,
|
||||
name: "message", placeholder: "Tell us about your event...", rows: 5,
|
||||
required: true,
|
||||
}}
|
||||
useInvertedBackground={false}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/close-up-tray-with-christmas-cookies_1187-679.jpg?_wi=1"
|
||||
imageSrc="http://img.b2bpic.net/free-photo/close-up-tray-with-christmas-cookies_1187-679.jpg"
|
||||
imageAlt="Friendly cupcake truck service"
|
||||
mediaAnimation="slide-up"
|
||||
mediaPosition="right"
|
||||
|
||||
@@ -1,51 +1,39 @@
|
||||
"use client";
|
||||
import React, { SVGProps } from "react";
|
||||
|
||||
import { memo } from "react";
|
||||
import useSvgTextLogo from "./useSvgTextLogo";
|
||||
import { cls } from "@/lib/utils";
|
||||
|
||||
interface SvgTextLogoProps {
|
||||
logoText: string;
|
||||
adjustHeightFactor?: number;
|
||||
verticalAlign?: "top" | "center";
|
||||
className?: string;
|
||||
interface SvgTextLogoProps extends SVGProps<SVGSVGElement> {
|
||||
text?: string;
|
||||
fontSize?: number;
|
||||
fontFamily?: string;
|
||||
fontWeight?: number | string;
|
||||
fill?: string;
|
||||
letterSpacing?: number;
|
||||
}
|
||||
|
||||
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 = "Webild", fontSize = 48,
|
||||
fontFamily = "Arial, sans-serif", fontWeight = "bold", fill = "currentColor", letterSpacing = 0,
|
||||
...props
|
||||
}) => {
|
||||
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 ${text.length * fontSize * 0.6} ${fontSize * 1.5}`}
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
{...props}
|
||||
>
|
||||
<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"
|
||||
}}
|
||||
y={fontSize}
|
||||
fontSize={fontSize}
|
||||
fontFamily={fontFamily}
|
||||
fontWeight={fontWeight}
|
||||
fill={fill}
|
||||
letterSpacing={letterSpacing}
|
||||
dominantBaseline="auto"
|
||||
>
|
||||
{logoText}
|
||||
{text}
|
||||
</text>
|
||||
</svg>
|
||||
);
|
||||
});
|
||||
};
|
||||
|
||||
SvgTextLogo.displayName = "SvgTextLogo";
|
||||
|
||||
export default SvgTextLogo;
|
||||
export default SvgTextLogo;
|
||||
Reference in New Issue
Block a user