62 lines
1.8 KiB
TypeScript
62 lines
1.8 KiB
TypeScript
"use client";
|
|
|
|
import React from "react";
|
|
import { Heading } from "./heading";
|
|
import { Subheading } from "./subheading";
|
|
import { Card } from "./ui/card";
|
|
|
|
export const Menu = () => {
|
|
const menuItems = [
|
|
{
|
|
name: "Kebab Classique",
|
|
description: "Viande marinée, salade, tomates, oignons, sauce maison",
|
|
price: "12.50 CHF",
|
|
},
|
|
{
|
|
name: "Kebab Poulet",
|
|
description: "Poulet grillé, salade, tomates, oignons, sauce yaourt",
|
|
price: "11.90 CHF",
|
|
},
|
|
{
|
|
name: "Kebab Végétarien",
|
|
description: "Falafels, salade, tomates, oignons, sauce tahini",
|
|
price: "10.50 CHF",
|
|
},
|
|
{
|
|
name: "Durum",
|
|
description: "Viande ou poulet, salade, tomates, oignons, sauce, enroulé dans une galette",
|
|
price: "11.00 CHF",
|
|
},
|
|
{
|
|
name: "Frites",
|
|
description: "Portion de frites maison",
|
|
price: "4.50 CHF",
|
|
},
|
|
{
|
|
name: "Boisson",
|
|
description: "Boisson gazeuse ou eau",
|
|
price: "3.00 CHF",
|
|
},
|
|
];
|
|
|
|
return (
|
|
<div className="relative z-20 py-10 lg:py-20 overflow-hidden">
|
|
<Heading as="h2">Notre Menu</Heading>
|
|
<Subheading className="text-center">
|
|
Découvrez nos délicieux kebabs et accompagnements
|
|
</Subheading>
|
|
|
|
<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6 mt-12 max-w-6xl mx-auto">
|
|
{menuItems.map((item, index) => (
|
|
<Card key={index} className="p-6 hover:shadow-lg transition-shadow duration-300">
|
|
<div className="flex justify-between items-start mb-4">
|
|
<h3 className="text-xl font-semibold">{item.name}</h3>
|
|
<span className="text-lg font-medium">{item.price}</span>
|
|
</div>
|
|
<p className="text-muted-foreground dark:text-muted-dark">{item.description}</p>
|
|
</Card>
|
|
))}
|
|
</div>
|
|
</div>
|
|
);
|
|
}; |