aboutsummaryrefslogtreecommitdiffstats
path: root/frontend/src/app
diff options
context:
space:
mode:
Diffstat (limited to 'frontend/src/app')
-rw-r--r--frontend/src/app/(auth)/login/page.js34
-rw-r--r--frontend/src/app/(auth)/register/page.js34
-rw-r--r--frontend/src/app/admin/page.js293
-rw-r--r--frontend/src/app/favicon.icobin0 -> 25931 bytes
-rw-r--r--frontend/src/app/globals.css122
-rw-r--r--frontend/src/app/layout.js30
-rw-r--r--frontend/src/app/page.js219
7 files changed, 732 insertions, 0 deletions
diff --git a/frontend/src/app/(auth)/login/page.js b/frontend/src/app/(auth)/login/page.js
new file mode 100644
index 0000000..03208e0
--- /dev/null
+++ b/frontend/src/app/(auth)/login/page.js
@@ -0,0 +1,34 @@
+import Link from 'next/link';
+import LoginForm from '@/components/auth/LoginForm';
+
+export const metadata = {
+ title: 'Login - Restaurant Management System',
+ description: 'Login to your account',
+};
+
+const LoginPage = () => {
+ return (
+ <div className="min-h-screen flex flex-col justify-center items-center p-4 bg-gray-50 dark:bg-slate-900">
+ <div className="w-full max-w-md text-center mb-8">
+ <Link href="/" className="text-2xl font-bold text-primary">
+ Restaurant
+ </Link>
+ <h1 className="text-3xl font-bold mt-6">Welcome Back</h1>
+ <p className="text-gray-600 dark:text-gray-400 mt-2">
+ Enter your credentials to access your account
+ </p>
+ </div>
+
+ <LoginForm />
+
+ <p className="mt-8 text-center text-gray-600 dark:text-gray-400">
+ Don't have an account?{' '}
+ <Link href="/register" className="text-primary hover:underline">
+ Register here
+ </Link>
+ </p>
+ </div>
+ );
+};
+
+export default LoginPage; \ No newline at end of file
diff --git a/frontend/src/app/(auth)/register/page.js b/frontend/src/app/(auth)/register/page.js
new file mode 100644
index 0000000..1916413
--- /dev/null
+++ b/frontend/src/app/(auth)/register/page.js
@@ -0,0 +1,34 @@
+import Link from 'next/link';
+import RegisterForm from '@/components/auth/RegisterForm';
+
+export const metadata = {
+ title: 'Register - Restaurant Management System',
+ description: 'Create a new account',
+};
+
+const RegisterPage = () => {
+ return (
+ <div className="min-h-screen flex flex-col justify-center items-center p-4 bg-gray-50 dark:bg-slate-900">
+ <div className="w-full max-w-md text-center mb-8">
+ <Link href="/" className="text-2xl font-bold text-primary">
+ Restaurant
+ </Link>
+ <h1 className="text-3xl font-bold mt-6">Create Account</h1>
+ <p className="text-gray-600 dark:text-gray-400 mt-2">
+ Join us to enjoy delicious food and exclusive offers
+ </p>
+ </div>
+
+ <RegisterForm />
+
+ <p className="mt-8 text-center text-gray-600 dark:text-gray-400">
+ Already have an account?{' '}
+ <Link href="/login" className="text-primary hover:underline">
+ Login here
+ </Link>
+ </p>
+ </div>
+ );
+};
+
+export default RegisterPage; \ No newline at end of file
diff --git a/frontend/src/app/admin/page.js b/frontend/src/app/admin/page.js
new file mode 100644
index 0000000..9f0e737
--- /dev/null
+++ b/frontend/src/app/admin/page.js
@@ -0,0 +1,293 @@
+import AdminLayout from '@/components/layouts/AdminLayout';
+
+export const metadata = {
+ title: 'Admin Dashboard - Restaurant Management System',
+ description: 'Admin dashboard for managing the restaurant',
+};
+
+const AdminDashboard = () => {
+ return (
+ <AdminLayout>
+ <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6 mb-8">
+ {/* Stats Card: Total Orders */}
+ <div className="bg-white dark:bg-slate-800 p-6 rounded-lg shadow-md">
+ <h3 className="text-sm font-medium text-gray-500 dark:text-gray-400 mb-1">
+ Total Orders
+ </h3>
+ <p className="text-3xl font-bold">128</p>
+ <div className="mt-2 flex items-center text-sm text-green-600">
+ <svg
+ xmlns="http://www.w3.org/2000/svg"
+ width="16"
+ height="16"
+ viewBox="0 0 24 24"
+ fill="none"
+ stroke="currentColor"
+ strokeWidth="2"
+ strokeLinecap="round"
+ strokeLinejoin="round"
+ className="mr-1"
+ >
+ <polyline points="23 6 13.5 15.5 8.5 10.5 1 18" />
+ <polyline points="17 6 23 6 23 12" />
+ </svg>
+ <span>12% increase</span>
+ </div>
+ </div>
+
+ {/* Stats Card: Revenue */}
+ <div className="bg-white dark:bg-slate-800 p-6 rounded-lg shadow-md">
+ <h3 className="text-sm font-medium text-gray-500 dark:text-gray-400 mb-1">
+ Revenue
+ </h3>
+ <p className="text-3xl font-bold">$3,240</p>
+ <div className="mt-2 flex items-center text-sm text-green-600">
+ <svg
+ xmlns="http://www.w3.org/2000/svg"
+ width="16"
+ height="16"
+ viewBox="0 0 24 24"
+ fill="none"
+ stroke="currentColor"
+ strokeWidth="2"
+ strokeLinecap="round"
+ strokeLinejoin="round"
+ className="mr-1"
+ >
+ <polyline points="23 6 13.5 15.5 8.5 10.5 1 18" />
+ <polyline points="17 6 23 6 23 12" />
+ </svg>
+ <span>8% increase</span>
+ </div>
+ </div>
+
+ {/* Stats Card: Customers */}
+ <div className="bg-white dark:bg-slate-800 p-6 rounded-lg shadow-md">
+ <h3 className="text-sm font-medium text-gray-500 dark:text-gray-400 mb-1">
+ Customers
+ </h3>
+ <p className="text-3xl font-bold">64</p>
+ <div className="mt-2 flex items-center text-sm text-green-600">
+ <svg
+ xmlns="http://www.w3.org/2000/svg"
+ width="16"
+ height="16"
+ viewBox="0 0 24 24"
+ fill="none"
+ stroke="currentColor"
+ strokeWidth="2"
+ strokeLinecap="round"
+ strokeLinejoin="round"
+ className="mr-1"
+ >
+ <polyline points="23 6 13.5 15.5 8.5 10.5 1 18" />
+ <polyline points="17 6 23 6 23 12" />
+ </svg>
+ <span>24% increase</span>
+ </div>
+ </div>
+
+ {/* Stats Card: Reservations */}
+ <div className="bg-white dark:bg-slate-800 p-6 rounded-lg shadow-md">
+ <h3 className="text-sm font-medium text-gray-500 dark:text-gray-400 mb-1">
+ Reservations
+ </h3>
+ <p className="text-3xl font-bold">32</p>
+ <div className="mt-2 flex items-center text-sm text-yellow-600">
+ <svg
+ xmlns="http://www.w3.org/2000/svg"
+ width="16"
+ height="16"
+ viewBox="0 0 24 24"
+ fill="none"
+ stroke="currentColor"
+ strokeWidth="2"
+ strokeLinecap="round"
+ strokeLinejoin="round"
+ className="mr-1"
+ >
+ <line x1="5" y1="12" x2="19" y2="12" />
+ </svg>
+ <span>Same as last week</span>
+ </div>
+ </div>
+ </div>
+
+ {/* Recent Orders */}
+ <div className="bg-white dark:bg-slate-800 rounded-lg shadow-md mb-8">
+ <div className="p-6 border-b border-gray-200 dark:border-slate-700">
+ <h2 className="text-lg font-semibold">Recent Orders</h2>
+ </div>
+ <div className="overflow-x-auto">
+ <table className="w-full text-sm">
+ <thead className="bg-gray-50 dark:bg-slate-700">
+ <tr>
+ <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">
+ Order ID
+ </th>
+ <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">
+ Customer
+ </th>
+ <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">
+ Date
+ </th>
+ <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">
+ Status
+ </th>
+ <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">
+ Amount
+ </th>
+ </tr>
+ </thead>
+ <tbody className="divide-y divide-gray-200 dark:divide-slate-700">
+ <tr>
+ <td className="px-6 py-4 whitespace-nowrap">#ORDER123</td>
+ <td className="px-6 py-4 whitespace-nowrap">John Smith</td>
+ <td className="px-6 py-4 whitespace-nowrap">Apr 28, 2025</td>
+ <td className="px-6 py-4 whitespace-nowrap">
+ <span className="px-2 py-1 text-xs rounded-full bg-green-100 text-green-800 dark:bg-green-800/20 dark:text-green-400">
+ Completed
+ </span>
+ </td>
+ <td className="px-6 py-4 whitespace-nowrap">$128.50</td>
+ </tr>
+ <tr>
+ <td className="px-6 py-4 whitespace-nowrap">#ORDER122</td>
+ <td className="px-6 py-4 whitespace-nowrap">Sarah Johnson</td>
+ <td className="px-6 py-4 whitespace-nowrap">Apr 28, 2025</td>
+ <td className="px-6 py-4 whitespace-nowrap">
+ <span className="px-2 py-1 text-xs rounded-full bg-yellow-100 text-yellow-800 dark:bg-yellow-800/20 dark:text-yellow-400">
+ Preparing
+ </span>
+ </td>
+ <td className="px-6 py-4 whitespace-nowrap">$75.20</td>
+ </tr>
+ <tr>
+ <td className="px-6 py-4 whitespace-nowrap">#ORDER121</td>
+ <td className="px-6 py-4 whitespace-nowrap">Michael Brown</td>
+ <td className="px-6 py-4 whitespace-nowrap">Apr 27, 2025</td>
+ <td className="px-6 py-4 whitespace-nowrap">
+ <span className="px-2 py-1 text-xs rounded-full bg-blue-100 text-blue-800 dark:bg-blue-800/20 dark:text-blue-400">
+ Delivered
+ </span>
+ </td>
+ <td className="px-6 py-4 whitespace-nowrap">$92.40</td>
+ </tr>
+ <tr>
+ <td className="px-6 py-4 whitespace-nowrap">#ORDER120</td>
+ <td className="px-6 py-4 whitespace-nowrap">Emma Wilson</td>
+ <td className="px-6 py-4 whitespace-nowrap">Apr 27, 2025</td>
+ <td className="px-6 py-4 whitespace-nowrap">
+ <span className="px-2 py-1 text-xs rounded-full bg-green-100 text-green-800 dark:bg-green-800/20 dark:text-green-400">
+ Completed
+ </span>
+ </td>
+ <td className="px-6 py-4 whitespace-nowrap">$54.60</td>
+ </tr>
+ <tr>
+ <td className="px-6 py-4 whitespace-nowrap">#ORDER119</td>
+ <td className="px-6 py-4 whitespace-nowrap">David Clark</td>
+ <td className="px-6 py-4 whitespace-nowrap">Apr 26, 2025</td>
+ <td className="px-6 py-4 whitespace-nowrap">
+ <span className="px-2 py-1 text-xs rounded-full bg-red-100 text-red-800 dark:bg-red-800/20 dark:text-red-400">
+ Cancelled
+ </span>
+ </td>
+ <td className="px-6 py-4 whitespace-nowrap">$0.00</td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+ </div>
+
+ {/* Today's Reservations */}
+ <div className="bg-white dark:bg-slate-800 rounded-lg shadow-md">
+ <div className="p-6 border-b border-gray-200 dark:border-slate-700">
+ <h2 className="text-lg font-semibold">Today's Reservations</h2>
+ </div>
+ <div className="overflow-x-auto">
+ <table className="w-full text-sm">
+ <thead className="bg-gray-50 dark:bg-slate-700">
+ <tr>
+ <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">
+ Customer
+ </th>
+ <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">
+ Time
+ </th>
+ <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">
+ Table
+ </th>
+ <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">
+ Guests
+ </th>
+ <th className="px-6 py-3 text-left text-xs font-medium text-gray-500 dark:text-gray-400 uppercase tracking-wider">
+ Status
+ </th>
+ </tr>
+ </thead>
+ <tbody className="divide-y divide-gray-200 dark:divide-slate-700">
+ <tr>
+ <td className="px-6 py-4 whitespace-nowrap">Jessica Lee</td>
+ <td className="px-6 py-4 whitespace-nowrap">12:30 PM</td>
+ <td className="px-6 py-4 whitespace-nowrap">Table 5</td>
+ <td className="px-6 py-4 whitespace-nowrap">4</td>
+ <td className="px-6 py-4 whitespace-nowrap">
+ <span className="px-2 py-1 text-xs rounded-full bg-green-100 text-green-800 dark:bg-green-800/20 dark:text-green-400">
+ Confirmed
+ </span>
+ </td>
+ </tr>
+ <tr>
+ <td className="px-6 py-4 whitespace-nowrap">Robert Taylor</td>
+ <td className="px-6 py-4 whitespace-nowrap">1:00 PM</td>
+ <td className="px-6 py-4 whitespace-nowrap">Table 8</td>
+ <td className="px-6 py-4 whitespace-nowrap">2</td>
+ <td className="px-6 py-4 whitespace-nowrap">
+ <span className="px-2 py-1 text-xs rounded-full bg-green-100 text-green-800 dark:bg-green-800/20 dark:text-green-400">
+ Confirmed
+ </span>
+ </td>
+ </tr>
+ <tr>
+ <td className="px-6 py-4 whitespace-nowrap">Maria Rodriguez</td>
+ <td className="px-6 py-4 whitespace-nowrap">7:00 PM</td>
+ <td className="px-6 py-4 whitespace-nowrap">Table 12</td>
+ <td className="px-6 py-4 whitespace-nowrap">6</td>
+ <td className="px-6 py-4 whitespace-nowrap">
+ <span className="px-2 py-1 text-xs rounded-full bg-yellow-100 text-yellow-800 dark:bg-yellow-800/20 dark:text-yellow-400">
+ Pending
+ </span>
+ </td>
+ </tr>
+ <tr>
+ <td className="px-6 py-4 whitespace-nowrap">James Wilson</td>
+ <td className="px-6 py-4 whitespace-nowrap">7:30 PM</td>
+ <td className="px-6 py-4 whitespace-nowrap">Table 3</td>
+ <td className="px-6 py-4 whitespace-nowrap">2</td>
+ <td className="px-6 py-4 whitespace-nowrap">
+ <span className="px-2 py-1 text-xs rounded-full bg-green-100 text-green-800 dark:bg-green-800/20 dark:text-green-400">
+ Confirmed
+ </span>
+ </td>
+ </tr>
+ <tr>
+ <td className="px-6 py-4 whitespace-nowrap">Emily Davis</td>
+ <td className="px-6 py-4 whitespace-nowrap">8:00 PM</td>
+ <td className="px-6 py-4 whitespace-nowrap">Table 7</td>
+ <td className="px-6 py-4 whitespace-nowrap">4</td>
+ <td className="px-6 py-4 whitespace-nowrap">
+ <span className="px-2 py-1 text-xs rounded-full bg-green-100 text-green-800 dark:bg-green-800/20 dark:text-green-400">
+ Confirmed
+ </span>
+ </td>
+ </tr>
+ </tbody>
+ </table>
+ </div>
+ </div>
+ </AdminLayout>
+ );
+};
+
+export default AdminDashboard; \ No newline at end of file
diff --git a/frontend/src/app/favicon.ico b/frontend/src/app/favicon.ico
new file mode 100644
index 0000000..718d6fe
--- /dev/null
+++ b/frontend/src/app/favicon.ico
Binary files differ
diff --git a/frontend/src/app/globals.css b/frontend/src/app/globals.css
new file mode 100644
index 0000000..dc98be7
--- /dev/null
+++ b/frontend/src/app/globals.css
@@ -0,0 +1,122 @@
+@import "tailwindcss";
+@import "tw-animate-css";
+
+@custom-variant dark (&:is(.dark *));
+
+@theme inline {
+ --color-background: var(--background);
+ --color-foreground: var(--foreground);
+ --font-sans: var(--font-geist-sans);
+ --font-mono: var(--font-geist-mono);
+ --color-sidebar-ring: var(--sidebar-ring);
+ --color-sidebar-border: var(--sidebar-border);
+ --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
+ --color-sidebar-accent: var(--sidebar-accent);
+ --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
+ --color-sidebar-primary: var(--sidebar-primary);
+ --color-sidebar-foreground: var(--sidebar-foreground);
+ --color-sidebar: var(--sidebar);
+ --color-chart-5: var(--chart-5);
+ --color-chart-4: var(--chart-4);
+ --color-chart-3: var(--chart-3);
+ --color-chart-2: var(--chart-2);
+ --color-chart-1: var(--chart-1);
+ --color-ring: var(--ring);
+ --color-input: var(--input);
+ --color-border: var(--border);
+ --color-destructive: var(--destructive);
+ --color-accent-foreground: var(--accent-foreground);
+ --color-accent: var(--accent);
+ --color-muted-foreground: var(--muted-foreground);
+ --color-muted: var(--muted);
+ --color-secondary-foreground: var(--secondary-foreground);
+ --color-secondary: var(--secondary);
+ --color-primary-foreground: var(--primary-foreground);
+ --color-primary: var(--primary);
+ --color-popover-foreground: var(--popover-foreground);
+ --color-popover: var(--popover);
+ --color-card-foreground: var(--card-foreground);
+ --color-card: var(--card);
+ --radius-sm: calc(var(--radius) - 4px);
+ --radius-md: calc(var(--radius) - 2px);
+ --radius-lg: var(--radius);
+ --radius-xl: calc(var(--radius) + 4px);
+}
+
+:root {
+ --radius: 0.625rem;
+ --background: oklch(1 0 0);
+ --foreground: oklch(0.145 0 0);
+ --card: oklch(1 0 0);
+ --card-foreground: oklch(0.145 0 0);
+ --popover: oklch(1 0 0);
+ --popover-foreground: oklch(0.145 0 0);
+ --primary: oklch(0.205 0 0);
+ --primary-foreground: oklch(0.985 0 0);
+ --secondary: oklch(0.97 0 0);
+ --secondary-foreground: oklch(0.205 0 0);
+ --muted: oklch(0.97 0 0);
+ --muted-foreground: oklch(0.556 0 0);
+ --accent: oklch(0.97 0 0);
+ --accent-foreground: oklch(0.205 0 0);
+ --destructive: oklch(0.577 0.245 27.325);
+ --border: oklch(0.922 0 0);
+ --input: oklch(0.922 0 0);
+ --ring: oklch(0.708 0 0);
+ --chart-1: oklch(0.646 0.222 41.116);
+ --chart-2: oklch(0.6 0.118 184.704);
+ --chart-3: oklch(0.398 0.07 227.392);
+ --chart-4: oklch(0.828 0.189 84.429);
+ --chart-5: oklch(0.769 0.188 70.08);
+ --sidebar: oklch(0.985 0 0);
+ --sidebar-foreground: oklch(0.145 0 0);
+ --sidebar-primary: oklch(0.205 0 0);
+ --sidebar-primary-foreground: oklch(0.985 0 0);
+ --sidebar-accent: oklch(0.97 0 0);
+ --sidebar-accent-foreground: oklch(0.205 0 0);
+ --sidebar-border: oklch(0.922 0 0);
+ --sidebar-ring: oklch(0.708 0 0);
+}
+
+.dark {
+ --background: oklch(0.145 0 0);
+ --foreground: oklch(0.985 0 0);
+ --card: oklch(0.205 0 0);
+ --card-foreground: oklch(0.985 0 0);
+ --popover: oklch(0.205 0 0);
+ --popover-foreground: oklch(0.985 0 0);
+ --primary: oklch(0.922 0 0);
+ --primary-foreground: oklch(0.205 0 0);
+ --secondary: oklch(0.269 0 0);
+ --secondary-foreground: oklch(0.985 0 0);
+ --muted: oklch(0.269 0 0);
+ --muted-foreground: oklch(0.708 0 0);
+ --accent: oklch(0.269 0 0);
+ --accent-foreground: oklch(0.985 0 0);
+ --destructive: oklch(0.704 0.191 22.216);
+ --border: oklch(1 0 0 / 10%);
+ --input: oklch(1 0 0 / 15%);
+ --ring: oklch(0.556 0 0);
+ --chart-1: oklch(0.488 0.243 264.376);
+ --chart-2: oklch(0.696 0.17 162.48);
+ --chart-3: oklch(0.769 0.188 70.08);
+ --chart-4: oklch(0.627 0.265 303.9);
+ --chart-5: oklch(0.645 0.246 16.439);
+ --sidebar: oklch(0.205 0 0);
+ --sidebar-foreground: oklch(0.985 0 0);
+ --sidebar-primary: oklch(0.488 0.243 264.376);
+ --sidebar-primary-foreground: oklch(0.985 0 0);
+ --sidebar-accent: oklch(0.269 0 0);
+ --sidebar-accent-foreground: oklch(0.985 0 0);
+ --sidebar-border: oklch(1 0 0 / 10%);
+ --sidebar-ring: oklch(0.556 0 0);
+}
+
+@layer base {
+ * {
+ @apply border-border outline-ring/50;
+ }
+ body {
+ @apply bg-background text-foreground;
+ }
+}
diff --git a/frontend/src/app/layout.js b/frontend/src/app/layout.js
new file mode 100644
index 0000000..de45098
--- /dev/null
+++ b/frontend/src/app/layout.js
@@ -0,0 +1,30 @@
+import { Inter } from "next/font/google";
+import "./globals.css";
+import { ThemeProvider } from "@/context/theme-context";
+import { AuthProvider } from "@/context/auth-context";
+import { CartProvider } from "@/context/cart-context";
+import { Sonner } from "@/components/ui/sonner";
+
+const inter = Inter({ subsets: ["latin"] });
+
+export const metadata = {
+ title: "Restaurant Management System",
+ description: "A full-stack application for restaurant management",
+};
+
+export default function RootLayout({ children }) {
+ return (
+ <html lang="en" suppressHydrationWarning>
+ <body className={inter.className}>
+ <ThemeProvider>
+ <AuthProvider>
+ <CartProvider>
+ {children}
+ <Sonner />
+ </CartProvider>
+ </AuthProvider>
+ </ThemeProvider>
+ </body>
+ </html>
+ );
+}
diff --git a/frontend/src/app/page.js b/frontend/src/app/page.js
new file mode 100644
index 0000000..2c7ec34
--- /dev/null
+++ b/frontend/src/app/page.js
@@ -0,0 +1,219 @@
+import Link from 'next/link';
+import MainLayout from '@/components/layouts/MainLayout';
+
+export default function Home() {
+ return (
+ <MainLayout>
+ {/* Hero section */}
+ <section className="py-16 md:py-24">
+ <div className="container mx-auto text-center">
+ <h1 className="text-4xl md:text-6xl font-bold mb-6">
+ Experience the <span className="text-primary">Finest</span> Cuisine
+ </h1>
+ <p className="text-lg md:text-xl text-gray-600 dark:text-gray-400 mb-8 max-w-3xl mx-auto">
+ Welcome to our restaurant, where we serve delicious meals made with fresh ingredients and a passion for culinary excellence.
+ </p>
+ <div className="flex flex-wrap justify-center gap-4">
+ <Link
+ href="/menu"
+ className="px-6 py-3 bg-primary text-white rounded-md hover:bg-primary/90 transition-colors"
+ >
+ View Menu
+ </Link>
+ <Link
+ href="/reservations"
+ className="px-6 py-3 bg-white dark:bg-slate-800 border border-gray-300 dark:border-slate-700 rounded-md hover:bg-gray-50 dark:hover:bg-slate-700 transition-colors"
+ >
+ Book a Table
+ </Link>
+ </div>
+ </div>
+ </section>
+
+ {/* Featured Menu Items */}
+ <section className="py-16 bg-gray-50 dark:bg-slate-800/50">
+ <div className="container mx-auto">
+ <h2 className="text-3xl font-bold mb-12 text-center">Featured Menu Items</h2>
+ <div className="grid grid-cols-1 md:grid-cols-3 gap-8">
+ {/* Item 1 */}
+ <div className="bg-white dark:bg-slate-800 rounded-lg overflow-hidden shadow-md">
+ <div className="h-48 bg-gray-300 dark:bg-gray-700"></div>
+ <div className="p-6">
+ <h3 className="text-xl font-bold mb-2">Signature Pasta</h3>
+ <p className="text-gray-600 dark:text-gray-400 mb-4">
+ Handmade pasta with our special sauce and fresh herbs.
+ </p>
+ <div className="flex justify-between items-center">
+ <span className="text-lg font-bold">$18.99</span>
+ <button className="px-4 py-2 bg-primary text-white rounded-md hover:bg-primary/90 transition-colors">
+ Order Now
+ </button>
+ </div>
+ </div>
+ </div>
+
+ {/* Item 2 */}
+ <div className="bg-white dark:bg-slate-800 rounded-lg overflow-hidden shadow-md">
+ <div className="h-48 bg-gray-300 dark:bg-gray-700"></div>
+ <div className="p-6">
+ <h3 className="text-xl font-bold mb-2">Premium Steak</h3>
+ <p className="text-gray-600 dark:text-gray-400 mb-4">
+ Juicy, tender steak cooked to perfection with seasonal vegetables.
+ </p>
+ <div className="flex justify-between items-center">
+ <span className="text-lg font-bold">$29.99</span>
+ <button className="px-4 py-2 bg-primary text-white rounded-md hover:bg-primary/90 transition-colors">
+ Order Now
+ </button>
+ </div>
+ </div>
+ </div>
+
+ {/* Item 3 */}
+ <div className="bg-white dark:bg-slate-800 rounded-lg overflow-hidden shadow-md">
+ <div className="h-48 bg-gray-300 dark:bg-gray-700"></div>
+ <div className="p-6">
+ <h3 className="text-xl font-bold mb-2">Seafood Delight</h3>
+ <p className="text-gray-600 dark:text-gray-400 mb-4">
+ Fresh seafood mix with special spices and lemon butter sauce.
+ </p>
+ <div className="flex justify-between items-center">
+ <span className="text-lg font-bold">$24.99</span>
+ <button className="px-4 py-2 bg-primary text-white rounded-md hover:bg-primary/90 transition-colors">
+ Order Now
+ </button>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div className="text-center mt-12">
+ <Link
+ href="/menu"
+ className="px-6 py-3 bg-primary text-white rounded-md hover:bg-primary/90 transition-colors"
+ >
+ View Full Menu
+ </Link>
+ </div>
+ </div>
+ </section>
+
+ {/* About Section */}
+ <section className="py-16">
+ <div className="container mx-auto">
+ <div className="flex flex-col md:flex-row items-center gap-12">
+ <div className="md:w-1/2">
+ <div className="h-80 bg-gray-300 dark:bg-gray-700 rounded-lg"></div>
+ </div>
+ <div className="md:w-1/2">
+ <h2 className="text-3xl font-bold mb-6">Our Story</h2>
+ <p className="text-gray-600 dark:text-gray-400 mb-4">
+ Founded in 2010, our restaurant has been serving the community with delicious meals made from the freshest ingredients. Our chefs are passionate about creating unforgettable dining experiences.
+ </p>
+ <p className="text-gray-600 dark:text-gray-400 mb-6">
+ We believe in sustainable practices and source our ingredients from local farmers and suppliers whenever possible.
+ </p>
+ <Link
+ href="/about"
+ className="px-6 py-3 bg-primary text-white rounded-md hover:bg-primary/90 transition-colors"
+ >
+ Learn More
+ </Link>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ {/* Testimonials */}
+ <section className="py-16 bg-gray-50 dark:bg-slate-800/50">
+ <div className="container mx-auto">
+ <h2 className="text-3xl font-bold mb-12 text-center">What Our Customers Say</h2>
+ <div className="grid grid-cols-1 md:grid-cols-3 gap-8">
+ {/* Testimonial 1 */}
+ <div className="bg-white dark:bg-slate-800 p-6 rounded-lg shadow-md">
+ <div className="flex items-center mb-4">
+ <div className="w-12 h-12 bg-gray-300 dark:bg-gray-700 rounded-full mr-4"></div>
+ <div>
+ <h3 className="font-bold">John Smith</h3>
+ <div className="flex text-yellow-400">
+ <span>★</span>
+ <span>★</span>
+ <span>★</span>
+ <span>★</span>
+ <span>★</span>
+ </div>
+ </div>
+ </div>
+ <p className="text-gray-600 dark:text-gray-400">
+ "The food was amazing and the service was exceptional. I will definitely be coming back!"
+ </p>
+ </div>
+
+ {/* Testimonial 2 */}
+ <div className="bg-white dark:bg-slate-800 p-6 rounded-lg shadow-md">
+ <div className="flex items-center mb-4">
+ <div className="w-12 h-12 bg-gray-300 dark:bg-gray-700 rounded-full mr-4"></div>
+ <div>
+ <h3 className="font-bold">Sarah Johnson</h3>
+ <div className="flex text-yellow-400">
+ <span>★</span>
+ <span>★</span>
+ <span>★</span>
+ <span>★</span>
+ <span>★</span>
+ </div>
+ </div>
+ </div>
+ <p className="text-gray-600 dark:text-gray-400">
+ "Perfect place for a special occasion. The ambiance was lovely and the food was delicious."
+ </p>
+ </div>
+
+ {/* Testimonial 3 */}
+ <div className="bg-white dark:bg-slate-800 p-6 rounded-lg shadow-md">
+ <div className="flex items-center mb-4">
+ <div className="w-12 h-12 bg-gray-300 dark:bg-gray-700 rounded-full mr-4"></div>
+ <div>
+ <h3 className="font-bold">Michael Brown</h3>
+ <div className="flex text-yellow-400">
+ <span>★</span>
+ <span>★</span>
+ <span>★</span>
+ <span>★</span>
+ <span>★</span>
+ </div>
+ </div>
+ </div>
+ <p className="text-gray-600 dark:text-gray-400">
+ "I've tried many restaurants in the area, but this one stands out. The flavors are authentic and the staff is friendly."
+ </p>
+ </div>
+ </div>
+ </div>
+ </section>
+
+ {/* Call to Action */}
+ <section className="py-16 bg-primary text-white">
+ <div className="container mx-auto text-center">
+ <h2 className="text-3xl font-bold mb-6">Ready to Experience Our Cuisine?</h2>
+ <p className="text-xl mb-8 max-w-3xl mx-auto">
+ Book your table now or order online for pickup or delivery.
+ </p>
+ <div className="flex flex-wrap justify-center gap-4">
+ <Link
+ href="/reservations"
+ className="px-6 py-3 bg-white text-primary font-bold rounded-md hover:bg-gray-100 transition-colors"
+ >
+ Book a Table
+ </Link>
+ <Link
+ href="/menu"
+ className="px-6 py-3 bg-transparent border-2 border-white rounded-md hover:bg-white/10 transition-colors"
+ >
+ Order Online
+ </Link>
+ </div>
+ </div>
+ </section>
+ </MainLayout>
+ );
+}
generated by cgit v1.2.3-59-g8ed1b (git 2.39.0) at 2025-06-16 05:09:10 +0000