Merge version_1 into main
Merge version_1 into main
This commit was merged in pull request #2.
This commit is contained in:
490
src/app/page.tsx
490
src/app/page.tsx
@@ -20,342 +20,182 @@ export default function LandingPage() {
|
||||
defaultButtonVariant="expand-hover"
|
||||
defaultTextAnimation="reveal-blur"
|
||||
borderRadius="rounded"
|
||||
contentWidth="medium"
|
||||
sizing="medium"
|
||||
background="circleGradient"
|
||||
cardStyle="glass-elevated"
|
||||
primaryButtonStyle="gradient"
|
||||
secondaryButtonStyle="glass"
|
||||
headingFontWeight="normal"
|
||||
>
|
||||
<ReactLenis root>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{
|
||||
name: "Home",
|
||||
id: "#hero",
|
||||
},
|
||||
{
|
||||
name: "About",
|
||||
id: "#about",
|
||||
},
|
||||
{
|
||||
name: "Menu",
|
||||
id: "#menu",
|
||||
},
|
||||
{
|
||||
name: "Contact",
|
||||
id: "#contact",
|
||||
},
|
||||
]}
|
||||
brandName="El Kahina"
|
||||
/>
|
||||
</div>
|
||||
<div id="nav" data-section="nav">
|
||||
<NavbarLayoutFloatingOverlay
|
||||
navItems={[
|
||||
{ name: "Home", id: "#hero" },
|
||||
{ name: "About", id: "#about" },
|
||||
{ name: "Menu", id: "#menu" },
|
||||
{ name: "Contact", id: "#contact" },
|
||||
]}
|
||||
brandName="El Kahina"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroOverlay
|
||||
title="Une expérience marine unique"
|
||||
description="Découvrez la fraîcheur authentique de la mer Méditerranée au cœur d'Aïn Bénian. Chez El Kahina, votre poisson est choisi à la source."
|
||||
buttons={[
|
||||
{
|
||||
text: "Voir le Menu",
|
||||
href: "#menu",
|
||||
},
|
||||
{
|
||||
text: "Réserver",
|
||||
href: "#contact",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/close-up-view-asian-dish_23-2147681089.jpg?_wi=1"
|
||||
avatars={[
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/jam-sliced-bread-sliced-egg-cucumber-plate-burlap-napkin-blue_114579-42463.jpg",
|
||||
alt: "Client satisfied 1",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/lavash-baked-drumsticks-pepper-plate-sauce-bowls-blue-background_114579-45634.jpg",
|
||||
alt: "Client satisfied 2",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/wooden-plate-fresh-chopped-various-vegetables-towel_114579-86390.jpg",
|
||||
alt: "Client satisfied 3",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/lobster-with-parsley-round-white-plate-near-other-dishes_181624-3250.jpg",
|
||||
alt: "Client satisfied 4",
|
||||
},
|
||||
{
|
||||
src: "http://img.b2bpic.net/free-photo/people-cheering-with-wine-glasses-luxurious-restaurant_23-2150517422.jpg",
|
||||
alt: "Client satisfied 5",
|
||||
},
|
||||
]}
|
||||
avatarText="Plus de 1000 gourmets convaincus"
|
||||
/>
|
||||
</div>
|
||||
<div id="hero" data-section="hero">
|
||||
<HeroOverlay
|
||||
title="Une expérience marine unique"
|
||||
description="Découvrez la fraîcheur authentique de la mer Méditerranée au cœur d'Aïn Bénian. Chez El Kahina, votre poisson est choisi à la source."
|
||||
buttons={[
|
||||
{ text: "Voir le Menu", href: "#menu" },
|
||||
{ text: "Réserver", href: "#contact" },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/close-up-view-asian-dish_23-2147681089.jpg"
|
||||
avatars={[
|
||||
{ src: "http://img.b2bpic.net/free-photo/jam-sliced-bread-sliced-egg-cucumber-plate-burlap-napkin-blue_114579-42463.jpg", alt: "Client satisfied 1" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/lavash-baked-drumsticks-pepper-plate-sauce-bowls-blue-background_114579-45634.jpg", alt: "Client satisfied 2" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/wooden-plate-fresh-chopped-various-vegetables-towel_114579-86390.jpg", alt: "Client satisfied 3" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/lobster-with-parsley-round-white-plate-near-other-dishes_181624-3250.jpg", alt: "Client satisfied 4" },
|
||||
{ src: "http://img.b2bpic.net/free-photo/people-cheering-with-wine-glasses-luxurious-restaurant_23-2150517422.jpg", alt: "Client satisfied 5" },
|
||||
]}
|
||||
avatarText="Plus de 1000 gourmets convaincus"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="about" data-section="about">
|
||||
<SplitAbout
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
title="La fraîcheur en direct"
|
||||
description="Chez El Kahina, nous privilégions l'authenticité. De notre aquarium de langoustes à votre assiette, vivez une expérience marine inégalée où la qualité est une promesse."
|
||||
bulletPoints={[
|
||||
{
|
||||
title: "Arrivage Quotidien",
|
||||
description: "Sélection rigoureuse des meilleurs produits de la mer.",
|
||||
},
|
||||
{
|
||||
title: "Choix Personnalisé",
|
||||
description: "Sélectionnez votre pièce et le mode de cuisson idéal.",
|
||||
},
|
||||
{
|
||||
title: "Atmosphère Marine",
|
||||
description: "Un cadre raffiné et convivial face à la mer.",
|
||||
},
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/panoramic-view-fish-stall-market-sanarysurmer_268835-3784.jpg"
|
||||
/>
|
||||
</div>
|
||||
<div id="about" data-section="about">
|
||||
<SplitAbout
|
||||
textboxLayout="split"
|
||||
useInvertedBackground={false}
|
||||
title="La fraîcheur en direct"
|
||||
description="Chez El Kahina, nous privilégions l'authenticité. De notre aquarium de langoustes à votre assiette, vivez une expérience marine inégalée où la qualité est une promesse."
|
||||
bulletPoints={[
|
||||
{ title: "Arrivage Quotidien", description: "Sélection rigoureuse des meilleurs produits de la mer.", icon: CheckCircle },
|
||||
{ title: "Choix Personnalisé", description: "Sélectionnez votre pièce et le mode de cuisson idéal.", icon: CheckCircle },
|
||||
{ title: "Atmosphère Marine", description: "Un cadre raffiné et convivial face à la mer.", icon: CheckCircle },
|
||||
]}
|
||||
imageSrc="http://img.b2bpic.net/free-photo/panoramic-view-fish-stall-market-sanarysurmer_268835-3784.jpg"
|
||||
mediaAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="feature" data-section="feature">
|
||||
<FeatureCardTen
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
title: "Poisson Frais",
|
||||
description: "Un large choix sélectionné chaque matin.",
|
||||
media: {
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/person-squeezing-lemon-soup-black-bowl-with-dark-wall_181624-4772.jpg",
|
||||
},
|
||||
items: [
|
||||
{
|
||||
text: "Espadon",
|
||||
icon: CheckCircle,
|
||||
},
|
||||
{
|
||||
text: "Mérou",
|
||||
icon: CheckCircle,
|
||||
},
|
||||
],
|
||||
reverse: false,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/close-up-view-asian-dish_23-2147681089.jpg?_wi=2",
|
||||
imageAlt: "fresh grilled prawns plating",
|
||||
},
|
||||
]}
|
||||
title="Nos spécialités culinaires"
|
||||
description="Chaque plat est une célébration de saveurs marines."
|
||||
/>
|
||||
</div>
|
||||
<div id="feature" data-section="feature">
|
||||
<FeatureCardTen
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
features={[
|
||||
{
|
||||
title: "Poisson Frais", description: "Un large choix sélectionné chaque matin.", media: { imageSrc: "http://img.b2bpic.net/free-photo/person-squeezing-lemon-soup-black-bowl-with-dark-wall_181624-4772.jpg", imageAlt: "fresh grilled prawns plating" },
|
||||
items: [
|
||||
{ text: "Espadon", icon: CheckCircle },
|
||||
{ text: "Mérou", icon: CheckCircle },
|
||||
],
|
||||
reverse: false,
|
||||
},
|
||||
]}
|
||||
title="Nos spécialités culinaires"
|
||||
description="Chaque plat est une célébration de saveurs marines."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardOne
|
||||
animationType="depth-3d"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{
|
||||
id: "1",
|
||||
value: "897+",
|
||||
title: "Avis Clients",
|
||||
description: "Notes excellentes et retours positifs.",
|
||||
icon: Star,
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
value: "4.3",
|
||||
title: "Note Moyenne",
|
||||
description: "Une satisfaction marine confirmée.",
|
||||
icon: Award,
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
value: "100%",
|
||||
title: "Fraîcheur",
|
||||
description: "Produits du jour, pêche locale.",
|
||||
icon: Waves,
|
||||
},
|
||||
]}
|
||||
title="Notre engagement en chiffres"
|
||||
description="Des milliers de clients satisfaits par notre exigence marine."
|
||||
/>
|
||||
</div>
|
||||
<div id="metrics" data-section="metrics">
|
||||
<MetricCardOne
|
||||
animationType="depth-3d"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
metrics={[
|
||||
{ id: "1", value: "897+", title: "Avis Clients", description: "Notes excellentes et retours positifs.", icon: Star },
|
||||
{ id: "2", value: "4.3", title: "Note Moyenne", description: "Une satisfaction marine confirmée.", icon: Award },
|
||||
{ id: "3", value: "100%", title: "Fraîcheur", description: "Produits du jour, pêche locale.", icon: Waves },
|
||||
]}
|
||||
title="Notre engagement en chiffres"
|
||||
description="Des milliers de clients satisfaits par notre exigence marine."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardThirteen
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Yazan",
|
||||
handle: "@yazan_guide",
|
||||
testimonial: "Superbe spot de fruits de mer.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/couple-having-date-together-luxurious-restaurant_23-2150517424.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Rabah Chebout",
|
||||
handle: "@rabah_guide",
|
||||
testimonial: "Expérience raffinée au bord de la mer.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/waitress-arranging-oyster-plate_23-2147830604.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "jr t",
|
||||
handle: "@jrt_guide",
|
||||
testimonial: "Endroit agréable, service irréprochable.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/arrangement-with-frozen-sea-food-table_23-2148969382.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Amira M.",
|
||||
handle: "@amira_foodie",
|
||||
testimonial: "Fraîcheur incroyable.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/group-friends-having-lunch-together-restaurant_23-2150520109.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Karim B.",
|
||||
handle: "@karim_cuisine",
|
||||
testimonial: "Cadre magnifique et cuisine savoureuse.",
|
||||
rating: 5,
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/friends-eating-conversating-restaurant_23-2148006712.jpg",
|
||||
},
|
||||
]}
|
||||
showRating={true}
|
||||
title="Ce que disent nos clients"
|
||||
description="Le partage de nos convives sur leur expérience marine chez nous."
|
||||
/>
|
||||
</div>
|
||||
<div id="testimonials" data-section="testimonials">
|
||||
<TestimonialCardThirteen
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
testimonials={[
|
||||
{ id: "1", name: "Yazan", handle: "@yazan_guide", testimonial: "Superbe spot de fruits de mer.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/couple-having-date-together-luxurious-restaurant_23-2150517424.jpg" },
|
||||
{ id: "2", name: "Rabah Chebout", handle: "@rabah_guide", testimonial: "Expérience raffinée au bord de la mer.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/waitress-arranging-oyster-plate_23-2147830604.jpg" },
|
||||
{ id: "3", name: "jr t", handle: "@jrt_guide", testimonial: "Endroit agréable, service irréprochable.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/arrangement-with-frozen-sea-food-table_23-2148969382.jpg" },
|
||||
{ id: "4", name: "Amira M.", handle: "@amira_foodie", testimonial: "Fraîcheur incroyable.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/group-friends-having-lunch-together-restaurant_23-2150520109.jpg" },
|
||||
{ id: "5", name: "Karim B.", handle: "@karim_cuisine", testimonial: "Cadre magnifique et cuisine savoureuse.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/friends-eating-conversating-restaurant_23-2148006712.jpg" },
|
||||
]}
|
||||
showRating={true}
|
||||
title="Ce que disent nos clients"
|
||||
description="Le partage de nos convives sur leur expérience marine chez nous."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="menu" data-section="menu">
|
||||
<ProductCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{
|
||||
id: "1",
|
||||
name: "Merlon",
|
||||
price: "Prix selon arrivage",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/tuna-meat-steak_1203-8961.jpg",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
name: "Crevettes Grillées",
|
||||
price: "Excellent",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/seafood-soup-wooden-table_123827-27601.jpg",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
name: "Soupe de Poisson",
|
||||
price: "Signature",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/top-view-grilled-steak-with-zucchini-bell-pepper-tomato-mushrooms-sauce-salt-black-pepper-board_141793-3814.jpg",
|
||||
},
|
||||
{
|
||||
id: "4",
|
||||
name: "Calamar Frit",
|
||||
price: "Classique",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/front-close-view-boiled-fish-buckwheat-meal-served-with-vegetables-green-white-plate-nude-towel-wooden-cutting-board-ice-surface_179666-42519.jpg",
|
||||
},
|
||||
{
|
||||
id: "5",
|
||||
name: "Crevettes Sauce Hollandaise",
|
||||
price: "Raffiné",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/salmon-with-sushi_1203-697.jpg",
|
||||
},
|
||||
{
|
||||
id: "6",
|
||||
name: "Espadon Grillé",
|
||||
price: "Grillé",
|
||||
imageSrc: "http://img.b2bpic.net/free-photo/fresh-raw-seafoods-spices_1398-3685.jpg",
|
||||
},
|
||||
]}
|
||||
title="Notre Menu"
|
||||
description="Découvrez une sélection de plats savoureux."
|
||||
/>
|
||||
</div>
|
||||
<div id="menu" data-section="menu">
|
||||
<ProductCardThree
|
||||
animationType="slide-up"
|
||||
textboxLayout="default"
|
||||
gridVariant="uniform-all-items-equal"
|
||||
useInvertedBackground={false}
|
||||
products={[
|
||||
{ id: "1", name: "Merlon", price: "Prix selon arrivage", imageSrc: "http://img.b2bpic.net/free-photo/tuna-meat-steak_1203-8961.jpg" },
|
||||
{ id: "2", name: "Crevettes Grillées", price: "Excellent", imageSrc: "http://img.b2bpic.net/free-photo/seafood-soup-wooden-table_123827-27601.jpg" },
|
||||
{ id: "3", name: "Soupe de Poisson", price: "Signature", imageSrc: "http://img.b2bpic.net/free-photo/top-view-grilled-steak-with-zucchini-bell-pepper-tomato-mushrooms-sauce-salt-black-pepper-board_141793-3814.jpg" },
|
||||
{ id: "4", name: "Calamar Frit", price: "Classique", imageSrc: "http://img.b2bpic.net/free-photo/front-close-view-boiled-fish-buckwheat-meal-served-with-vegetables-green-white-plate-nude-towel-wooden-cutting-board-ice-surface_179666-42519.jpg" },
|
||||
{ id: "5", name: "Crevettes Sauce Hollandaise", price: "Raffiné", imageSrc: "http://img.b2bpic.net/free-photo/salmon-with-sushi_1203-697.jpg" },
|
||||
{ id: "6", name: "Espadon Grillé", price: "Grillé", imageSrc: "http://img.b2bpic.net/free-photo/fresh-raw-seafoods-spices_1398-3685.jpg" },
|
||||
]}
|
||||
title="Notre Menu"
|
||||
description="Découvrez une sélection de plats savoureux."
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqDouble
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{
|
||||
id: "1",
|
||||
title: "Quels sont vos horaires ?",
|
||||
content: "Nous sommes ouverts tous les jours jusqu'à 23h.",
|
||||
},
|
||||
{
|
||||
id: "2",
|
||||
title: "Est-ce qu'il y a un parking ?",
|
||||
content: "Oui, nous vous conseillons d'arriver tôt.",
|
||||
},
|
||||
{
|
||||
id: "3",
|
||||
title: "Peut-on réserver ?",
|
||||
content: "Oui, contactez-nous par téléphone.",
|
||||
},
|
||||
]}
|
||||
title="Questions Fréquentes"
|
||||
description="Tout ce que vous devez savoir avant votre visite."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
<div id="faq" data-section="faq">
|
||||
<FaqDouble
|
||||
textboxLayout="default"
|
||||
useInvertedBackground={true}
|
||||
faqs={[
|
||||
{ id: "1", title: "Quels sont vos horaires ?", content: "Nous sommes ouverts tous les jours jusqu'à 23h." },
|
||||
{ id: "2", title: "Est-ce qu'il y a un parking ?", content: "Oui, nous vous conseillons d'arriver tôt." },
|
||||
{ id: "3", title: "Peut-on réserver ?", content: "Oui, contactez-nous par téléphone." },
|
||||
]}
|
||||
title="Questions Fréquentes"
|
||||
description="Tout ce que vous devez savoir avant votre visite."
|
||||
faqsAnimation="slide-up"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={false}
|
||||
background={{
|
||||
variant: "canvas-reveal",
|
||||
}}
|
||||
text="Réservez votre table dès maintenant pour une expérience marine inoubliable."
|
||||
buttons={[
|
||||
{
|
||||
text: "+213 551 15 18 66",
|
||||
href: "tel:+213551151866",
|
||||
},
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
<div id="contact" data-section="contact">
|
||||
<ContactText
|
||||
useInvertedBackground={false}
|
||||
background={{ variant: "canvas-reveal" }}
|
||||
text="Réservez votre table dès maintenant pour une expérience marine inoubliable."
|
||||
buttons={[
|
||||
{ text: "+213 551 15 18 66", href: "tel:+213551151866" },
|
||||
]}
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBase
|
||||
columns={[
|
||||
{
|
||||
title: "Navigation",
|
||||
items: [
|
||||
{
|
||||
label: "Accueil",
|
||||
href: "#hero",
|
||||
},
|
||||
{
|
||||
label: "Menu",
|
||||
href: "#menu",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Contact",
|
||||
items: [
|
||||
{
|
||||
label: "02 rue des Dunes, Aïn Bénian",
|
||||
href: "#",
|
||||
},
|
||||
{
|
||||
label: "+213 551 15 18 66",
|
||||
href: "tel:+213551151866",
|
||||
},
|
||||
],
|
||||
},
|
||||
]}
|
||||
logoText="El Kahina"
|
||||
/>
|
||||
</div>
|
||||
<div id="footer" data-section="footer">
|
||||
<FooterBase
|
||||
columns={[
|
||||
{
|
||||
title: "Navigation", items: [
|
||||
{ label: "Accueil", href: "#hero" },
|
||||
{ label: "Menu", href: "#menu" },
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Contact", items: [
|
||||
{ label: "02 rue des Dunes, Aïn Bénian", href: "#" },
|
||||
{ label: "+213 551 15 18 66", href: "tel:+213551151866" },
|
||||
],
|
||||
},
|
||||
]}
|
||||
logoText="El Kahina"
|
||||
/>
|
||||
</div>
|
||||
</ReactLenis>
|
||||
</ThemeProvider>
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user