Merge version_2 into main #2
270
src/app/page.tsx
270
src/app/page.tsx
@@ -9,19 +9,19 @@ import HeroSplit from '@/components/sections/hero/HeroSplit';
|
||||
import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
|
||||
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
|
||||
import ProductCardThree from '@/components/sections/product/ProductCardThree';
|
||||
import { Award, Calendar, Car, Leaf, ShoppingBag, Utensils } from "lucide-react";
|
||||
import { Award, Calendar, Car, Leaf, ShoppingBag, Utensils, MessageCircle, Truck, ShoppingCart } from "lucide-react";
|
||||
|
||||
export default function LandingPage() {
|
||||
return (
|
||||
<ThemeProvider
|
||||
defaultButtonVariant="hover-bubble"
|
||||
defaultTextAnimation="entrance-slide"
|
||||
borderRadius="soft"
|
||||
borderRadius="pill"
|
||||
contentWidth="compact"
|
||||
sizing="largeSizeMediumTitles"
|
||||
background="none"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="flat"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="semibold"
|
||||
>
|
||||
@@ -29,18 +29,9 @@ export default function LandingPage() {
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarStyleApple
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "hero",
|
||||
},
|
||||
{
|
||||
name: "Menu",
|
||||
id: "menu",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "contact",
|
||||
},
|
||||
{ name: "Home", id: "hero" },
|
||||
{ name: "Order Online", id: "menu" },
|
||||
{ name: "Contact", id: "contact" },
|
||||
]}
|
||||
brandName="First Class Commemy"
|
||||
/>
|
||||
@@ -48,68 +39,15 @@ export default function LandingPage() {
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroSplit
|
||||
background={{
|
||||
variant: "gradient-bars",
|
||||
}}
|
||||
title="Delicious Meals Anytime"
|
||||
description="First Class Commemy Restaurant – Open 24/7. Get your favorite local dishes, grills, and fast food delivered right to your doorstep in Glefe, Accra."
|
||||
background={{ variant: "gradient-bars" }}
|
||||
title="First Class Meals, Delivered 24/7"
|
||||
description="Authentic local flavors, fresh grills, and fast food. Choose delivery or takeaway and get your meal in minutes."
|
||||
buttons={[
|
||||
{
|
||||
text: "Order Now",
|
||||
href: "#menu",
|
||||
},
|
||||
{
|
||||
text: "Contact Us",
|
||||
href: "#contact",
|
||||
},
|
||||
{ text: "Start Ordering", href: "#menu" },
|
||||
{ text: "WhatsApp Us", href: "https://wa.me/233245069210" },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/top-view-indian-chiken-rice_23-2148294950.jpg?_wi=1"
|
||||
mediaAnimation="slide-up"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/stir-frying-beef-with-sweet-peppers-green-beans-rice_2829-20132.jpg",
|
||||
alt: "Customer 1",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/indian-food-arrangement-high-angle_23-2148747620.jpg",
|
||||
alt: "Customer 2",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/view-water-glass_23-2150718304.jpg",
|
||||
alt: "Customer 3",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/breakfast-sandwich-made-with-bread-fried-egg-ham-lettuce_1150-25677.jpg",
|
||||
alt: "Customer 4",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/half-shot-chicken-nuggets-black-plate-fork-ketchup-dark-color-tray_179666-42589.jpg",
|
||||
alt: "Customer 5",
|
||||
},
|
||||
]}
|
||||
avatarText="Join 1,000+ happy diners"
|
||||
marqueeItems={[
|
||||
{
|
||||
type: "text",
|
||||
text: "24/7 Delivery",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Authentic Local Flavors",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Freshly Prepared Daily",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Best Grills in Accra",
|
||||
},
|
||||
{
|
||||
type: "text",
|
||||
text: "Family Friendly",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -119,46 +57,19 @@ export default function LandingPage() {
|
||||
textboxLayout="split"
|
||||
gridVariant="three-columns-all-equal-width"
|
||||
useInvertedBackground={false}
|
||||
title="Place Your Order"
|
||||
description="Select your items and tap 'Order on WhatsApp' to finalize your delivery or takeaway request."
|
||||
products={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Classic Jollof Rice",
|
||||
price: "Check menu",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/stir-frying-beef-with-sweet-peppers-green-beans-rice_2829-20132.jpg",
|
||||
id: "1", name: "Classic Jollof Rice", price: "GH₵ 45", imageSrc: "http://img.b2bpic.net/free-photo/stir-frying-beef-with-sweet-peppers-green-beans-rice_2829-20132.jpg", priceButtonProps: { onClick: () => window.open('https://wa.me/233245069210?text=I%20would%20like%20to%20order%20Classic%20Jollof%20Rice', '_blank') }
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Grilled Tilapia & Banku",
|
||||
price: "Check menu",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/indian-food-arrangement-high-angle_23-2148747620.jpg",
|
||||
id: "2", name: "Grilled Tilapia & Banku", price: "GH₵ 85", imageSrc: "http://img.b2bpic.net/free-photo/indian-food-arrangement-high-angle_23-2148747620.jpg", priceButtonProps: { onClick: () => window.open('https://wa.me/233245069210?text=I%20would%20like%20to%20order%20Grilled%20Tilapia%20%26%20Banku', '_blank') }
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Cold Refreshing Drinks",
|
||||
price: "Check menu",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/view-water-glass_23-2150718304.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Full English Breakfast",
|
||||
price: "Check menu",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/breakfast-sandwich-made-with-bread-fried-egg-ham-lettuce_1150-25677.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Crispy Fried Chicken",
|
||||
price: "Check menu",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/half-shot-chicken-nuggets-black-plate-fork-ketchup-dark-color-tray_179666-42589.jpg",
|
||||
},
|
||||
{
|
||||
id: "6",
|
||||
name: "Fresh Berry Dessert",
|
||||
price: "Check menu",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/dessert-with-strawberry-blueberry-cherry-cutting-board-vase-grey-wooden-surface-high-angle-view_176474-6626.jpg",
|
||||
},
|
||||
id: "3", name: "Crispy Fried Chicken", price: "GH₵ 55", imageSrc: "http://img.b2bpic.net/free-photo/half-shot-chicken-nuggets-black-plate-fork-ketchup-dark-color-tray_179666-42589.jpg", priceButtonProps: { onClick: () => window.open('https://wa.me/233245069210?text=I%20would%20like%20to%20order%20Crispy%20Fried%20Chicken', '_blank') }
|
||||
}
|
||||
]}
|
||||
title="Explore Our Menu"
|
||||
description="Discover our wide variety of dishes, ranging from traditional local favorites to fresh grilled specialties."
|
||||
/>
|
||||
</div>
|
||||
|
||||
@@ -167,83 +78,12 @@ export default function LandingPage() {
|
||||
animationType="slide-up"
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
title="Ordering Options"
|
||||
description="Choose how you want to receive your fresh meal."
|
||||
features={[
|
||||
{
|
||||
icon: Car,
|
||||
title: "24/7 Delivery",
|
||||
description: "Anytime, anywhere in Glefe.",
|
||||
},
|
||||
{
|
||||
icon: Utensils,
|
||||
title: "Dine-in Service",
|
||||
description: "Casual, family-friendly atmosphere.",
|
||||
},
|
||||
{
|
||||
icon: ShoppingBag,
|
||||
title: "Quick Takeaway",
|
||||
description: "Grab your favorites on the go.",
|
||||
},
|
||||
{
|
||||
icon: Calendar,
|
||||
title: "Easy Reservations",
|
||||
description: "Book your table for group events.",
|
||||
},
|
||||
{
|
||||
icon: Leaf,
|
||||
title: "Outdoor Seating",
|
||||
description: "Enjoy meals in the fresh air.",
|
||||
},
|
||||
{
|
||||
icon: Award,
|
||||
title: "Expert Catering",
|
||||
description: "Professional service for any event.",
|
||||
},
|
||||
]}
|
||||
title="Why Choose Us?"
|
||||
description="Serving you top-tier quality meals 24/7 with the best services in town."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metric" data-section="metric">
|
||||
<MetricCardSeven
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={false}
|
||||
title="Our Impact"
|
||||
description="Trusted by the Glefe community for quality and consistency."
|
||||
metrics={[
|
||||
{
|
||||
id: "1",
|
||||
value: "24/7",
|
||||
title: "Always Open",
|
||||
items: [
|
||||
"Always ready for you",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
value: "50+",
|
||||
title: "Daily Orders",
|
||||
items: [
|
||||
"Freshly cooked meals",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
value: "100%",
|
||||
title: "Customer Satisfaction",
|
||||
items: [
|
||||
"Quality guaranteed",
|
||||
],
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
value: "5+",
|
||||
title: "Years Experience",
|
||||
items: [
|
||||
"Serving excellence",
|
||||
],
|
||||
},
|
||||
{ icon: Truck, title: "Home Delivery", description: "Fast delivery to your doorstep in Glefe." },
|
||||
{ icon: ShoppingBag, title: "Takeaway", description: "Order ahead and pick up at your convenience." },
|
||||
{ icon: MessageCircle, title: "WhatsApp Ordering", description: "Instant communication with our team to secure your order." },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -251,21 +91,12 @@ export default function LandingPage() {
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactCTA
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "sparkles-gradient",
|
||||
}}
|
||||
tag="Get in Touch"
|
||||
title="Ready to Eat?"
|
||||
description="Give us a call or WhatsApp us to place your order right away at 024 506 9210."
|
||||
background={{ variant: "sparkles-gradient" }}
|
||||
tag="Ready to eat?"
|
||||
title="Order in seconds"
|
||||
description="Tap below to open WhatsApp and place your delivery or takeaway order with us directly."
|
||||
buttons={[
|
||||
{
|
||||
text: "Call 024 506 9210",
|
||||
href: "tel:0245069210",
|
||||
},
|
||||
{
|
||||
text: "Order on WhatsApp",
|
||||
href: "https://wa.me/233245069210",
|
||||
},
|
||||
{ text: "Order on WhatsApp", href: "https://wa.me/233245069210", onClick: () => {} },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
@@ -275,53 +106,12 @@ export default function LandingPage() {
|
||||
imageSrc="http://img.b2bpic.net/free-photo/top-view-indian-chiken-rice_23-2148294950.jpg?_wi=2"
|
||||
logoText="First Class Commemy"
|
||||
columns={[
|
||||
{
|
||||
title: "Menu",
|
||||
items: [
|
||||
{
|
||||
label: "Local Food",
|
||||
href: "#menu",
|
||||
},
|
||||
{
|
||||
label: "Fast Food",
|
||||
href: "#menu",
|
||||
},
|
||||
{
|
||||
label: "Drinks",
|
||||
href: "#menu",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Location",
|
||||
items: [
|
||||
{
|
||||
label: "GP9C+PJG Suro Nipa Road, Glefe",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "Accra, Ghana",
|
||||
href: "#",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Contact",
|
||||
items: [
|
||||
{
|
||||
label: "024 506 9210",
|
||||
href: "tel:0245069210",
|
||||
},
|
||||
{
|
||||
label: "WhatsApp",
|
||||
href: "https://wa.me/233245069210",
|
||||
},
|
||||
],
|
||||
},
|
||||
{ title: "Quick Links", items: [{ label: "Home", href: "#hero" }, { label: "Order Online", href: "#menu" }] },
|
||||
{ title: "Contact", items: [{ label: "WhatsApp", href: "https://wa.me/233245069210" }] },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
@@ -11,14 +11,14 @@
|
||||
--background-accent: #ffffff; */
|
||||
|
||||
--background: #ffffff;
|
||||
--card: #f9f9f9;
|
||||
--foreground: #120006e6;
|
||||
--card: #fdfdfd;
|
||||
--foreground: #000000;
|
||||
--primary-cta: #e63946;
|
||||
--primary-cta-text: #ffffff;
|
||||
--secondary-cta: #ffffff;
|
||||
--secondary-cta: #1a1a1a;
|
||||
--secondary-cta-text: #120006e6;
|
||||
--accent: #120006e6;
|
||||
--background-accent: #e63946;
|
||||
--accent: #e63946;
|
||||
--background-accent: #f9f9f9;
|
||||
|
||||
/* text sizing - set by ThemeProvider */
|
||||
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
|
||||
|
||||
Reference in New Issue
Block a user