Files
d65fbd05-3e69-46ae-b056-e1b…/src/app/about/page.tsx

114 lines
4.4 KiB
TypeScript

"use client";
import Link from "next/link";
import NavbarStyleMinimal from '@/components/navbar/NavbarStyleMinimal';
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
import FeatureProcessSteps from '@/components/sections/feature/FeatureProcessSteps';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import { ThemeProvider } from '@/providers/themeProvider/ThemeProvider';
export default function AboutPage() {
return (
<ThemeProvider
defaultButtonVariant="hover-magnetic"
defaultTextAnimation="entrance-slide"
borderRadius="pill"
contentWidth="medium"
sizing="medium"
background="aurora"
cardStyle="glass-elevated"
primaryButtonStyle="gradient"
secondaryButtonStyle="glass"
showBlurBottom={false}
headingFontWeight="normal"
>
<div id="nav" data-section="nav">
<NavbarStyleMinimal
brandName="Bloom & Petals"
button={{
text: "Shop Now", href: "/products"
}}
/>
<div style={{ position: 'absolute', top: '20px', right: '200px', zIndex: 1000 }}>
<Link href="/" style={{ marginRight: '15px', color: 'var(--foreground)' }}>Home</Link>
<Link href="/about" style={{ marginRight: '15px', color: 'var(--foreground)' }}>About</Link>
<Link href="/products" style={{ marginRight: '15px', color: 'var(--foreground)' }}>Products</Link>
<Link href="/contact" style={{ color: 'var(--foreground)' }}>Contact</Link>
</div>
</div>
<div id="about" data-section="about">
<InlineImageSplitTextAbout
heading={[
{ type: "text", content: "Passionate about creating" },
{ type: "image", src: "https://img.b2bpic.net/free-photo/high-angle-beautiful-boho-flowers_23-2149526052.jpg", alt: "Beautiful flowers" },
{ type: "text", content: "moments of joy since 2010" }
]}
useInvertedBackground="noInvert"
buttons={[
{ text: "Our Story", href: "#" }
]}
/>
</div>
<div id="features" data-section="features">
<FeatureProcessSteps
title="Your Perfect Bouquet in Three Easy Steps"
description="We've streamlined the process of ordering beautiful flowers so you can focus on what matters—celebrating the people you care about."
tag="How We Work"
useInvertedBackground="noInvert"
steps={[
{
number: "01", title: "Choose Your Flowers", description: "Browse our curated collection of fresh, premium arrangements or customize your own.", tag: "Selection"
},
{
number: "02", title: "Add Personal Touch", description: "Include a heartfelt message, select delivery date, and add special add-ons like chocolates or candles.", tag: "Customization"
},
{
number: "03", title: "Fast Delivery", description: "We'll arrange, package, and deliver your flowers with care straight to the recipient's door.", tag: "Delivery"
}
]}
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoEmphasis
logoText="Bloom & Petals"
columns={[
{
items: [
{ label: "Shop", href: "/products" },
{ label: "Arrangements", href: "#" },
{ label: "Custom Orders", href: "#" },
{ label: "Subscriptions", href: "#" }
]
},
{
items: [
{ label: "About Us", href: "/about" },
{ label: "Our Team", href: "#" },
{ label: "Story", href: "#" },
{ label: "Blog", href: "#" }
]
},
{
items: [
{ label: "Contact", href: "/contact" },
{ label: "Support", href: "#" },
{ label: "Delivery Info", href: "#" },
{ label: "FAQ", href: "#" }
]
},
{
items: [
{ label: "Privacy", href: "#" },
{ label: "Terms", href: "#" },
{ label: "Sitemap", href: "#" }
]
}
]}
/>
</div>
</ThemeProvider>
);
}