Compare commits
7 Commits
version_2_
...
main
| Author | SHA1 | Date | |
|---|---|---|---|
| f4ecca885c | |||
|
|
9b8949dbec | ||
| 44b86973fd | |||
|
|
a2d60796b6 | ||
| 0ff8545fe0 | |||
|
|
9675501baf | ||
| 0c532abccc |
@@ -5,15 +5,15 @@
|
||||
|
||||
:root {
|
||||
/* @colorThemes/lightTheme/grayNavyBlue */
|
||||
--background: #efebe5;
|
||||
--card: #f7f2ea;
|
||||
--foreground: #000000;
|
||||
--primary-cta: #000000;
|
||||
--primary-cta-text: #efebe5;
|
||||
--secondary-cta: #ffffff;
|
||||
--secondary-cta-text: #000000;
|
||||
--accent: #ffffff;
|
||||
--background-accent: #e1b875;
|
||||
--background: #121212;
|
||||
--card: #1e1e1e;
|
||||
--foreground: #ffffff;
|
||||
--primary-cta: #ffffff;
|
||||
--primary-cta-text: #121212;
|
||||
--secondary-cta: #2a2a2a;
|
||||
--secondary-cta-text: #ffffff;
|
||||
--accent: #a0a0a0;
|
||||
--background-accent: #332b1f;
|
||||
|
||||
/* @layout/border-radius/rounded */
|
||||
--radius: 1rem;
|
||||
|
||||
@@ -15,7 +15,8 @@ import TestimonialsSection from './HomePage/sections/Testimonials';
|
||||
import ContactSection from './HomePage/sections/Contact';
|
||||
|
||||
|
||||
import CatalogSection from './HomePage/sections/Catalog';export default function HomePage(): React.JSX.Element {
|
||||
import CatalogSection from './HomePage/sections/Catalog';
|
||||
import FaqSection from './HomePage/sections/Faq';export default function HomePage(): React.JSX.Element {
|
||||
return (
|
||||
<>
|
||||
<HeroSection />
|
||||
@@ -32,6 +33,7 @@ import CatalogSection from './HomePage/sections/Catalog';export default function
|
||||
<TeamSection />
|
||||
|
||||
<TestimonialsSection />
|
||||
<FaqSection />
|
||||
|
||||
<ContactSection />
|
||||
</>
|
||||
|
||||
@@ -1,28 +1,53 @@
|
||||
// AUTO-GENERATED by per-section-migrate. Edit freely — Bob will treat this
|
||||
// file as the canonical source for the "contact" section.
|
||||
/* eslint-disable */
|
||||
// @ts-nocheck — generated by catalog-eject; runtime-correct but TS strict-mode false-positives on inlined catalog body
|
||||
import ScrollReveal from "@/components/ui/ScrollReveal";
|
||||
import TextAnimation from "@/components/ui/TextAnimation";
|
||||
import Button from "@/components/ui/Button";
|
||||
|
||||
import React from 'react';
|
||||
import ContactCta from '@/components/sections/contact/ContactCta';
|
||||
import SectionErrorBoundary from "@/components/ui/SectionErrorBoundary";
|
||||
const primaryButton = {
|
||||
text: "Contact Us",
|
||||
href: "#"
|
||||
};
|
||||
const secondaryButton = {
|
||||
text: "Browse Catalog",
|
||||
href: "#products"
|
||||
};
|
||||
|
||||
export default function ContactSection(): React.JSX.Element {
|
||||
const ContactInline = () => {
|
||||
return (
|
||||
<div id="contact" data-section="contact">
|
||||
<SectionErrorBoundary name="contact">
|
||||
<ContactCta
|
||||
tag="Order Now"
|
||||
text="Ready to bring MANNS Chocolates to your next event? Reach out today to start your order."
|
||||
primaryButton={{
|
||||
text: "Contact Us",
|
||||
href: "#",
|
||||
}}
|
||||
secondaryButton={{
|
||||
text: "Browse Catalog",
|
||||
href: "#products",
|
||||
}}
|
||||
textAnimation="slide-up"
|
||||
/>
|
||||
</SectionErrorBoundary>
|
||||
<section aria-label="Contact section" className="py-20">
|
||||
<div className="w-content-width mx-auto">
|
||||
<ScrollReveal variant="fade-blur">
|
||||
<div className="flex flex-col items-center gap-8 md:gap-10 py-20 px-8 rounded card">
|
||||
<div className="flex flex-col items-center gap-2">
|
||||
<div className="px-3 py-1 mb-1 text-sm card rounded w-fit">
|
||||
<p>{"Order Now"}</p>
|
||||
</div>
|
||||
|
||||
<TextAnimation
|
||||
text={"Ready to bring MANNS Chocolates to your next event? Reach out today to start your order."}
|
||||
variant={"slide-up"}
|
||||
gradientText={true}
|
||||
tag="h2"
|
||||
className="md:max-w-8/10 text-5xl 2xl:text-6xl leading-[1.15] font-semibold text-center text-balance"
|
||||
/>
|
||||
|
||||
<div className="flex flex-wrap justify-center gap-3 mt-2 md:mt-3">
|
||||
<Button text={primaryButton.text} href={primaryButton.href} variant="primary" />
|
||||
<Button text={secondaryButton.text} href={secondaryButton.href} variant="secondary" animationDelay={0.1} />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</ScrollReveal>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
};
|
||||
|
||||
export default function ContactSection() {
|
||||
return (
|
||||
<div data-webild-section="contact" data-section="contact" id="contact">
|
||||
<ContactInline />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
52
src/pages/HomePage/sections/Faq.tsx
Normal file
52
src/pages/HomePage/sections/Faq.tsx
Normal file
@@ -0,0 +1,52 @@
|
||||
import Accordion from '@/components/ui/Accordion';
|
||||
import TextAnimation from '@/components/ui/TextAnimation';
|
||||
import Tag from '@/components/ui/Tag';
|
||||
|
||||
export default function FaqSection() {
|
||||
const faqItems = [
|
||||
{
|
||||
title: "How long do the chocolates stay fresh?",
|
||||
content: "Our handcrafted chocolates are made without artificial preservatives. For the best experience, we recommend enjoying them within 3-4 weeks of purchase. Store them in a cool, dry place away from direct sunlight."
|
||||
},
|
||||
{
|
||||
title: "Do you offer allergy-friendly options?",
|
||||
content: "While we take great care in our kitchen, all of our products are made in a facility that also processes peanuts, tree nuts, dairy, and wheat. If you have a severe allergy, we recommend exercising caution."
|
||||
},
|
||||
{
|
||||
title: "Can I place a custom order for a wedding or event?",
|
||||
content: "Absolutely! We love being part of your special moments. We offer custom packaging and bulk orders for weddings, showers, and corporate events. Please reach out via our contact form at least 4 weeks in advance."
|
||||
},
|
||||
{
|
||||
title: "Do you ship nationwide?",
|
||||
content: "Yes, we ship our chocolates across the country! During warmer months, we use insulated packaging and ice packs to ensure your treats arrive in perfect condition. Shipping rates are calculated at checkout."
|
||||
},
|
||||
{
|
||||
title: "What is your return policy?",
|
||||
content: "Due to the perishable nature of our products, we do not accept returns. However, if your order arrives damaged or you are unsatisfied with your purchase, please contact us within 48 hours and we will make it right."
|
||||
}
|
||||
];
|
||||
|
||||
return (
|
||||
<section data-webild-section="faq" id="faq" className="relative w-full py-24 bg-background">
|
||||
<div className="w-content-width mx-auto">
|
||||
<div className="flex flex-col items-center text-center mb-16">
|
||||
<Tag text="FAQ" className="mb-6" />
|
||||
<TextAnimation
|
||||
text="Common Questions"
|
||||
variant="slide-up"
|
||||
tag="h2"
|
||||
className="text-4xl md:text-5xl font-bold text-foreground mb-6"
|
||||
gradientText={false}
|
||||
/>
|
||||
<p className="text-lg text-accent max-w-2xl">
|
||||
Everything you need to know about our handcrafted chocolates, ordering, and shipping.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="max-w-3xl mx-auto">
|
||||
<Accordion items={faqItems} className="w-full" />
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
}
|
||||
Reference in New Issue
Block a user