|
|
|
|
@@ -6,9 +6,19 @@ import HeroSplitDualMedia from '@/components/sections/hero/HeroSplitDualMedia';
|
|
|
|
|
import ProductCardOne from '@/components/sections/product/ProductCardOne';
|
|
|
|
|
import FeatureCardTwentyFour from '@/components/sections/feature/FeatureCardTwentyFour';
|
|
|
|
|
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
|
|
|
|
|
import { Smartphone, UtensilsCrossed, Zap } from "lucide-react";
|
|
|
|
|
import { Smartphone, UtensilsCrossed, Zap, Bell, FileText } from "lucide-react";
|
|
|
|
|
|
|
|
|
|
export default function LandingPage() {
|
|
|
|
|
const handleServerCall = () => {
|
|
|
|
|
alert("Server call notification sent to restaurant tablet!");
|
|
|
|
|
console.log("Server call notification sent");
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
const handleBillingRequest = () => {
|
|
|
|
|
alert("Billing request notification sent to restaurant tablet!");
|
|
|
|
|
console.log("Billing request notification sent");
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
|
<ThemeProvider
|
|
|
|
|
defaultButtonVariant="expand-hover"
|
|
|
|
|
@@ -26,7 +36,7 @@ export default function LandingPage() {
|
|
|
|
|
<NavbarStyleFullscreen
|
|
|
|
|
navItems={[
|
|
|
|
|
{ name: "Menu", id: "menu" },
|
|
|
|
|
{ name: "About", id: "about" },
|
|
|
|
|
{ name: "Features", id: "features" },
|
|
|
|
|
{ name: "Contact", id: "contact" }
|
|
|
|
|
]}
|
|
|
|
|
brandName="Digital Menu"
|
|
|
|
|
@@ -99,15 +109,15 @@ export default function LandingPage() {
|
|
|
|
|
tagAnimation="slide-up"
|
|
|
|
|
features={[
|
|
|
|
|
{
|
|
|
|
|
id: "1", title: "Browse & Order", author: "Menu", description: "Explore our full menu with high-quality photography, detailed ingredient lists, and allergen information. Order directly from your table.", tags: ["Menu", "Ordering", "Food"],
|
|
|
|
|
id: "1", title: "Browse & Order in 30 Seconds", author: "Menu", description: "Explore our full menu with high-quality photography, detailed ingredient lists, and allergen information. Order directly from your table.", tags: ["Menu", "Ordering", "Food"],
|
|
|
|
|
imageSrc: "http://img.b2bpic.net/free-photo/grilled-chicken-breast-with-potato-greens-spices-sauces-side-view_141793-3740.jpg?_wi=2", imageAlt: "Menu browsing interface"
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
id: "2", title: "Request Your Bill", author: "Billing", description: "Request your bill instantly with a single tap. Our staff receives the notification immediately and brings your check promptly.", tags: ["Billing", "Payment", "Service"],
|
|
|
|
|
id: "2", title: "Get Your Check in 2 Minutes", author: "Billing", description: "Request your bill instantly with a single tap. Our staff receives the notification immediately on our tablet system and brings your check promptly. No waiting, no signal needed.", tags: ["Billing", "Payment", "Service"],
|
|
|
|
|
imageSrc: "http://img.b2bpic.net/free-photo/smiling-barista-using-digital-tablet-while-working-bar_637285-3367.jpg", imageAlt: "Billing request interface"
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
id: "3", title: "Call a Server", author: "Service", description: "Need assistance? Tap to call a staff member. Server notifications arrive instantly on our tablet system for immediate response.", tags: ["Service", "Support", "Staff"],
|
|
|
|
|
id: "3", title: "Call a Server in Seconds", author: "Service", description: "Need assistance? Tap to call a staff member. Server notifications arrive instantly on our tablet system for immediate response to any requests or questions.", tags: ["Service", "Support", "Staff"],
|
|
|
|
|
imageSrc: "http://img.b2bpic.net/free-photo/closeup-waiter-taking-order-touchpad-while-talking-guest-pub_637285-2460.jpg", imageAlt: "Server call interface"
|
|
|
|
|
}
|
|
|
|
|
]}
|
|
|
|
|
@@ -117,6 +127,56 @@ export default function LandingPage() {
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div id="contact" data-section="contact">
|
|
|
|
|
<div className="w-full py-20 px-6 md:px-10 bg-gradient-to-br from-background via-card to-background">
|
|
|
|
|
<div className="max-w-4xl mx-auto">
|
|
|
|
|
<div className="grid grid-cols-1 md:grid-cols-2 gap-8">
|
|
|
|
|
<div className="flex flex-col justify-center space-y-6">
|
|
|
|
|
<div>
|
|
|
|
|
<h2 className="text-4xl md:text-5xl font-bold mb-4 text-foreground">Need Assistance?</h2>
|
|
|
|
|
<p className="text-lg text-foreground/70">Use these quick action buttons to communicate with our restaurant staff instantly through our tablet notification system.</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div className="space-y-4">
|
|
|
|
|
<button
|
|
|
|
|
onClick={handleServerCall}
|
|
|
|
|
className="w-full flex items-center justify-center gap-3 px-6 py-4 bg-primary-cta text-primary-cta-text rounded-full font-semibold hover:shadow-lg transition-all duration-300 text-lg"
|
|
|
|
|
>
|
|
|
|
|
<Bell className="w-6 h-6" />
|
|
|
|
|
Call a Server
|
|
|
|
|
</button>
|
|
|
|
|
<button
|
|
|
|
|
onClick={handleBillingRequest}
|
|
|
|
|
className="w-full flex items-center justify-center gap-3 px-6 py-4 bg-secondary-cta text-secondary-cta-text rounded-full font-semibold hover:shadow-lg transition-all duration-300 text-lg border-2 border-primary-cta"
|
|
|
|
|
>
|
|
|
|
|
<FileText className="w-6 h-6" />
|
|
|
|
|
Request Billing
|
|
|
|
|
</button>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div className="flex flex-col justify-center space-y-6">
|
|
|
|
|
<div className="bg-card rounded-2xl p-8 space-y-4">
|
|
|
|
|
<h3 className="text-2xl font-bold text-foreground">How It Works</h3>
|
|
|
|
|
<ul className="space-y-3 text-foreground/70">
|
|
|
|
|
<li className="flex gap-3">
|
|
|
|
|
<span className="text-primary-cta font-bold">1.</span>
|
|
|
|
|
<span>Tap "Call a Server" and a notification appears instantly on our tablet at the host stand.</span>
|
|
|
|
|
</li>
|
|
|
|
|
<li className="flex gap-3">
|
|
|
|
|
<span className="text-primary-cta font-bold">2.</span>
|
|
|
|
|
<span>Our staff receives your request immediately and responds within seconds.</span>
|
|
|
|
|
</li>
|
|
|
|
|
<li className="flex gap-3">
|
|
|
|
|
<span className="text-primary-cta font-bold">3.</span>
|
|
|
|
|
<span>Tap "Request Billing" when ready to pay, and your check arrives promptly.</span>
|
|
|
|
|
</li>
|
|
|
|
|
</ul>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div id="footer" data-section="footer">
|
|
|
|
|
<FooterLogoEmphasis
|
|
|
|
|
logoText="Digital Menu"
|
|
|
|
|
@@ -130,7 +190,7 @@ export default function LandingPage() {
|
|
|
|
|
{
|
|
|
|
|
items: [
|
|
|
|
|
{ label: "About Us", href: "#" },
|
|
|
|
|
{ label: "Contact", href: "#" }
|
|
|
|
|
{ label: "Contact", href: "#contact" }
|
|
|
|
|
]
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
@@ -144,4 +204,4 @@ export default function LandingPage() {
|
|
|
|
|
</div>
|
|
|
|
|
</ThemeProvider>
|
|
|
|
|
);
|
|
|
|
|
}
|
|
|
|
|
}
|