catering page new strucure updated

This commit is contained in:
akash 2025-11-29 18:24:11 +05:30
parent d3d40cdac8
commit 6a73c43f40
27 changed files with 1793 additions and 30 deletions

Binary file not shown.

After

Width:  |  Height:  |  Size: 287 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 198 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 361 KiB

View File

@ -1 +1 @@
<?xml version="1.0" encoding="UTF-8"?><urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9" xmlns:news="http://www.google.com/schemas/sitemap-news/0.9" xmlns:xhtml="http://www.w3.org/1999/xhtml" xmlns:image="http://www.google.com/schemas/sitemap-image/1.1" xmlns:video="http://www.google.com/schemas/sitemap-video/1.1"><url><loc>http://localhost:3000/</loc><changefreq>daily</changefreq><priority>1.0</priority></url><url><loc>http://localhost:3000/about-us/</loc><changefreq>monthly</changefreq><priority>0.5</priority></url><url><loc>http://localhost:3000/menu/</loc><changefreq>weekly</changefreq><priority>0.6</priority></url><url><loc>http://localhost:3000/gallery/</loc><changefreq>weekly</changefreq><priority>0.6</priority></url><url><loc>http://localhost:3000/contact/</loc><changefreq>weekly</changefreq><priority>0.6</priority></url><url><loc>http://localhost:3000/blog/</loc><changefreq>weekly</changefreq><priority>0.6</priority></url><url><loc>http://localhost:3000/blog/the-art-of-turkish-tea/</loc><changefreq>weekly</changefreq><priority>0.6</priority></url><url><loc>http://localhost:3000/blog/secrets-of-charcoal-grilling/</loc><changefreq>weekly</changefreq><priority>0.6</priority></url><url><loc>http://localhost:3000/blog/a-taste-of-sweet-legacy/</loc><changefreq>weekly</changefreq><priority>0.6</priority></url></urlset>
<?xml version="1.0" encoding="UTF-8"?><urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9" xmlns:news="http://www.google.com/schemas/sitemap-news/0.9" xmlns:xhtml="http://www.w3.org/1999/xhtml" xmlns:image="http://www.google.com/schemas/sitemap-image/1.1" xmlns:video="http://www.google.com/schemas/sitemap-video/1.1"><url><loc>https://antalya.metatronnest.com/</loc><changefreq>daily</changefreq><priority>1.0</priority></url><url><loc>https://antalya.metatronnest.com/about-us/</loc><changefreq>monthly</changefreq><priority>0.5</priority></url><url><loc>https://antalya.metatronnest.com/menu/</loc><changefreq>weekly</changefreq><priority>0.6</priority></url><url><loc>https://antalya.metatronnest.com/gallery/</loc><changefreq>weekly</changefreq><priority>0.6</priority></url><url><loc>https://antalya.metatronnest.com/catering/</loc><changefreq>weekly</changefreq><priority>0.6</priority></url><url><loc>https://antalya.metatronnest.com/contact/</loc><changefreq>weekly</changefreq><priority>0.6</priority></url><url><loc>https://antalya.metatronnest.com/blog/</loc><changefreq>weekly</changefreq><priority>0.6</priority></url><url><loc>https://antalya.metatronnest.com/blog/the-art-of-turkish-tea/</loc><changefreq>weekly</changefreq><priority>0.6</priority></url><url><loc>https://antalya.metatronnest.com/blog/secrets-of-charcoal-grilling/</loc><changefreq>weekly</changefreq><priority>0.6</priority></url><url><loc>https://antalya.metatronnest.com/blog/a-taste-of-sweet-legacy/</loc><changefreq>weekly</changefreq><priority>0.6</priority></url></urlset>

View File

@ -30,6 +30,7 @@ const staticLinks = [
{ url: '/about-us/', changefreq: 'monthly', priority: 0.5 },
{ url: '/menu/', changefreq: 'weekly', priority: 0.6 },
{ url: '/gallery/', changefreq: 'weekly', priority: 0.6 },
{ url: '/catering/', changefreq: 'weekly', priority: 0.6 },
{ url: '/contact/', changefreq: 'weekly', priority: 0.6 },
{ url: '/blog/', changefreq: 'weekly', priority: 0.6 },
];

View File

@ -257,6 +257,7 @@ export default function AboutContent() {
</AnimatePresence>
<button className={styles.sliderBtn} onClick={nextTestimonial}></button>
</motion.div>
{/* Slider dots */}
@ -269,6 +270,17 @@ export default function AboutContent() {
/>
))}
</div>
<div className={styles.buttonContainer}>
<a
href="https://www.google.com/search?q=antalya+restaurant"
target="_blank"
rel="noopener noreferrer"
className={styles.button}
>
Review Us on Google
</a>
</div>
</section>
{/* FAQ Section - Image Left, FAQ Right */}

View File

@ -35,7 +35,7 @@
}
.breadcrumb a {
color: #fff;
color: #d3cab3;
transition: color 0.3s;
}
@ -323,6 +323,30 @@
background-color: #c49c5c;
}
.buttonContainer {
display: flex;
justify-content: center;
}
.button {
display: inline-block;
margin-top: 3rem;
padding: 0.8rem 2rem;
border: 1px solid var(--color-gold);
color: #d3cab3;
font-family: var(--font-lato);
text-transform: uppercase;
text-decoration: none;
transition: all 0.3s ease;
background: transparent;
cursor: pointer;
}
.button:hover {
background-color: var(--color-gold);
color: #d3cab3;
}
/* Call to Action Section */
.ctaSection {
padding: 80px 20px;

View File

@ -35,7 +35,7 @@
}
.breadcrumb a {
color: #fff;
color: #d3cab3;
transition: color 0.3s;
}

View File

@ -32,7 +32,7 @@
}
.breadcrumb a {
color: #fff;
color: #d3cab3;
transition: color 0.3s;
}
@ -245,7 +245,7 @@
.backButton:hover {
background: #c49c5c;
color: #fff;
color: #d3cab3;
}
.errorContainer {

View File

@ -34,7 +34,7 @@
}
.breadcrumb a {
color: #fff;
color: #d3cab3;
transition: color 0.3s;
}
@ -162,7 +162,7 @@
.button:hover {
background-color: #c49c5c;
color: #fff;
color: #d3cab3;
}
@media (max-width: 768px) {

View File

@ -0,0 +1,398 @@
'use client'
import { useState } from 'react'
import { motion } from 'framer-motion'
import Navbar from '@/components/Navbar/Navbar'
import Footer from '@/components/Footer/Footer'
import Link from 'next/link'
import Image from 'next/image'
import styles from './catering.module.css'
export default function CateringContent() {
// Animation variants
const fadeInUp = {
hidden: { opacity: 0, y: 30 },
visible: {
opacity: 1,
y: 0,
transition: {
duration: 0.6
}
}
};
const fadeIn = {
hidden: { opacity: 0 },
visible: {
opacity: 1,
transition: { duration: 0.8 }
}
};
const slideInLeft = {
hidden: { opacity: 0, x: -50 },
visible: {
opacity: 1,
x: 0,
transition: {
duration: 0.7
}
}
};
const slideInRight = {
hidden: { opacity: 0, x: 50 },
visible: {
opacity: 1,
x: 0,
transition: {
duration: 0.7
}
}
};
const staggerContainer = {
hidden: { opacity: 0 },
visible: {
opacity: 1,
transition: {
staggerChildren: 0.2,
delayChildren: 0.1
}
}
};
const scaleIn = {
hidden: { opacity: 0, scale: 0.8 },
visible: {
opacity: 1,
scale: 1,
transition: {
duration: 0.6
}
}
};
return (
<main className={styles.main}>
<Navbar />
{/* Page Hero */}
<section className={styles.hero}>
<div className={styles.heroContent}>
<h1 className={styles.heroTitle}>Catering Services</h1>
<p className={styles.breadcrumb}>
<Link href="/">Home</Link> / Catering
</p>
</div>
</section>
{/* Section 1: Top 3 Cards - Events, Food & Drinks, Venues */}
<section className={styles.topSection}>
<motion.div
className={styles.topContainer}
initial="hidden"
whileInView="visible"
viewport={{ once: true, margin: "-100px" }}
variants={staggerContainer}
>
<section className={styles.sectionHeading1}>
<div className={styles.smallHeading1} style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', gap: '10px' }}>
<Image src="/images/dinner.png" alt="Antalya Dinner Icon" width={24} height={24} />
<span>ANTALYA</span>
<Image src="/images/eat.png" alt="Antalya Cutlery Icon" width={24} height={24} />
</div>
<h2 className={styles.mainHeading1}>Delicious Turkish, Mezze, And More</h2>
<p className={styles.description1}>
Looking for authentic Turkish dining? At Antalya, we offer a wide variety of traditional dishes, from crispy appetizers to charcoal-grilled kebabs. Whether you're craving mezze platters or hearty main courses, our menu has something for everyone.
</p>
</section>
<div className={styles.topCardsGrid}>
{/* Card 1: Events */}
<motion.div className={styles.topCard} variants={scaleIn}>
<div className={styles.topCardImage}>
<Image
src="/images/hero-1.png"
alt="Events"
fill
style={{ objectFit: 'cover' }}
/>
<div className={styles.topCardOverlay}></div>
</div>
<div className={styles.topCardContent}>
<h3 className={styles.topCardTitle}>Events</h3>
{/* <button className={styles.topCardButton}>
<span></span>
</button> */}
</div>
</motion.div>
{/* Card 2: Food & Drinks */}
<motion.div className={styles.topCard} variants={scaleIn}>
<div className={styles.topCardImage}>
<Image
src="/images/dish-1.png"
alt="Food & Drinks"
fill
style={{ objectFit: 'cover' }}
/>
<div className={styles.topCardOverlay}></div>
</div>
<div className={styles.topCardContent}>
<h3 className={styles.topCardTitle}>Food &<br />Drinks</h3>
{/* <button className={styles.topCardButton}>
<span></span>
</button> */}
</div>
</motion.div>
{/* Card 3: Venues */}
<motion.div className={styles.topCard} variants={scaleIn}>
<div className={styles.topCardImage}>
<Image
src="/images/dish-2.png"
alt="Venues"
fill
style={{ objectFit: 'cover' }}
/>
<div className={styles.topCardOverlay}></div>
</div>
<div className={styles.topCardContent}>
<h3 className={styles.topCardTitle}>Venues</h3>
{/* <button className={styles.topCardButton}>
<span></span>
</button> */}
</div>
</motion.div>
</div>
</motion.div>
</section>
{/* Section 2: Welcome To SeaBreeze */}
<section className={styles.welcomeSection}>
<motion.div
className={styles.welcomeContainer}
initial="hidden"
whileInView="visible"
viewport={{ once: true, margin: "-100px" }}
variants={staggerContainer}
>
{/* Left Side: Images */}
<motion.div className={styles.welcomeImagesWrapper} variants={slideInLeft}>
<div className={styles.welcomeImagesStack}>
<div className={styles.welcomeImageTop}>
<Image
src="/images/hero-1.png"
alt="Gourmet dish"
fill
style={{ objectFit: 'cover' }}
/>
</div>
<div className={styles.welcomeImageBottom}>
<Image
src="/images/dish-1.png"
alt="Delicious burger"
fill
style={{ objectFit: 'cover' }}
/>
</div>
</div>
</motion.div>
{/* Right Side: Content */}
<motion.div className={styles.welcomeContent} variants={slideInRight}>
<div className={styles.smallHeading} style={{ display: 'flex', alignItems: 'center', justifyContent: 'start', gap: '10px' }}>
<Image src="/images/dinner.png" alt="Antalya Dinner Icon" width={24} height={24} />
<span>ANTALYA</span>
<Image src="/images/eat.png" alt="Antalya Cutlery Icon" width={24} height={24} />
</div>
<h2 className={styles.mainHeadingSection}>A Visual Journey Through</h2>
<div className={styles.welcomeDivider}>
<svg width="120" height="20" viewBox="0 0 120 20" fill="none" xmlns="http://www.w3.org/2000/svg">
<line x1="0" y1="10" x2="45" y2="10" stroke="#d3cab3" strokeWidth="2" />
<path d="M52 5 Q60 10 52 15 M55 5 Q63 10 55 15 M58 5 Q66 10 58 15" stroke="#d3cab3" strokeWidth="1.5" fill="none" />
<line x1="75" y1="10" x2="120" y2="10" stroke="#d3cab3" strokeWidth="2" />
</svg>
</div>
<p className={styles.welcomeDescription}>
Seabreeze was the first restaurant to open in Egypt, the restaurant was designed with the history in mind of it. We have created a soft industrial dining room, combined with an open kitchen, coffee take out bar and a lovely on site coffee roastery.
</p>
</motion.div>
</motion.div>
</section>
{/* Section 3: Serving Great-Tasting Food Since 1991 */}
<section className={styles.servingSection}>
<motion.div
className={styles.servingContainer}
initial="hidden"
whileInView="visible"
viewport={{ once: true, margin: "-100px" }}
variants={staggerContainer}
>
{/* Left Side: Content */}
<motion.div className={styles.servingContent} variants={slideInLeft}>
<section className={styles.sectionHeading3}>
<div className={styles.smallHeading3} style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', gap: '10px' }}>
<Image src="/images/dinner.png" alt="Antalya Dinner Icon" width={24} height={24} />
<span>ANTALYA</span>
<Image src="/images/eat.png" alt="Antalya Cutlery Icon" width={24} height={24} />
</div>
</section>
<h2 className={styles.mainHeading}>A Visual Journey Through Authentic Turkish</h2>
<p className={styles.servingDescription}>
Lorem ipsum dolor sit amet consectetur adipisicing elit auctor. Facilisi praesent inceptos turpibur erat cubilia himenaeos nascetur. Habitant tempus elementum pharetra rutrum gravida. Nunc sapien mi libero ultrices sem ultrices egestas diam semean. Tempor pellentesque lobortis mi cuam dignissibus preium.
</p>
<p className={styles.servingDescription}>
Cras ultrices ligula sed magna dictum porta. Sed portitor lecta nibh. Donec rutrum congue leo eget malesuada.
</p>
</motion.div>
{/* Right Side: Images */}
<motion.div className={styles.servingImagesWrapper} variants={slideInRight}>
<div className={styles.servingImagesGrid}>
<div className={styles.servingImageLarge}>
<Image
src="/images/hero-2.png"
alt="Restaurant interior"
fill
style={{ objectFit: 'cover' }}
/>
</div>
<div className={styles.servingImageSmallTop}>
<Image
src="/images/dish-1.png"
alt="Grilled steak"
fill
style={{ objectFit: 'cover' }}
/>
</div>
<div className={styles.servingImageSmallBottom}>
<Image
src="/images/dish-1.png"
alt="Delicious dish"
fill
style={{ objectFit: 'cover' }}
/>
</div>
</div>
</motion.div>
</motion.div>
</section>
{/* Section 4: Our Story of Success */}
<section className={styles.storySection}>
<motion.div
className={styles.storyContent}
initial="hidden"
whileInView="visible"
viewport={{ once: true, margin: "-100px" }}
variants={fadeIn}
>
<motion.span className={styles.storyLabel} variants={fadeInUp}>
<div className={styles.smallHeading3} style={{ display: 'flex', alignItems: 'center', justifyContent: 'center', gap: '10px' }}>
<Image src="/images/dinner.png" alt="Antalya Dinner Icon" width={24} height={24} />
<span>ANTALYA</span>
<Image src="/images/eat.png" alt="Antalya Cutlery Icon" width={24} height={24} />
</div>
</motion.span>
<motion.h2 className={styles.storyTitle} variants={fadeInUp}>
Click now to make your event unforgettable and place your order.
</motion.h2>
<motion.a
href="tel:+15195882037"
className={styles.storydesc}
variants={fadeInUp}
style={{ display: "inline-block" }}
>
+1 519 588 2037
</motion.a>
{/* <motion.button className={styles.storyButton} variants={fadeInUp}>
<span className={styles.storyButtonIcon}></span>
<span>Visit site</span>
</motion.button> */}
</motion.div>
</section>
{/* Section 4: About Us - Restika One Of The Best Food Service */}
<section className={styles.aboutSection}>
<motion.div
className={styles.aboutContainer}
initial="hidden"
whileInView="visible"
viewport={{ once: true, margin: "-100px" }}
variants={staggerContainer}
>
{/* Left Side: Images */}
<motion.div className={styles.aboutImagesWrapper} variants={slideInLeft}>
<div className={styles.aboutImagesGrid}>
<div className={styles.aboutImageLarge}>
<Image
src="/images/hero-1.png"
alt="Food service"
fill
style={{ objectFit: 'cover' }}
/>
</div>
<div className={styles.aboutImageSmallTop}>
<Image
src="/images/dish-2.png"
alt="Dining experience"
fill
style={{ objectFit: 'cover' }}
/>
</div>
<div className={styles.aboutImageSmallBottom}>
<Image
src="/images/dish-1.png"
alt="Special dishes"
fill
style={{ objectFit: 'cover' }}
/>
</div>
</div>
</motion.div>
{/* Right Side: Content */}
<motion.div className={styles.aboutContent} variants={slideInRight}>
<div className={styles.smallHeading} style={{ display: 'flex', alignItems: 'center', justifyContent: 'start', gap: '10px' }}>
<Image src="/images/dinner.png" alt="Antalya Dinner Icon" width={24} height={24} />
<span>ANTALYA</span>
<Image src="/images/eat.png" alt="Antalya Cutlery Icon" width={24} height={24} />
</div>
<h2 className={styles.mainHeading}>
Restika One Of The Best<br />
Food Service
</h2>
<p className={styles.servingDescription}>
There are many majority have suffered alteration in have suffered alteration majority have in some form, humour or randomised words.
</p>
<div className={styles.aboutSpecials}>
<ul className={styles.aboutSpecialsList}>
<li className={styles.aboutSpecialsItem}>
<span className={styles.aboutSpecialsIcon}></span>
<span>Turmeric coconut rice, chicken sate with peanut sauce</span>
</li>
<li className={styles.aboutSpecialsItem}>
<span className={styles.aboutSpecialsIcon}></span>
<span>Indonesian Fried Rice. Choice of Chicken, Beef Steak</span>
</li>
<li className={styles.aboutSpecialsItem}>
<span className={styles.aboutSpecialsIcon}></span>
<span>Wok-fry thin rice noodle. Rice noodle, chicken</span>
</li>
</ul>
</div>
<Link href="/menu" className={styles.lastButton}>
View Our Menu
</Link>
</motion.div>
</motion.div>
</section>
<Footer />
</main>
)
}

File diff suppressed because it is too large Load Diff

11
src/app/catering/page.tsx Normal file
View File

@ -0,0 +1,11 @@
import { Metadata } from "next";
import CateringContent from "./CateringContent";
export const metadata: Metadata = {
title: "Catering Services | Antalya Restaurant",
description: "Discover our exceptional catering services featuring authentic Turkish cuisine. Perfect for events, parties, and special occasions.",
};
export default function CateringPage() {
return <CateringContent />;
}

View File

@ -33,7 +33,7 @@
}
.breadcrumb a {
color: #fff;
color: #d3cab3;
transition: color 0.3s;
}
@ -153,7 +153,7 @@
.submitButton {
background: #c49c5c;
border: none;
color: #fff;
color: #d3cab3;
padding: 15px 40px;
font-size: var(--body-size);
font-weight: 600;

View File

@ -34,7 +34,7 @@
}
.breadcrumb a {
color: #fff;
color: #d3cab3;
transition: color 0.3s;
}
@ -206,7 +206,7 @@
}
.closeBtn:hover {
color: #fff;
color: #d3cab3;
}
.navBtn {
@ -225,7 +225,7 @@
.navBtn:hover {
background: rgba(197, 160, 89, 0.5);
color: #fff;
color: #d3cab3;
}
.prevBtn {

View File

@ -35,7 +35,7 @@
}
.breadcrumb a {
color: #fff;
color: #d3cab3;
transition: color 0.3s;
text-decoration: none;
}

View File

@ -103,7 +103,7 @@
.button:hover {
background-color: #c49c5c;
color: #fff;
color: #d3cab3;
}
.arrow {
@ -139,7 +139,7 @@
display: inline-block;
padding: 15px 40px;
border: 1px solid #c49c5c;
color: #fff;
color: #d3cab3;
font-family: var(--font-inter), sans-serif;
text-transform: uppercase;
font-size: 1rem;

View File

@ -108,7 +108,7 @@
.submitButton {
background: transparent;
border: 1px solid #c49c5c;
color: var(--color-text-light);
color: #d3cab3;
padding: 0.8rem 2rem;
font-family: var(--font-lato);
font-size: 1rem;
@ -121,7 +121,7 @@
.submitButton:hover {
background-color: #c49c5c;
color: #fff;
color: #d3cab3;
}
.successMessage {

View File

@ -84,7 +84,7 @@
}
.icon:hover {
background-color: #fff;
background-color: #d3cab3;
transform: translateY(-3px);
}
@ -122,7 +122,7 @@
}
.link:hover {
color: #fff;
color: #d3cab3;
}
/* Location Column */
@ -164,7 +164,7 @@
.contactRow a:hover {
color: #fff;
color: #d3cab3;
}
.phoneIcon,

View File

@ -72,7 +72,7 @@
margin-top: 3rem;
padding: 0.8rem 2rem;
border: 1px solid var(--color-gold);
color: #fff;
color: #d3cab3;
font-family: var(--font-lato);
text-transform: uppercase;
text-decoration: none;
@ -83,7 +83,7 @@
.button:hover {
background-color: var(--color-gold);
color: #fff;
color: #d3cab3;
}
/* Lightbox */
@ -113,7 +113,7 @@
right: 0;
background: none;
border: none;
color: #fff;
color: #d3cab3;
font-size: 2rem;
cursor: pointer;
}

View File

@ -29,7 +29,7 @@
.logoText {
font-family: var(--font-playfair);
font-size: 1.5rem;
color: #fff;
color: #d3cab3;
letter-spacing: 1px;
}

View File

@ -90,7 +90,7 @@
.btnPrimary {
background-color: var(--color-gold);
color: #fff;
color: #d3cab3;
border: 1px solid var(--color-gold);
border-radius: 10px;
}
@ -102,14 +102,14 @@
.btnSecondary {
background-color: transparent;
color: #fff;
color: #d3cab3;
border: 3px solid #b28839;
border-radius: 10px;
}
.btnSecondary:hover {
background-color: var(--color-gold);
color: #fff;
color: #d3cab3;
}
.dots {

View File

@ -51,7 +51,7 @@
.tab {
background: transparent;
border: 2px solid #b07c4b;
color: #fff;
color: #d3cab3;
padding: 12px 25px;
font-size: 1rem;
cursor: pointer;

View File

@ -10,6 +10,7 @@ const navLinks = [
{ name: 'About', href: '/about-us' },
{ name: 'Gallery', href: '/gallery' },
{ name: 'Menu', href: '/menu' },
{ name: 'Catering', href: '/catering' },
{ name: 'Blog', href: '/blog' },
{ name: 'Contact', href: '/contact' },
]

View File

@ -97,7 +97,7 @@
.button:hover {
background-color: #c49c5c;
color: #fff;
color: #d3cab3;
}
.viewMoreContainer {
@ -108,7 +108,7 @@
display: inline-block;
padding: 15px 40px;
border: 1px solid #c49c5c;
color: #fff;
color: #d3cab3;
font-family: var(--font-inter), sans-serif;
text-transform: uppercase;
font-size: 1rem;

View File

@ -168,6 +168,25 @@
z-index: 5;
}
.button {
display: inline-block;
margin-top: 3rem;
padding: 0.8rem 2rem;
border: 1px solid var(--color-gold);
color: #d3cab3;
font-family: var(--font-lato);
text-transform: uppercase;
text-decoration: none;
transition: all 0.3s ease;
background: transparent;
cursor: pointer;
}
.button:hover {
background-color: var(--color-gold);
color: #d3cab3;
}
/* Responsive adjustments for different viewport sizes */
@media (max-width: 1400px) {
.sliderContainer {

View File

@ -117,6 +117,17 @@ export default function Testimonials() {
<button className={`${styles.arrow} ${styles.nextArrow}`} onClick={nextSlide}></button>
</div>
<div className={styles.buttonContainer}>
<a
href="https://www.google.com/search?q=antalya+restaurant"
target="_blank"
rel="noopener noreferrer"
className={styles.button}
>
Review Us on Google
</a>
</div>
</section>
)
}