59
.github/workflows/main.yml
vendored
Normal file
@ -0,0 +1,59 @@
|
||||
name: Build and Deploy Build Output
|
||||
|
||||
on:
|
||||
push:
|
||||
branches: [ main ]
|
||||
pull_request:
|
||||
branches: [ main ]
|
||||
|
||||
jobs:
|
||||
build:
|
||||
runs-on: ubuntu-latest
|
||||
|
||||
steps:
|
||||
- name: Checkout repository
|
||||
uses: actions/checkout@v3
|
||||
|
||||
- name: Setup Node.js
|
||||
uses: actions/setup-node@v3
|
||||
with:
|
||||
node-version: '18.17.0'
|
||||
|
||||
- name: Install dependencies
|
||||
run: npm install
|
||||
|
||||
- name: Build Next.js project
|
||||
run: npm run build
|
||||
|
||||
# Optional: List build directories to verify output exists
|
||||
- name: List build directories
|
||||
run: ls -la
|
||||
|
||||
- name: Deploy build output to build-output branch
|
||||
env:
|
||||
# The GITHUB_TOKEN is automatically provided by GitHub Actions.
|
||||
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
|
||||
run: |
|
||||
# Configure git
|
||||
git config --global user.name "GitHub Actions"
|
||||
git config --global user.email "actions@github.com"
|
||||
|
||||
# Create a temporary directory for the output
|
||||
mkdir deploy
|
||||
# Copy the build outputs (update the paths if needed)
|
||||
cp -r out deploy/
|
||||
cp -r .next deploy/ 2>/dev/null || echo ".next folder not found, skipping."
|
||||
|
||||
# Move into the deploy directory
|
||||
cd deploy
|
||||
|
||||
# Initialize a new git repo
|
||||
git init
|
||||
git checkout -b build-output
|
||||
|
||||
# Add all files and commit them
|
||||
git add .
|
||||
git commit -m "Deploy build output for commit ${GITHUB_SHA}"
|
||||
|
||||
# Force push to the remote build-output branch
|
||||
git push --force "https://x-access-token:${GITHUB_TOKEN}@github.com/${{ github.repository }}.git" build-output
|
||||
BIN
.gitignore
vendored
Normal file
437
app/about/page.js
Normal file
@ -0,0 +1,437 @@
|
||||
import { AboutUs3 } from "@/components/AboutUs";
|
||||
import BookTableForm from "@/components/BookTableForm";
|
||||
import FoodCategory from "@/components/FoodCategory";
|
||||
import Headline from "@/components/Headline";
|
||||
import PageBanner from "@/components/PageBanner";
|
||||
import { TestimonialSlider2 } from "@/components/TestimonialSlider";
|
||||
import WellFoodLayout from "@/layout/WellFoodLayout";
|
||||
import AboutContent from "@/components/About/AboutContent";
|
||||
import AboutCategory from "@/components/About/AboutCategory";
|
||||
import Link from "next/link";
|
||||
import AboutCallAction from "@/components/About/AboutCallAction";
|
||||
import AboutContent2 from "@/components/About/AboutContent2";
|
||||
import AboutCallAction2 from "@/components/About/AboutCallAction2";
|
||||
import AboutTestimonial from "@/components/About/AboutTestimonial";
|
||||
export const metadata = {
|
||||
title: "About Shiva Sakthi | Top Indian Restaurant in Mississauga",
|
||||
description: "Learn about Shiva Sakthi, one of the best Indian restaurants in Mississauga, offering traditional South Indian flavors, and a modern dining experience.",
|
||||
};
|
||||
const page = () => {
|
||||
return (
|
||||
<WellFoodLayout>
|
||||
<PageBanner pageTitle={"About Us"} pageName={"About Us"} background="/assets/images/inner-banner/1.webp"/>
|
||||
<AboutContent />
|
||||
<AboutCategory />
|
||||
<AboutCallAction />
|
||||
<AboutContent2 />
|
||||
<AboutCallAction2 />
|
||||
<AboutTestimonial />
|
||||
|
||||
{/* <AboutUs3 /> */}
|
||||
{/* <Headline /> */}
|
||||
{/* Food Category Area start */}
|
||||
{/* <FoodCategory /> */}
|
||||
{/* Food Category Area end */}
|
||||
{/* Booking Table Area start */}
|
||||
{/* <section
|
||||
className="booking-table-area-two bgs-cover py-100 rel z-1 overlay"
|
||||
style={{
|
||||
backgroundImage:
|
||||
"url(/assets/images/background/booking-table-two.jpg)",
|
||||
}}
|
||||
>
|
||||
<div className="container">
|
||||
<div className="row justify-content-between align-items-center">
|
||||
<div
|
||||
className="col-lg-5"
|
||||
data-aos="fade-left"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<BookTableForm />
|
||||
</div>
|
||||
<div
|
||||
className="col-xl-5 col-lg-6"
|
||||
data-aos="fade-right"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="booking-table-content style-two rmt-55">
|
||||
<a
|
||||
href="https://www.youtube.com/watch?v=9Y7ma241N8k"
|
||||
className="mfp-iframe video-play"
|
||||
>
|
||||
<i className="fas fa-play" />
|
||||
</a>
|
||||
<div className="section-title mt-50 text-white mb-50">
|
||||
<h2>
|
||||
We Offer quality service That Customers Needs for health
|
||||
food
|
||||
</h2>
|
||||
</div>
|
||||
<hr />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section> */}
|
||||
{/* Booking Table Area end */}
|
||||
{/* Chefs Area start */}
|
||||
{/* <section className="chefs-area pt-130 rpt-100 pb-55 rpb-30 rel z-1">
|
||||
<div className="container">
|
||||
<div className="row justify-content-center">
|
||||
<div className="col-xl-7 col-lg-9">
|
||||
<div
|
||||
className="section-title text-center mb-50"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<span className="sub-title mb-5">professional chefs</span>
|
||||
<h2>we have professionals team member meet our expert chefs</h2>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="row justify-content-center">
|
||||
<div className="col-xl-3 col-lg-4 col-sm-6">
|
||||
<div
|
||||
className="chefs-item"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="image">
|
||||
<img src="/assets/images/chefs/chef1.jpg" alt="Chef" />
|
||||
</div>
|
||||
<div className="description">
|
||||
<h5>
|
||||
<Link href="chef-details">Nolan E. Barrera</Link>
|
||||
</h5>
|
||||
<span>Senior Chef</span>
|
||||
<Link href="chef-details" className="more-btn">
|
||||
<i className="far fa-plus" />
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-xl-3 col-lg-4 col-sm-6">
|
||||
<div
|
||||
className="chefs-item"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={50}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="image">
|
||||
<img src="/assets/images/chefs/chef2.jpg" alt="Chef" />
|
||||
</div>
|
||||
<div className="description">
|
||||
<h5>
|
||||
<Link href="chef-details">William B. Nguyen</Link>
|
||||
</h5>
|
||||
<span>Senior Chef</span>
|
||||
<Link href="chef-details" className="more-btn">
|
||||
<i className="far fa-plus" />
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-xl-3 col-lg-4 col-sm-6">
|
||||
<div
|
||||
className="chefs-item"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={100}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="image">
|
||||
<img src="/assets/images/chefs/chef3.jpg" alt="Chef" />
|
||||
</div>
|
||||
<div className="description">
|
||||
<h5>
|
||||
<Link href="chef-details">Michael A. Coulson</Link>
|
||||
</h5>
|
||||
<span>Senior Chef</span>
|
||||
<Link href="chef-details" className="more-btn">
|
||||
<i className="far fa-plus" />
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-xl-3 col-lg-4 col-sm-6">
|
||||
<div
|
||||
className="chefs-item"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={150}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="image">
|
||||
<img src="/assets/images/chefs/chef4.jpg" alt="Chef" />
|
||||
</div>
|
||||
<div className="description">
|
||||
<h5>
|
||||
<Link href="chef-details">Brent M. Powers</Link>
|
||||
</h5>
|
||||
<span>Senior Chef</span>
|
||||
<Link href="chef-details" className="more-btn">
|
||||
<i className="far fa-plus" />
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section> */}
|
||||
{/* Chefs Area end */}
|
||||
{/* Headline area start */}
|
||||
{/* <div className="headline-area mb-105 rmb-85 rel z-1">
|
||||
<span className="marquee-wrap">
|
||||
<span className="marquee-inner left">
|
||||
<span className="marquee-item">Italian pizza</span>
|
||||
<span className="marquee-item">
|
||||
<i className="flaticon-star" />
|
||||
</span>
|
||||
<span className="marquee-item">delicious foods</span>
|
||||
<span className="marquee-item">
|
||||
<i className="flaticon-star" />
|
||||
</span>
|
||||
<span className="marquee-item">burger king</span>
|
||||
<span className="marquee-item">
|
||||
<i className="flaticon-star" />
|
||||
</span>
|
||||
</span>
|
||||
<span className="marquee-inner left">
|
||||
<span className="marquee-item">Italian pizza</span>
|
||||
<span className="marquee-item">
|
||||
<i className="flaticon-star" />
|
||||
</span>
|
||||
<span className="marquee-item">delicious foods</span>
|
||||
<span className="marquee-item">
|
||||
<i className="flaticon-star" />
|
||||
</span>
|
||||
<span className="marquee-item">burger king</span>
|
||||
<span className="marquee-item">
|
||||
<i className="flaticon-star" />
|
||||
</span>
|
||||
</span>
|
||||
<span className="marquee-inner left">
|
||||
<span className="marquee-item">Italian pizza</span>
|
||||
<span className="marquee-item">
|
||||
<i className="flaticon-star" />
|
||||
</span>
|
||||
<span className="marquee-item">delicious foods</span>
|
||||
<span className="marquee-item">
|
||||
<i className="flaticon-star" />
|
||||
</span>
|
||||
<span className="marquee-item">burger king</span>
|
||||
<span className="marquee-item">
|
||||
<i className="flaticon-star" />
|
||||
</span>
|
||||
</span>
|
||||
</span>
|
||||
<div className="headline-shapes">
|
||||
<div className="shape one">
|
||||
<img src="/assets/images/shapes/tomato.png" alt="Shape" />
|
||||
</div>
|
||||
<div className="shape two">
|
||||
<img src="/assets/images/shapes/burger.png" alt="Shape" />
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
{/* Headline Area end */}
|
||||
{/* Features Two area start */}
|
||||
{/* <div className="feature-two-area pb-130 rpb-100">
|
||||
<div className="container-fluid">
|
||||
<div className="row no-gap">
|
||||
<div className="col-xl-4 col-lg-6">
|
||||
<div
|
||||
className="feature-two-image"
|
||||
data-aos="fade-left"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<img src="/assets/images/features/feature1.jpg" alt="Feature" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-xl-4 col-lg-6">
|
||||
<div
|
||||
className="feature-two-content"
|
||||
data-aos="fade-left"
|
||||
data-aos-delay={50}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<h3>Private dining</h3>
|
||||
<p>
|
||||
The duration of a consulting engagement varies depending on
|
||||
the scope and complexity of the project.
|
||||
</p>
|
||||
<ul className="list-style-one pt-5 mb-30">
|
||||
<li>Testy and quality food</li>
|
||||
<li>Fast food delivery</li>
|
||||
<li>Awards winning restuarent</li>
|
||||
</ul>
|
||||
<Link href="shop" className="theme-btn style-two">
|
||||
book now <i className="far fa-arrow-alt-right" />
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-xl-4 col-lg-6 offset-xl-4">
|
||||
<div
|
||||
className="feature-two-image"
|
||||
data-aos="fade-right"
|
||||
data-aos-delay={50}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<img src="/assets/images/features/feature2.jpg" alt="Feature" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-xl-4 col-lg-6">
|
||||
<div
|
||||
className="feature-two-content"
|
||||
data-aos="fade-right"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<h3>The Raw Bar</h3>
|
||||
<p>
|
||||
The duration of a consulting engagement varies depending on
|
||||
the scope and complexity of the project.
|
||||
</p>
|
||||
<ul className="list-style-one pt-5 mb-30">
|
||||
<li>Testy and quality food</li>
|
||||
<li>Fast food delivery</li>
|
||||
<li>Awards winning restuarent</li>
|
||||
</ul>
|
||||
<Link href="shop" className="theme-btn style-two">
|
||||
book now <i className="far fa-arrow-alt-right" />
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-xl-4 col-lg-6">
|
||||
<div
|
||||
className="feature-two-image"
|
||||
data-aos="fade-left"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<img src="/assets/images/features/feature3.jpg" alt="Feature" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-xl-4 col-lg-6">
|
||||
<div
|
||||
className="feature-two-content"
|
||||
data-aos="fade-left"
|
||||
data-aos-delay={50}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<h3>Outdoor catering</h3>
|
||||
<p>
|
||||
The duration of a consulting engagement varies depending on
|
||||
the scope and complexity of the project.
|
||||
</p>
|
||||
<ul className="list-style-one pt-5 mb-30">
|
||||
<li>Testy and quality food</li>
|
||||
<li>Fast food delivery</li>
|
||||
<li>Awards winning restuarent</li>
|
||||
</ul>
|
||||
<Link href="shop" className="theme-btn style-two">
|
||||
book now <i className="far fa-arrow-alt-right" />
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
{/* Features Two area end */}
|
||||
{/* Headline area start */}
|
||||
{/* <div className="headline-area bgc-lighter pt-120 rpt-90 rel z-2">
|
||||
<span className="marquee-wrap">
|
||||
<span className="marquee-inner left">
|
||||
<span className="marquee-item">Italian pizza</span>
|
||||
<span className="marquee-item">
|
||||
<i className="flaticon-star" />
|
||||
</span>
|
||||
<span className="marquee-item">our Testimonials</span>
|
||||
<span className="marquee-item">
|
||||
<i className="flaticon-star" />
|
||||
</span>
|
||||
<span className="marquee-item">burger king</span>
|
||||
<span className="marquee-item">
|
||||
<i className="flaticon-star" />
|
||||
</span>
|
||||
</span>
|
||||
<span className="marquee-inner left">
|
||||
<span className="marquee-item">Italian pizza</span>
|
||||
<span className="marquee-item">
|
||||
<i className="flaticon-star" />
|
||||
</span>
|
||||
<span className="marquee-item">our Testimonials</span>
|
||||
<span className="marquee-item">
|
||||
<i className="flaticon-star" />
|
||||
</span>
|
||||
<span className="marquee-item">burger king</span>
|
||||
<span className="marquee-item">
|
||||
<i className="flaticon-star" />
|
||||
</span>
|
||||
</span>
|
||||
<span className="marquee-inner left">
|
||||
<span className="marquee-item">Italian pizza</span>
|
||||
<span className="marquee-item">
|
||||
<i className="flaticon-star" />
|
||||
</span>
|
||||
<span className="marquee-item">our Testimonials</span>
|
||||
<span className="marquee-item">
|
||||
<i className="flaticon-star" />
|
||||
</span>
|
||||
<span className="marquee-item">burger king</span>
|
||||
<span className="marquee-item">
|
||||
<i className="flaticon-star" />
|
||||
</span>
|
||||
</span>
|
||||
</span>
|
||||
<div className="headline-shapes">
|
||||
<div className="shape one">
|
||||
<img src="/assets/images/shapes/chillies.png" alt="Shape" />
|
||||
</div>
|
||||
<div className="shape two">
|
||||
<img src="/assets/images/shapes/tomato.png" alt="Shape" />
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
{/* Headline Area end */}
|
||||
{/* Testimonials Area start */}
|
||||
{/* <section className="testimonials-area bgc-lighter pt-105 rpt-85 pb-130 rpb-100 rel z-1">
|
||||
<div className="container">
|
||||
<div className="row justify-content-center">
|
||||
<div className="col-xl-7 col-lg-8">
|
||||
<div
|
||||
className="section-title text-center mb-50"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<span className="sub-title mb-5">customer feedback</span>
|
||||
<h2>what have lot’s off happy customer explore feedback</h2>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<TestimonialSlider2 />
|
||||
</div>
|
||||
<div className="testimonials-shapes">
|
||||
<div className="shape one">
|
||||
<img src="/assets/images/shapes/hero-shape4.png" alt="Shape" />
|
||||
</div>
|
||||
<div className="shape two">
|
||||
<img src="/assets/images/shapes/tomato.png" alt="Shape" />
|
||||
</div>
|
||||
</div>
|
||||
</section> */}
|
||||
{/* Testimonials Area end */}
|
||||
</WellFoodLayout>
|
||||
);
|
||||
};
|
||||
export default page;
|
||||
61
app/blog/[slug]/page.js
Normal file
@ -0,0 +1,61 @@
|
||||
// app/blog/[slug]/page.tsx
|
||||
import PageBanner from "@/components/PageBanner";
|
||||
import WellFoodLayout from "@/layout/WellFoodLayout";
|
||||
import { Blog } from "@/utility/constant.utils";
|
||||
|
||||
export async function generateStaticParams() {
|
||||
return Blog.map((item) => ({
|
||||
slug: item.slug,
|
||||
}));
|
||||
}
|
||||
|
||||
export default function BlogPage({ params }) {
|
||||
const { slug } = params;
|
||||
|
||||
const blog = Blog.find((item) => item.slug === slug);
|
||||
|
||||
if (!blog) {
|
||||
return <div>Blog post not found</div>;
|
||||
}
|
||||
|
||||
return (
|
||||
<WellFoodLayout>
|
||||
<PageBanner pageTitle={"Blog details"} background="/assets/images/inner-banner/2.webp" />
|
||||
<section className="blog-details-area py-80 rpy-60">
|
||||
<div className="container container-1290">
|
||||
<div className="row">
|
||||
<div className="col-lg-12">
|
||||
<div className="blog-details-wrap">
|
||||
<div className="blog-item style-two">
|
||||
<div
|
||||
className="image"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<img src={blog.bigImage} alt="Blog Standard" loading="lazy" />
|
||||
</div>
|
||||
<div
|
||||
className="content"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<ul className="blog-meta-two">
|
||||
<li>{blog.user}</li>
|
||||
<li>{blog.date}</li>
|
||||
</ul>
|
||||
<h3>{blog.title}</h3>
|
||||
<div
|
||||
dangerouslySetInnerHTML={{ __html: blog.description }}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</WellFoodLayout>
|
||||
);
|
||||
}
|
||||
17
app/blog/page.js
Normal file
@ -0,0 +1,17 @@
|
||||
import ListOfBlogSection from "@/components/blog/ListOfBlogSection";
|
||||
import PageBanner from "@/components/PageBanner";
|
||||
import WellFoodLayout from "@/layout/WellFoodLayout";
|
||||
import Link from "next/link";
|
||||
export const metadata = {
|
||||
title: "Blog - Authentic South Indian Restaurant",
|
||||
description: "Stay updated with the latest on Indian cuisine, South Indian dishes, and food trends in Mississauga. Check out our blog for tips, recipes, and more!",
|
||||
};
|
||||
const page = () => {
|
||||
return (
|
||||
<WellFoodLayout>
|
||||
<PageBanner pageTitle={"Blog"} background="/assets/images/inner-banner/2.webp" />
|
||||
<ListOfBlogSection />
|
||||
</WellFoodLayout>
|
||||
);
|
||||
};
|
||||
export default page;
|
||||
141
app/contact/page.js
Normal file
@ -0,0 +1,141 @@
|
||||
|
||||
import PageBanner from "@/components/PageBanner";
|
||||
import WellFoodLayout from "@/layout/WellFoodLayout";
|
||||
import ContactForm from "@/components/ContactForm";
|
||||
|
||||
export const metadata = {
|
||||
title: "Shiva Sakthi | Best South Indian Restaurant in Mississauga",
|
||||
description: "Get in touch with Shiva Sakthi, Mississauga’s top Indian restaurant. Call or visit us for dine-in, takeout, or catering. Located Airport Road Malton, Mississauga",
|
||||
};
|
||||
|
||||
const page = () => {
|
||||
|
||||
return (
|
||||
<WellFoodLayout>
|
||||
<PageBanner pageTitle={"Contact us"} background="/assets/images/inner-banner/3.webp" />
|
||||
<section className="contact-page-area pt-130 rpt-100 pb-60 rpb-85 rel z-1" >
|
||||
<div className="container">
|
||||
<div className="row align-items-center">
|
||||
|
||||
<div
|
||||
className="contact-page-content rmb-55"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="section-title mb-35 text-center">
|
||||
<span className="sub-title mb-10">contact us</span>
|
||||
<h2>Get In Touch With Us</h2>
|
||||
</div>
|
||||
<div className="row">
|
||||
<div className="col-md-4">
|
||||
<div className="contact-info-item bgc-black" style={{
|
||||
backgroundImage: "url(/assets/images/background/hero.jpg)"
|
||||
}}>
|
||||
<div className="icon"><i className="fal fa-map-marker-alt" /></div>
|
||||
<div className="content">
|
||||
<span className="title" style={{ fontWeight: "bold" }}>Location</span>
|
||||
<p>7166 Airport Road, Mississauga, Ontario L4T 2H2, Canada.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-md-4">
|
||||
<div className="contact-info-item bgc-black" style={{
|
||||
backgroundImage: "url(/assets/images/background/hero.jpg)"
|
||||
}}>
|
||||
<div className="icon"><i className="fal fa-envelope-open" /></div>
|
||||
<div className="content">
|
||||
<span className="title" style={{ fontWeight: "bold" }}>Email Address</span>
|
||||
<p>
|
||||
<a href="mailto:info@shivasakthi.ca">info@shivasakthi.ca</a>
|
||||
<br />
|
||||
<br />
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-md-4">
|
||||
<div className="contact-info-item bgc-black" style={{
|
||||
backgroundImage: "url(/assets/images/background/hero.jpg)"
|
||||
}}>
|
||||
<div className="icon"><i className="fal fa-phone" /></div>
|
||||
<div className="content">
|
||||
<span className="title" style={{ fontWeight: "bold" }}>Call Us</span>
|
||||
<p>
|
||||
<a href="tel: 9056773555">905 677 3555</a>
|
||||
<br />
|
||||
<br />
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section className="contact-page-area rpt-40 pt-60 pb-60 rel z-1 bgc-black">
|
||||
<div className="container">
|
||||
<div className="row align-items-center no-gap">
|
||||
<div className="col-lg-6">
|
||||
<div
|
||||
className="contact-page-content rmb-55"
|
||||
data-aos="fade-left"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
|
||||
<div className="contact-info-wrap">
|
||||
|
||||
<img src="/assets/images/contact.webp" alt="Contact ShivaSakthi" loading="lazy" />
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
className="col-lg-6"
|
||||
data-aos="fade-right"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<ContactForm />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<div className="bg-lines">
|
||||
<span />
|
||||
<span />
|
||||
<span />
|
||||
<span />
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section className="contact-page-area pt-60">
|
||||
<div className="container-fluid">
|
||||
<div className="row align-items-center">
|
||||
<div
|
||||
className="our-location"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
{/* <iframe
|
||||
src="https://www.google.com/maps/embed?pb=!1m10!1m8!1m3!1d96777.16150026117!2d-74.00840582560909!3d40.71171357405996!3m2!1i1024!2i768!4f13.1!5e0!3m2!1sen!2sbd!4v1706508986625!5m2!1sen!2sbd"
|
||||
style={{ border: 0, width: "100%" }}
|
||||
allowFullScreen=""
|
||||
loading="lazy"
|
||||
referrerPolicy="no-referrer-when-downgrade"
|
||||
/> */}
|
||||
<iframe src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d369174.37626170606!2d-79.647352!3d43.706916!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x882b3bfed533002b%3A0xe83c1cd7caca2ee6!2s7166%20Airport%20Rd%2C%20Mississauga%2C%20ON%20L4T%202H2%2C%20Canada!5e0!3m2!1sen!2sus!4v1748536731832!5m2!1sen!2sus" style={{ border: 0, width: "100%" }}
|
||||
allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</WellFoodLayout>
|
||||
);
|
||||
};
|
||||
export default page;
|
||||
BIN
app/favicon.ico
Normal file
|
After Width: | Height: | Size: 4.2 KiB |
77
app/globals.css
Normal file
@ -0,0 +1,77 @@
|
||||
@import url("https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Roboto:wght@400;500;700&display=swap");
|
||||
|
||||
.main-menu .navbar-collapse .mobile-menu li ul {
|
||||
opacity: 1 !important;
|
||||
visibility: unset !important;
|
||||
}
|
||||
.main-menu .navbar-collapse li:hover > ul {
|
||||
visibility: visible;
|
||||
opacity: 1;
|
||||
top: 100%;
|
||||
display: block;
|
||||
}
|
||||
.main-menu .navbar-collapse li ul li ul {
|
||||
top: -2% !important;
|
||||
}
|
||||
|
||||
/* Slick slider */
|
||||
.slick-dots,
|
||||
.testimonials-three-content .testimonial-two-item {
|
||||
display: flex !important;
|
||||
}
|
||||
.slick-slide {
|
||||
padding-left: 15px;
|
||||
padding-right: 15px;
|
||||
}
|
||||
.food-category-active .slick-track .food-category-item {
|
||||
display: flex !important;
|
||||
}
|
||||
|
||||
.testimonials-three-content .slick-active .testimonial-two-item .content,
|
||||
.testimonials-three-content .slick-active .testimonial-two-item .image img,
|
||||
.testimonials-three-content .slick-active .testimonial-two-item .image .quote {
|
||||
opacity: 1;
|
||||
-webkit-transform: translate(0);
|
||||
-ms-transform: translate(0);
|
||||
transform: translate(0);
|
||||
}
|
||||
|
||||
.testimonials-three-content .slick-active .testimonial-two-item .image .quote {
|
||||
-webkit-transition-delay: 0.35s;
|
||||
-o-transition-delay: 0.35s;
|
||||
transition-delay: 0.35s;
|
||||
}
|
||||
|
||||
.testimonials-five-authors .slick-slide {
|
||||
width: 100% !important;
|
||||
padding: unset !important;
|
||||
}
|
||||
.testimonials-five-authors .slick-current .testimonial-five-author-item img {
|
||||
width: 75px;
|
||||
height: 75px;
|
||||
border: 3px solid var(--primary-color);
|
||||
}
|
||||
.testimonials-five-authors .testimonial-five-author-item {
|
||||
width: unset !important;
|
||||
}
|
||||
|
||||
.testimonials-five-content .slick-active .testimonial-five-item:before {
|
||||
opacity: 1;
|
||||
bottom: 100%;
|
||||
}
|
||||
|
||||
.history-progress .canvas {
|
||||
margin-right: 30px;
|
||||
}
|
||||
|
||||
.history-progress .CircularProgressbar {
|
||||
width: 120px;
|
||||
}
|
||||
.history-progress.style-two .canvas {
|
||||
margin-right: 0;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.tab-style-one .nav-link:hover {
|
||||
color: var(--heading-color);
|
||||
}
|
||||
21
app/layout.js
Normal file
@ -0,0 +1,21 @@
|
||||
import "@css/aos.css";
|
||||
import "@css/bootstrap.min.css";
|
||||
import "@css/flaticon.min.css";
|
||||
import "@css/fontawesome-5.14.0.min.css";
|
||||
import "@css/magnific-popup.min.css";
|
||||
import "@css/nice-select.min.css";
|
||||
import "@css/slick.min.css";
|
||||
import "@css/style.css";
|
||||
import "./globals.css";
|
||||
export const metadata = {
|
||||
title: "Shivasakthi Restaurant",
|
||||
description: "The best Indian food in Mississauga! Enjoy authentic South Indian cuisine, vegetarian dishes, dosa, Indian snacks, and takeout options at Shiva Sakthi.",
|
||||
};
|
||||
|
||||
export default function RootLayout({ children }) {
|
||||
return (
|
||||
<html lang="en">
|
||||
<body>{children}</body>
|
||||
</html>
|
||||
);
|
||||
}
|
||||
29
app/menu/page.js
Normal file
@ -0,0 +1,29 @@
|
||||
import { AboutUs4 } from "@/components/AboutUs";
|
||||
import Burger from "@/components/Burger";
|
||||
import MenuIframe from "@/components/MenuIframe";
|
||||
import PageBanner from "@/components/PageBanner";
|
||||
import RestaurantMenu from "@/components/RestaurantMenu";
|
||||
import WellFoodLayout from "@/layout/WellFoodLayout";
|
||||
|
||||
|
||||
export const metadata = {
|
||||
title: "Our Menu | Best South & North Indian Restaurant Mississauga",
|
||||
description: "The delicious menu at Shiva Sakthi, featuring dosa, vegetarian thalis, tandoor specialties, and authentic Indian cuisine. Takeout and buffet options available."
|
||||
};
|
||||
const page = () => {
|
||||
return (
|
||||
<WellFoodLayout>
|
||||
{/* Page Banner Start */}
|
||||
<PageBanner bgImg="/assets/images/inner-banner/5.webp" pageTitle={"Menu"} background="/assets/images/inner-banner/4.webp" />
|
||||
|
||||
{/* <div className="pt-100">
|
||||
<Headline />
|
||||
</div> */}
|
||||
{/* Headline Area end */}
|
||||
{/* Restaurant Menu Area start */}
|
||||
<RestaurantMenu />
|
||||
<MenuIframe />
|
||||
</WellFoodLayout>
|
||||
);
|
||||
};
|
||||
export default page;
|
||||
151
app/page.js
Normal file
@ -0,0 +1,151 @@
|
||||
"use client";
|
||||
import AboutUs from "@/components/AboutUs";
|
||||
import Counter from "@/components/Counter";
|
||||
import AboutSection from "@/components/home/AboutSection";
|
||||
import BlogSection from "@/components/home/BlogSection";
|
||||
import CategorySection from "@/components/home/CategorySection";
|
||||
import DosaOfferSection from "@/components/home/DosaOfferSection";
|
||||
import HeroBanner from "@/components/home/HeroBanner";
|
||||
import MealsOfferSection from "@/components/home/MealsOfferScetion";
|
||||
import HomeOfferCard from "@/components/home/OfferCard";
|
||||
import PopularMenu from "@/components/home/PopularMenu";
|
||||
import InstagramArea from "@/components/InstagramArea";
|
||||
import OfferCard from "@/components/OfferCard";
|
||||
import Testimonial from "@/components/Testimonial";
|
||||
import { TestimonialSlider2 } from "@/components/TestimonialSlider";
|
||||
import WellFoodLayout from "@/layout/WellFoodLayout";
|
||||
import Link from "next/link";
|
||||
const page = () => {
|
||||
return (
|
||||
<WellFoodLayout>
|
||||
{/* Hero Area Start */}
|
||||
<HeroBanner />
|
||||
{/* Hero Area End */}
|
||||
|
||||
{/* About Us Area start */}
|
||||
<AboutSection />
|
||||
{/* About Us Area end */}
|
||||
|
||||
{/* Offer Card Area start */}
|
||||
{/* <HomeOfferCard /> */}
|
||||
{/* Offer Card Area end */}
|
||||
|
||||
{/* Counter Four Area start */}
|
||||
<div
|
||||
className="counter-area-four bgs-cover pt-100"
|
||||
style={{ backgroundImage: "url(/assets/images/home/bg-image.jpg)" }}
|
||||
>
|
||||
<div className="container">
|
||||
<div className="row justify-content-end">
|
||||
<div className="col-xl-7 col-lg-9">
|
||||
<div className="row no-gap">
|
||||
|
||||
<div className="col-lg-4 col-sm-6">
|
||||
<div
|
||||
className="counter-item style-four bgc-secondary counter-text-wrap"
|
||||
data-aos="fade-down"
|
||||
data-aos-delay={50}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<span
|
||||
className="count-text plus"
|
||||
data-speed={3000}
|
||||
data-stop={20}
|
||||
>
|
||||
<Counter end={20} />
|
||||
</span>
|
||||
<div className="wave">
|
||||
<img
|
||||
src="/assets/images/shapes/counter-wave.png"
|
||||
alt="Shape"
|
||||
/>
|
||||
</div>
|
||||
<h6 className="counter-title">Experience Chefs</h6>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-4 col-sm-6">
|
||||
<div
|
||||
className="counter-item text-white style-four counter-text-wrap"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50} style={{ backgroundColor: "#222222" }}
|
||||
>
|
||||
<span
|
||||
className="count-text k-plus"
|
||||
data-speed={3000}
|
||||
data-stop={2}
|
||||
>
|
||||
<Counter end={2} />
|
||||
</span>
|
||||
<div className="wave">
|
||||
<img
|
||||
src="/assets/images/shapes/counter-wave-white.png"
|
||||
alt="Shape"
|
||||
/>
|
||||
</div>
|
||||
<h6 className="counter-title">Happy Customers</h6>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-4 col-sm-6">
|
||||
<div
|
||||
className="counter-item style-four bgc-primary counter-text-wrap"
|
||||
data-aos="fade-down"
|
||||
data-aos-delay={100}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<span
|
||||
className="count-text plus"
|
||||
data-speed={3000}
|
||||
data-stop={40}
|
||||
>
|
||||
<Counter end={40} />
|
||||
</span>
|
||||
<div className="wave">
|
||||
<img
|
||||
src="/assets/images/shapes/counter-wave.png"
|
||||
alt="Shape"
|
||||
/>
|
||||
</div>
|
||||
<h6 className="counter-title">Favorite Dishes</h6>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/* Counter Four Area end */}
|
||||
|
||||
{/* category start */}
|
||||
<CategorySection />
|
||||
{/* category end */}
|
||||
|
||||
{/* Special Offer Area start */}
|
||||
<MealsOfferSection />
|
||||
{/* Special Offer Area end */}
|
||||
|
||||
{/* Popular Menu Area start */}
|
||||
<PopularMenu />
|
||||
{/* Popular Menu Area end */}
|
||||
|
||||
{/* Special Offer Area start */}
|
||||
<DosaOfferSection />
|
||||
{/* Special Offer Area end */}
|
||||
|
||||
{/* Testimonials Two Area start */}
|
||||
<Testimonial />
|
||||
{/* Testimonials Two Area end */}
|
||||
|
||||
|
||||
{/* Blog Area start */}
|
||||
<BlogSection />
|
||||
{/* Blog Area end */}
|
||||
|
||||
<InstagramArea />
|
||||
|
||||
</WellFoodLayout>
|
||||
);
|
||||
};
|
||||
export default page;
|
||||
53
components/About/AboutCallAction.js
Normal file
@ -0,0 +1,53 @@
|
||||
import Link from "next/link";
|
||||
const AboutCallAction = () => {
|
||||
return (
|
||||
|
||||
<section
|
||||
className="booking-table-area-two bgs-cover py-100 rel z-1 overlay"
|
||||
style={{
|
||||
backgroundImage:
|
||||
"url(/assets/images/about/bg-about.webp)",
|
||||
}}
|
||||
>
|
||||
<div className="container">
|
||||
<div className="row justify-content-between align-items-center">
|
||||
{/* <div
|
||||
className="col-lg-5"
|
||||
data-aos="fade-left"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="section-title mt-50 text-white mb-50">
|
||||
<h2>
|
||||
We Offer quality service That Customers Needs for health
|
||||
food
|
||||
</h2>
|
||||
</div>
|
||||
</div> */}
|
||||
<div
|
||||
className="col-xl-12 col-lg-12 text-center"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="booking-table-content style-two rmt-55">
|
||||
{/* <a
|
||||
href="https://www.youtube.com/watch?v=9Y7ma241N8k"
|
||||
className="mfp-iframe video-play"
|
||||
>
|
||||
<i className="fas fa-play" />
|
||||
</a> */}
|
||||
<div className="section-title mt-50 text-white mb-50">
|
||||
<span className="sub-title mb-5">Canada’s First South Indian Dining Experience with a Musical Twist</span>
|
||||
<h2>
|
||||
Indian Flavors with Live Melodies
|
||||
</h2>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
};
|
||||
export default AboutCallAction;
|
||||
40
components/About/AboutCallAction2.js
Normal file
@ -0,0 +1,40 @@
|
||||
import Link from "next/link";
|
||||
const AboutCallAction2 = () => {
|
||||
return (
|
||||
<section className="cta-area py-100 rel z-1 bgc-primary" style={{
|
||||
backgroundImage: "url(/assets/images/testimonials/testimonials-two-bg.png)"
|
||||
}} >
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-5 col-md-8">
|
||||
<div className="cta-content">
|
||||
<div className="section-title text-white mb-20">
|
||||
<span className="sub-title mb-5 text-white">Craving Authentic Indian Flavors?</span>
|
||||
<h2>Don’t wait—call us now to place your order!</h2>
|
||||
</div>
|
||||
<Link href="/contact" className="theme-btn style-three">
|
||||
Call Us <i className="far fa-arrow-alt-right" />
|
||||
</Link>
|
||||
{/* <div
|
||||
className="cta-badge"
|
||||
style={{
|
||||
backgroundImage: "url(/assets/images/shapes/cta-shape.png)",
|
||||
}}
|
||||
>
|
||||
<span>
|
||||
quality
|
||||
<br /> food
|
||||
</span>
|
||||
</div> */}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
className="cta-bg"
|
||||
style={{ backgroundImage: "url(/assets/images/about/about-3.webp)" }}
|
||||
/>
|
||||
</section>
|
||||
);
|
||||
};
|
||||
export default AboutCallAction2;
|
||||
45
components/About/AboutCategory.js
Normal file
@ -0,0 +1,45 @@
|
||||
import Link from "next/link";
|
||||
const AboutCategory = () => {
|
||||
return (
|
||||
|
||||
<div className="category-banner-area pb-80">
|
||||
<div className="container">
|
||||
<div className="row row-cols-md-2 row-cols-1 justify-content-center">
|
||||
<div
|
||||
className="col about-biryani-category-1"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
|
||||
<img src="/assets/images/about/ambur_chicken_biryani.png" />
|
||||
{/* <span className="quality">Quality Food</span>
|
||||
<h2>Strawberry Juice & slices</h2>
|
||||
<Link href="shop" className="theme-btn style-two">
|
||||
Shop now <i className="far fa-arrow-alt-right" />
|
||||
</Link> */}
|
||||
|
||||
</div>
|
||||
<div
|
||||
className="col about-biryani-category-2"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={50}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
|
||||
<img src="/assets/images/about/mutton-biryani.png" />
|
||||
{/* <h3>buy 1</h3>
|
||||
<span className="get-one">get free 1</span>
|
||||
<Link href="shop" className="theme-btn">
|
||||
Shop now <i className="far fa-arrow-alt-right" />
|
||||
</Link> */}
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
export default AboutCategory;
|
||||
79
components/About/AboutContent.js
Normal file
@ -0,0 +1,79 @@
|
||||
import Link from "next/link";
|
||||
const AboutContent = () => {
|
||||
return (
|
||||
|
||||
<section className="about-us-area pt-100 rpt-80 pb-100 rpb-70 rel z-1">
|
||||
<div className="container">
|
||||
<div className="row align-items-end">
|
||||
<div className="col-lg-6">
|
||||
<div
|
||||
className="about-image-five mb-30 rmb-55"
|
||||
data-aos="fade-left"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<img src="/assets/images/about/about-1.webp" alt="About" loading="lazy" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-6">
|
||||
<div
|
||||
className="about-us-content"
|
||||
data-aos="fade-right"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="section-title mb-25">
|
||||
<span className="sub-title mb-5">Experience South Indian Cuisine Like Never Before!</span>
|
||||
<h2>Where Flavor Meets Festivity</h2>
|
||||
</div>
|
||||
<p>
|
||||
At Shiva Sakthi, dining isn’t just about food, it’s an immersive journey that tantalizes every sense. We bring the rich, authentic flavors of South and North Indian cuisine straight to the heart of Canada. </p>
|
||||
|
||||
<p>Whether you're here for a quiet family dinner or a lively evening out, Shiva Sakthi transforms every meal into a celebration of culture, taste, where every bite hits a note and every vibe feels like home.</p>
|
||||
|
||||
<div className="row">
|
||||
<div className="col-sm-6">
|
||||
<div className="service-item style-two">
|
||||
<div className="icon">
|
||||
<i className="flaticon-high-quality" />
|
||||
</div>
|
||||
<h5>
|
||||
<Link href="menu-burger">Best Quality Food</Link>
|
||||
</h5>
|
||||
<p>
|
||||
Our talented chefs craft each dish precision sourcing
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-sm-6">
|
||||
<div className="service-item style-two">
|
||||
<div className="icon">
|
||||
<i className="flaticon-chef" />
|
||||
</div>
|
||||
<h5>
|
||||
<Link href="menu-burger">Experience our Chefs</Link>
|
||||
</h5>
|
||||
<p>
|
||||
Our talented chefs craft each dish precision sourcing
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="about-btn-author pt-5 ">
|
||||
<Link href="/menu" className="theme-btn style-two">
|
||||
Check Out Our menu <i className="far fa-arrow-alt-right" />
|
||||
</Link>
|
||||
{/* <Link href="/menu" className="read-more">
|
||||
Check Out Our menu{" "}
|
||||
<i className="far fa-arrow-alt-right" />
|
||||
</Link> */}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
};
|
||||
export default AboutContent;
|
||||
93
components/About/AboutContent2.js
Normal file
@ -0,0 +1,93 @@
|
||||
import Link from "next/link";
|
||||
const AboutContent2 = () => {
|
||||
return (
|
||||
<section className="about-us-area-four pt-130 rpt-100 pb-85 rpb-55 rel z-1">
|
||||
<div className="container">
|
||||
<div className="row align-items-center">
|
||||
<div className="col-lg-6">
|
||||
<div
|
||||
className="about-us-content ms-0 rmb-25"
|
||||
data-aos="fade-left"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="section-title mb-25">
|
||||
<span className="sub-title mb-5">Dine to the Rhythm of Authentic South Indian Flavors</span>
|
||||
<h2>Authentic Flavors, Unforgettable Moments</h2>
|
||||
</div>
|
||||
<p>
|
||||
At Shiva Sakthi, we serve the rich, unforgettable flavors of Indian cuisine in a setting that feels just like home. From the first bite to the last, each dish is crafted with care, tradition, and a passion for authentic taste.</p>
|
||||
<p>Whether you're craving the bold spices of a South Indian classic or the comfort of a familiar favorite, every visit is a celebration of flavor and hospitality. Delicious food. Warm ambiance. Memorable moments.</p>
|
||||
<Link href="/menu" className="theme-btn mt-25 mb-60">
|
||||
Check Out Our Menu <i className="far fa-arrow-alt-right" />
|
||||
</Link>
|
||||
{/* <div className="row">
|
||||
<div className="col-sm-4 col-6">
|
||||
<div className="counter-item style-two counter-text-wrap">
|
||||
<span
|
||||
className="count-text k-plus"
|
||||
data-speed={3000}
|
||||
data-stop={34}
|
||||
>
|
||||
<Counter end={34} />
|
||||
</span>
|
||||
<span className="counter-title">Organic Planting</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-sm-4 col-6">
|
||||
<div className="counter-item style-two counter-text-wrap">
|
||||
<span
|
||||
className="count-text plus"
|
||||
data-speed={3000}
|
||||
data-stop={356}
|
||||
>
|
||||
<Counter end={356} />
|
||||
</span>
|
||||
<span className="counter-title">Passionate Chef’s</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-sm-4 col-6">
|
||||
<div className="counter-item style-two counter-text-wrap">
|
||||
<span
|
||||
className="count-text plus"
|
||||
data-speed={3000}
|
||||
data-stop={8534}
|
||||
>
|
||||
<Counter end={8534} />
|
||||
</span>
|
||||
<span className="counter-title">Favourite Dishes</span>
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-6">
|
||||
<div
|
||||
className="about-image-four mb-30"
|
||||
data-aos="fade-right"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<img src="/assets/images/about/about-2.webp" alt="About" loading="lazy" />
|
||||
{/* <div className="row">
|
||||
<div className="col">
|
||||
<img src="assets/images/about/about-four1.jpg" alt="About" />
|
||||
</div>
|
||||
<div className="col mt-80">
|
||||
<img src="assets/images/about/about-four2.jpg" alt="About" />
|
||||
</div>
|
||||
</div> */}
|
||||
{/* <div className="badge">
|
||||
<img
|
||||
src="assets/images/about/about-four-badge.jpg"
|
||||
alt="Badge"
|
||||
/>
|
||||
</div> */}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
};
|
||||
export default AboutContent2;
|
||||
113
components/About/AboutTestimonial.js
Normal file
@ -0,0 +1,113 @@
|
||||
"use client";
|
||||
import { sliderProps } from "@/utility/sliderProps";
|
||||
import Slider from "react-slick";
|
||||
|
||||
const Testimonial = () => {
|
||||
return (
|
||||
<section
|
||||
className="testimonials-two bgc-primary"
|
||||
style={{
|
||||
backgroundImage:
|
||||
"url(/assets/images/testimonials/testimonials-two-bg.png)",
|
||||
}}
|
||||
>
|
||||
<div className="row align-items-center">
|
||||
<div className="col-lg-6">
|
||||
<div className="why-choose-two-image">
|
||||
<img
|
||||
src="/assets/images/about/testimonial.webp"
|
||||
alt="Testimonials" loading="lazy"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-6">
|
||||
<div className="testimonials-two-content rel z-1 text-center text-white p-45 rpy-55">
|
||||
<div
|
||||
className="section-title mb-20"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<span className="sub-title mb-5">customer feedback</span>
|
||||
<h2>what have lot’s off happy customer explore feedback</h2>
|
||||
</div>
|
||||
<span className="marquee-wrap style-two">
|
||||
<span className="marquee-inner left">review </span>
|
||||
<span className="marquee-inner left">review </span>
|
||||
<span className="marquee-inner left">review </span>
|
||||
</span>
|
||||
<Slider
|
||||
{...sliderProps.testimonialsTwoCarousel}
|
||||
className="testimonials-two-carousel"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={50}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="testimonial-two-item">
|
||||
<div className="ratting">
|
||||
<i className="fas fa-star text-white" />
|
||||
<i className="fas fa-star text-white" />
|
||||
<i className="fas fa-star text-white" />
|
||||
<i className="fas fa-star text-white" />
|
||||
<i className="fas fa-star text-white" />
|
||||
</div>
|
||||
<div className="text">
|
||||
Visited this beautiful restaurant while nearby for a conference. The staff were welcoming from the very start! We started with the Gobi 65 which had light spice but a to. Of flavour. Then, we had the hakka noodles, masala dosa and chettinadu chicken curry which was so tasty. Our Server Gagan recommended it and I’m glad he did. He was fantastic and if we are in town again, we will definitely return!
|
||||
</div>
|
||||
<span className="author">Cam Larocque</span>
|
||||
{/* <span className="designation">Manager</span> */}
|
||||
</div>
|
||||
<div className="testimonial-two-item">
|
||||
<div className="ratting">
|
||||
<i className="fas fa-star text-white" />
|
||||
<i className="fas fa-star text-white" />
|
||||
<i className="fas fa-star text-white" />
|
||||
<i className="fas fa-star text-white" />
|
||||
<i className="fas fa-star text-white" />
|
||||
</div>
|
||||
<div className="text">
|
||||
Good to have another new south india cuisine in GTA. The food was amazing, The service was good and fast, thanks for offering the milk burfi for tasting.
|
||||
I have been to their other restaurant locations in GTA and KW area, the service and food was excellent. All the best for this new location. Must visit for guys looking to try south indian Biryani.
|
||||
</div>
|
||||
<span className="author">Sen K</span>
|
||||
{/* <span className="designation">Manager</span> */}
|
||||
</div>
|
||||
<div className="testimonial-two-item">
|
||||
<div className="ratting mb-3">
|
||||
<i className="fas fa-star text-white" />
|
||||
<i className="fas fa-star text-white" />
|
||||
<i className="fas fa-star text-white" />
|
||||
<i className="fas fa-star text-white" />
|
||||
<i className="fas fa-star text-white" />
|
||||
</div>
|
||||
<div className="text">
|
||||
Absolutely incredible experience! This Tamil restaurant is a hidden gem in Canada. The flavors are rich, authentic, and remind me of home. Each dish was perfectly spiced and cooked to perfection. The staff were warm, welcoming, and attentive, making the whole visit even more enjoyable. The ambiance is cozy yet vibrant, and you can tell they take pride in both their food and service. Highly recommend to anyone looking for a true taste of South Indian cuisine!
|
||||
</div>
|
||||
<span className="author">manimala s</span>
|
||||
{/* <span className="designation">Manager</span> */}
|
||||
</div>
|
||||
{/* <div className="testimonial-two-item">
|
||||
<div className="quote">
|
||||
<i className="flaticon-quote" />
|
||||
</div>
|
||||
<div className="text">
|
||||
Renowned for its versatility in the kitchen, Red King Crab can
|
||||
prepared in various ways, from simple steaming or boiling to
|
||||
elaborate preparations such as grilling incorporating weather
|
||||
loving
|
||||
</div>
|
||||
<span className="author">Salvador I. Burton</span>
|
||||
<span className="designation">Manager</span>
|
||||
</div> */}
|
||||
</Slider>
|
||||
<div className="shape">
|
||||
<img src="/assets/images/shapes/tomato.png" alt="Shape" loading="lazy" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
};
|
||||
export default Testimonial;
|
||||
338
components/AboutUs.js
Normal file
@ -0,0 +1,338 @@
|
||||
import Link from "next/link";
|
||||
import Counter from "./Counter";
|
||||
|
||||
const AboutRight = () => {
|
||||
return (
|
||||
<div className="col-lg-6">
|
||||
<div
|
||||
className="about-us-content"
|
||||
data-aos="fade-right"
|
||||
data-aos-delay={150}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="section-title mb-25">
|
||||
<span className="sub-title mb-5">learn About wellfood</span>
|
||||
<h2>the amazing & Quality food for your good health</h2>
|
||||
</div>
|
||||
<p>
|
||||
Welcome too restaurant, where culinary excellence meets warm
|
||||
hospitality in every dish we serve. Nestled in the heart of City Name
|
||||
our eatery invites you on a journey
|
||||
</p>
|
||||
<div className="about-btn-author pt-5 mb-60">
|
||||
<Link href="about" className="theme-btn style-two">
|
||||
learn more us <i className="far fa-arrow-alt-right" />
|
||||
</Link>
|
||||
<Link href="about" className="read-more">
|
||||
Explore popular menu <i className="far fa-arrow-alt-right" />
|
||||
</Link>
|
||||
</div>
|
||||
<div className="row">
|
||||
<div className="col-sm-4 col-6">
|
||||
<div className="counter-item style-two counter-text-wrap">
|
||||
<span
|
||||
className="count-text k-plus"
|
||||
data-speed={3000}
|
||||
data-stop={34}
|
||||
>
|
||||
<Counter end={34} />
|
||||
</span>
|
||||
<span className="counter-title">Organic Planting</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-sm-4 col-6">
|
||||
<div className="counter-item style-two counter-text-wrap">
|
||||
<span
|
||||
className="count-text plus"
|
||||
data-speed={3000}
|
||||
data-stop={356}
|
||||
>
|
||||
<Counter end={356} />
|
||||
</span>
|
||||
<span className="counter-title">Passionate Chef’s</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-sm-4 col-6">
|
||||
<div className="counter-item style-two counter-text-wrap">
|
||||
<span
|
||||
className="count-text plus"
|
||||
data-speed={3000}
|
||||
data-stop={8534}
|
||||
>
|
||||
<Counter end={8534} />
|
||||
</span>
|
||||
<span className="counter-title">Favourite Dishes</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
const AboutUs = ({
|
||||
productImage = "/assets/images/about/pizza.png",
|
||||
title = "Italian pizza",
|
||||
product = "Pizza",
|
||||
}) => {
|
||||
return (
|
||||
<section className="about-us-area pt-130 rpt-100 pb-150 rpb-60 rel z-1">
|
||||
<div className="container">
|
||||
<div className="row align-items-end">
|
||||
<div className="col-lg-6">
|
||||
<div
|
||||
className="about-image-part style-two mb-30 rmb-55"
|
||||
data-aos="fade-left"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<img src={productImage} alt={`About ${product}`} loading="lazy" />
|
||||
<div
|
||||
className="quality-food"
|
||||
style={{
|
||||
backgroundImage:
|
||||
"url(assets/images/shapes/about-star-yellow.png)",
|
||||
}}
|
||||
>
|
||||
<span className="for-border" />
|
||||
<span className="text">
|
||||
quality <br />
|
||||
food
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<AboutRight />
|
||||
</div>
|
||||
</div>
|
||||
<span className="about-bg-text">{title}</span>
|
||||
</section>
|
||||
);
|
||||
};
|
||||
export default AboutUs;
|
||||
|
||||
export const AboutUs2 = ({
|
||||
aboutImg1 = "/assets/images/about/about-four3.jpg",
|
||||
aboutImg2 = "/assets/images/about/about-four4.jpg",
|
||||
}) => {
|
||||
return (
|
||||
<section className="about-us-area pt-130 rpt-100 pb-150 rpb-60 rel z-1">
|
||||
<div className="container">
|
||||
<div className="row align-items-end">
|
||||
<div className="col-lg-6">
|
||||
<div
|
||||
className="about-image-four style-two mb-30"
|
||||
data-aos="fade-left"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="row">
|
||||
<div className="col">
|
||||
<img src={aboutImg1} alt="About" loading="lazy" />
|
||||
</div>
|
||||
<div className="col mt-80">
|
||||
<img src={aboutImg2} alt="About" loading="lazy" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="badge">
|
||||
<img
|
||||
src="/assets/images/about/about-four-badge.jpg"
|
||||
alt="Badge"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<AboutRight />
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
};
|
||||
export const AboutUs3 = ({
|
||||
aboutImg1 = "/assets/images/about/about-four3.jpg",
|
||||
aboutImg2 = "/assets/images/about/about-four4.jpg",
|
||||
}) => {
|
||||
return (
|
||||
<section className="about-us-area-four pt-130 rpt-100 pb-85 rpb-55 rel z-1">
|
||||
<div className="container">
|
||||
<div className="row align-items-center">
|
||||
<div className="col-lg-6">
|
||||
<div
|
||||
className="about-us-content ms-0 rmb-25"
|
||||
data-aos="fade-left"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="section-title mb-25">
|
||||
<span className="sub-title mb-5">learn About wellfood</span>
|
||||
<h2>we provide best Quality food for your health</h2>
|
||||
</div>
|
||||
<p>
|
||||
Welcome too restaurant, where culinary excellence meets warm
|
||||
hospitality in every dish we serve. Nestled in the heart of City
|
||||
Name our eatery invites you on a journey
|
||||
</p>
|
||||
<Link href="about" className="theme-btn mt-25 mb-60">
|
||||
learn more us <i className="far fa-arrow-alt-right" />
|
||||
</Link>
|
||||
<div className="row">
|
||||
<div className="col-sm-4 col-6">
|
||||
<div className="counter-item style-two counter-text-wrap">
|
||||
<span
|
||||
className="count-text k-plus"
|
||||
data-speed={3000}
|
||||
data-stop={34}
|
||||
>
|
||||
<Counter end={34} />
|
||||
</span>
|
||||
<span className="counter-title">Organic Planting</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-sm-4 col-6">
|
||||
<div className="counter-item style-two counter-text-wrap">
|
||||
<span
|
||||
className="count-text plus"
|
||||
data-speed={3000}
|
||||
data-stop={356}
|
||||
>
|
||||
<Counter end={356} />
|
||||
</span>
|
||||
<span className="counter-title">Passionate Chef’s</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-sm-4 col-6">
|
||||
<div className="counter-item style-two counter-text-wrap">
|
||||
<span
|
||||
className="count-text plus"
|
||||
data-speed={3000}
|
||||
data-stop={8534}
|
||||
>
|
||||
<Counter end={8534} />
|
||||
</span>
|
||||
<span className="counter-title">Favourite Dishes</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-6">
|
||||
<div
|
||||
className="about-image-four style-two mb-30"
|
||||
data-aos="fade-right"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="row">
|
||||
<div className="col">
|
||||
<img src="/assets/images/about/about-four1.jpg" alt="About" loading="lazy" />
|
||||
</div>
|
||||
<div className="col mt-80">
|
||||
<img src="/assets/images/about/about-four2.jpg" alt="About" loading="lazy" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="badge">
|
||||
<img
|
||||
src="/assets/images/about/about-four-badge.jpg"
|
||||
alt="Badge" loading="lazy"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
};
|
||||
|
||||
export const AboutUs4 = ({}) => {
|
||||
return (
|
||||
<section className="about-us-area pt-130 rpt-100 pb-90 rpb-60 rel z-1">
|
||||
<div className="container">
|
||||
<div className="row align-items-end">
|
||||
<div className="col-lg-6">
|
||||
<div
|
||||
className="about-restaurant-page rel mb-30 rmb-55"
|
||||
data-aos="fade-left"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<img
|
||||
src="/assets/images/about/menu-restaurant.jpg"
|
||||
alt="Menu Restaurant"
|
||||
/>
|
||||
<div className="experience-year">
|
||||
<span className="years">25</span>
|
||||
Years of experience in restaurant services
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-6">
|
||||
<div
|
||||
className="about-us-content"
|
||||
data-aos="fade-right"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="section-title mb-25">
|
||||
<span className="sub-title mb-5">learn About wellfood</span>
|
||||
<h2>the amazing & Quality food for your good health</h2>
|
||||
</div>
|
||||
<p>
|
||||
Welcome too restaurant, where culinary excellence meets warm
|
||||
hospitality in every dish we serve. Nestled in the heart of City
|
||||
Name our eatery invites you on a journey
|
||||
</p>
|
||||
<div className="about-btn-author pt-5 mb-60">
|
||||
<Link href="about" className="theme-btn style-two">
|
||||
learn more us <i className="far fa-arrow-alt-right" />
|
||||
</Link>
|
||||
<Link href="about" className="read-more">
|
||||
Explore popular menu <i className="far fa-arrow-alt-right" />
|
||||
</Link>
|
||||
</div>
|
||||
<div className="row">
|
||||
<div className="col-sm-4 col-6">
|
||||
<div className="counter-item style-two counter-text-wrap">
|
||||
<span
|
||||
className="count-text k-plus"
|
||||
data-speed={3000}
|
||||
data-stop={34}
|
||||
>
|
||||
<Counter end={34} />
|
||||
</span>
|
||||
<span className="counter-title">Organic Planting</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-sm-4 col-6">
|
||||
<div className="counter-item style-two counter-text-wrap">
|
||||
<span
|
||||
className="count-text plus"
|
||||
data-speed={3000}
|
||||
data-stop={356}
|
||||
>
|
||||
<Counter end={356} />
|
||||
</span>
|
||||
<span className="counter-title">Passionate Chef’s</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-sm-4 col-6">
|
||||
<div className="counter-item style-two counter-text-wrap">
|
||||
<span
|
||||
className="count-text plus"
|
||||
data-speed={3000}
|
||||
data-stop={8534}
|
||||
>
|
||||
<Counter end={8534} />
|
||||
</span>
|
||||
<span className="counter-title">Favourite Dishes</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
};
|
||||
163
components/BookTableForm.js
Normal file
@ -0,0 +1,163 @@
|
||||
const BookTableForm = () => {
|
||||
return (
|
||||
<div
|
||||
className="booking-table-form mb-0"
|
||||
style={{
|
||||
backgroundImage: "url(assets/images/background/form-bg.png)",
|
||||
}}
|
||||
>
|
||||
<div className="section-title">
|
||||
<h2>book a table</h2>
|
||||
</div>
|
||||
<p>Enjoy your food to book your table</p>
|
||||
<form
|
||||
id="booking-form"
|
||||
className="booking-form mt-25"
|
||||
name="booking-form"
|
||||
method="post"
|
||||
>
|
||||
<div className="row gap-20">
|
||||
<div className="col-md-12 mb-20">
|
||||
<div className="form-group">
|
||||
<select name="person" id="person">
|
||||
<option value="option2">2 Person</option>
|
||||
<option value="option3">3 Person</option>
|
||||
<option value="option4">4 Person</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-md-12">
|
||||
<div className="form-group">
|
||||
<label htmlFor="date">
|
||||
<i className="far fa-calendar-alt" />
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
id="date"
|
||||
name="date"
|
||||
className="form-control"
|
||||
defaultValue=""
|
||||
placeholder="Date"
|
||||
required=""
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-md-12">
|
||||
<div className="form-group">
|
||||
<label htmlFor="time">
|
||||
<i className="far fa-clock" />
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
id="time"
|
||||
name="time"
|
||||
className="form-control"
|
||||
defaultValue=""
|
||||
placeholder="Time"
|
||||
required=""
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-md-12">
|
||||
<div className="form-group mb-0">
|
||||
<button type="submit" className="theme-btn">
|
||||
book your table <i className="far fa-arrow-alt-right" />
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
export default BookTableForm;
|
||||
|
||||
export const BookTableForm2 = () => {
|
||||
return (
|
||||
<div
|
||||
className="booking-table-form rmt-50"
|
||||
style={{
|
||||
backgroundImage: "url(assets/images/background/form-bg.png)",
|
||||
}}
|
||||
>
|
||||
<div className="section-title">
|
||||
<h2>book a table</h2>
|
||||
</div>
|
||||
<p>Enjoy your food to book your table</p>
|
||||
<form
|
||||
id="booking-form"
|
||||
className="booking-form mt-25"
|
||||
name="booking-form"
|
||||
method="post"
|
||||
>
|
||||
<div className="row gap-20">
|
||||
<div className="col-md-6 mb-20">
|
||||
<div className="form-group">
|
||||
<select name="person" id="person">
|
||||
<option value="option1">Person</option>
|
||||
<option value="option2">Person 2</option>
|
||||
<option value="option3">Person 3</option>
|
||||
<option value="option4">Person 4</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-md-6">
|
||||
<div className="form-group">
|
||||
<label htmlFor="date">
|
||||
<i className="far fa-calendar-alt" />
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
id="date"
|
||||
name="date"
|
||||
className="form-control"
|
||||
defaultValue=""
|
||||
placeholder="Date"
|
||||
required=""
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-md-12">
|
||||
<div className="form-group">
|
||||
<label htmlFor="time">
|
||||
<i className="far fa-clock" />
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
id="time"
|
||||
name="time"
|
||||
className="form-control"
|
||||
defaultValue=""
|
||||
placeholder="Time"
|
||||
required=""
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-md-12">
|
||||
<div className="form-group">
|
||||
<label htmlFor="number">
|
||||
<i className="far fa-phone" />
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
id="number"
|
||||
name="number"
|
||||
className="form-control"
|
||||
defaultValue=""
|
||||
placeholder="Phone"
|
||||
required=""
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-md-12">
|
||||
<div className="form-group mb-0">
|
||||
<button type="submit" className="theme-btn">
|
||||
book your table <i className="far fa-arrow-alt-right" />
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
204
components/Burger.js
Normal file
@ -0,0 +1,204 @@
|
||||
"use client";
|
||||
import { sliderProps } from "@/utility/sliderProps";
|
||||
import Link from "next/link";
|
||||
import Slider from "react-slick";
|
||||
|
||||
const Burger = () => {
|
||||
return (
|
||||
<div className="container container-1520">
|
||||
<div className="container">
|
||||
<div className="row justify-content-center">
|
||||
<div className="col-lg-12">
|
||||
<div
|
||||
className="section-title text-center mb-50"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<span className="sub-title mb-5">popular burger</span>
|
||||
<h2>popular delicious burger</h2>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<Slider {...sliderProps.pizzaActive} className="pizza-active">
|
||||
<div
|
||||
className="product-item"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="image">
|
||||
<img src="assets/images/products/burger1.jpg" alt="Burger" />
|
||||
<span className="pizza-badge">hot</span>
|
||||
</div>
|
||||
<div className="content">
|
||||
<div className="ratting">
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<span>(5k)</span>
|
||||
</div>
|
||||
<h5>
|
||||
<Link href="product-details">vegetable beef Burger</Link>
|
||||
</h5>
|
||||
<span className="price">
|
||||
<del>$50</del> $25
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
className="product-item"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={50}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="image">
|
||||
<img src="assets/images/products/burger2.jpg" alt="Burger" />
|
||||
<span className="pizza-badge">-10%</span>
|
||||
</div>
|
||||
<div className="content">
|
||||
<div className="ratting">
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<span>(5k)</span>
|
||||
</div>
|
||||
<h5>
|
||||
<Link href="product-details">beef checken burger</Link>
|
||||
</h5>
|
||||
<span className="price">
|
||||
<del>$50</del> $25
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
className="product-item"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={100}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="image">
|
||||
<img src="assets/images/products/burger3.jpg" alt="Burger" />
|
||||
</div>
|
||||
<div className="content">
|
||||
<div className="ratting">
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<span>(5k)</span>
|
||||
</div>
|
||||
<h5>
|
||||
<Link href="product-details">burgers black bread</Link>
|
||||
</h5>
|
||||
<span className="price">
|
||||
<del>$50</del> $25
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
className="product-item"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={150}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="image">
|
||||
<img src="assets/images/products/burger4.jpg" alt="Burger" />
|
||||
<span className="pizza-badge">new</span>
|
||||
</div>
|
||||
<div className="content">
|
||||
<div className="ratting">
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<span>(5k)</span>
|
||||
</div>
|
||||
<h5>
|
||||
<Link href="product-details">delicious burger with beef</Link>
|
||||
</h5>
|
||||
<span className="price">
|
||||
<del>$50</del> $25
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="product-item">
|
||||
<div className="image">
|
||||
<img src="assets/images/products/burger1.jpg" alt="Burger" />
|
||||
<span className="pizza-badge">hot</span>
|
||||
</div>
|
||||
<div className="content">
|
||||
<div className="ratting">
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<span>(5k)</span>
|
||||
</div>
|
||||
<h5>
|
||||
<Link href="product-details">vegetable beef Burger</Link>
|
||||
</h5>
|
||||
<span className="price">
|
||||
<del>$50</del> $25
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="product-item">
|
||||
<div className="image">
|
||||
<img src="assets/images/products/burger2.jpg" alt="Burger" />
|
||||
<span className="pizza-badge">-10%</span>
|
||||
</div>
|
||||
<div className="content">
|
||||
<div className="ratting">
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<span>(5k)</span>
|
||||
</div>
|
||||
<h5>
|
||||
<Link href="product-details">beef checken burger</Link>
|
||||
</h5>
|
||||
<span className="price">
|
||||
<del>$50</del> $25
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="product-item">
|
||||
<div className="image">
|
||||
<img src="assets/images/products/burger3.jpg" alt="Burger" />
|
||||
</div>
|
||||
<div className="content">
|
||||
<div className="ratting">
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<span>(5k)</span>
|
||||
</div>
|
||||
<h5>
|
||||
<Link href="product-details">burgers black bread</Link>
|
||||
</h5>
|
||||
<span className="price">
|
||||
<del>$50</del> $25
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</Slider>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
export default Burger;
|
||||
117
components/CategoryBanner.js
Normal file
@ -0,0 +1,117 @@
|
||||
import Link from "next/link";
|
||||
|
||||
const CategoryBanner = () => {
|
||||
return (
|
||||
<div className="category-banner-area-two">
|
||||
<div className="container-fluid">
|
||||
<div className="row row-cols-lg-3 row-cols-sm-2 row-cols-1 justify-content-center">
|
||||
<div
|
||||
className="col"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div
|
||||
className="category-banner-item style-two"
|
||||
style={{
|
||||
backgroundImage:
|
||||
"url(assets/images/banner/category-banner-two1.png)",
|
||||
}}
|
||||
>
|
||||
<span className="price">only $59</span>
|
||||
<h3>SPECIALTY Beef steak</h3>
|
||||
<div className="ratting">
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<span>(5k)</span>
|
||||
</div>
|
||||
<Link href="shop" className="theme-btn style-two">
|
||||
Order now <i className="far fa-arrow-alt-right" />
|
||||
</Link>
|
||||
<div className="food-image">
|
||||
<img
|
||||
src="assets/images/banner/category-banner-food1.png"
|
||||
alt="Food"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
className="col"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={50}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div
|
||||
className="category-banner-item style-two color-black"
|
||||
style={{
|
||||
backgroundImage:
|
||||
"url(assets/images/banner/category-banner-two2.png)",
|
||||
}}
|
||||
>
|
||||
<span className="price">only $43</span>
|
||||
<h3>SPECIALTY Italian pizza</h3>
|
||||
<div className="ratting">
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<span>(5k)</span>
|
||||
</div>
|
||||
<Link href="shop" className="theme-btn">
|
||||
Order now <i className="far fa-arrow-alt-right" />
|
||||
</Link>
|
||||
<div className="food-image">
|
||||
<img
|
||||
src="assets/images/banner/category-banner-food2.png"
|
||||
alt="Food"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
className="col"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={100}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div
|
||||
className="category-banner-item style-two"
|
||||
style={{
|
||||
backgroundImage:
|
||||
"url(assets/images/banner/category-banner-two1.png)",
|
||||
}}
|
||||
>
|
||||
<span className="price">only $35</span>
|
||||
<h3>vegetable burger</h3>
|
||||
<div className="ratting">
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<i className="fas fa-star" />
|
||||
<span>(5k)</span>
|
||||
</div>
|
||||
<Link href="shop" className="theme-btn style-two">
|
||||
Order now <i className="far fa-arrow-alt-right" />
|
||||
</Link>
|
||||
<div className="food-image">
|
||||
<img
|
||||
src="assets/images/banner/category-banner-food3.png"
|
||||
alt="Food"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
export default CategoryBanner;
|
||||
207
components/ContactForm.js
Normal file
@ -0,0 +1,207 @@
|
||||
"use client";
|
||||
import { useState, useEffect } from "react";
|
||||
import ReCAPTCHA from "react-google-recaptcha";
|
||||
import axios from "axios";
|
||||
import { BaseUrl } from "@/utility/BaseUrl.utils";
|
||||
|
||||
const ContactForm = () => {
|
||||
const [formData, setFormData] = useState({
|
||||
name: "",
|
||||
email: "",
|
||||
phone_number: "",
|
||||
subject: "",
|
||||
message: "",
|
||||
});
|
||||
|
||||
const [alert, setAlert] = useState({
|
||||
show: false,
|
||||
message: "",
|
||||
type: "",
|
||||
});
|
||||
|
||||
const [captchaToken, setCaptchaToken] = useState(null);
|
||||
|
||||
useEffect(() => {
|
||||
if (alert.show) {
|
||||
const timer = setTimeout(() => {
|
||||
setAlert({ ...alert, show: false });
|
||||
}, 5000);
|
||||
return () => clearTimeout(timer);
|
||||
}
|
||||
}, [alert]);
|
||||
|
||||
const handleChange = (e) => {
|
||||
const { name, value } = e.target;
|
||||
setFormData((prev) => ({ ...prev, [name]: value }));
|
||||
};
|
||||
|
||||
const handleCaptchaChange = (token) => {
|
||||
setCaptchaToken(token);
|
||||
};
|
||||
|
||||
const handleSubmit = async (e) => {
|
||||
e.preventDefault();
|
||||
|
||||
if (!captchaToken) {
|
||||
setAlert({
|
||||
show: true,
|
||||
message: "Please verify the CAPTCHA.",
|
||||
type: "danger",
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
const emailData = {
|
||||
...formData,
|
||||
to: "info@shivasakthi.ca",
|
||||
senderName: "Shivasakthi Restaurant",
|
||||
recaptchaToken: captchaToken,
|
||||
};
|
||||
|
||||
try {
|
||||
const res = await axios.post(BaseUrl, emailData, {
|
||||
headers: {
|
||||
"Content-Type": "application/json",
|
||||
},
|
||||
});
|
||||
|
||||
setAlert({
|
||||
show: true,
|
||||
message: res?.data?.message || "Message sent successfully!",
|
||||
type: "success",
|
||||
});
|
||||
|
||||
setFormData({
|
||||
name: "",
|
||||
email: "",
|
||||
phone_number: "",
|
||||
subject: "",
|
||||
message: "",
|
||||
});
|
||||
setCaptchaToken(null);
|
||||
} catch (error) {
|
||||
setAlert({
|
||||
show: true,
|
||||
message: "Failed to send message. Please try again later.",
|
||||
type: "danger",
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="contact-page-form">
|
||||
<h3>Send Us Message</h3>
|
||||
<p>Your email address will not be published. Required fields are marked *</p>
|
||||
<form id="contactForm" className="contactForm" name="contactForm" onSubmit={handleSubmit}>
|
||||
<div className="row mt-30 gap-20">
|
||||
<div className="col-sm-6">
|
||||
<div className="form-group">
|
||||
<input
|
||||
type="text"
|
||||
id="name"
|
||||
name="name"
|
||||
className="form-control"
|
||||
placeholder="Full Name"
|
||||
required
|
||||
data-error="Please enter your Name"
|
||||
value={formData.name}
|
||||
onChange={handleChange}
|
||||
/>
|
||||
<div className="help-block with-errors" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-sm-6">
|
||||
<div className="form-group">
|
||||
<input
|
||||
type="email"
|
||||
id="email"
|
||||
name="email"
|
||||
className="form-control"
|
||||
placeholder="Email Address"
|
||||
required
|
||||
data-error="Please enter your Email"
|
||||
value={formData.email}
|
||||
onChange={handleChange}
|
||||
/>
|
||||
<div className="help-block with-errors" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-sm-6">
|
||||
<div className="form-group">
|
||||
<input
|
||||
type="text"
|
||||
id="phone_number"
|
||||
name="phone_number"
|
||||
className="form-control"
|
||||
placeholder="Phone"
|
||||
required
|
||||
data-error="Please enter your Phone No"
|
||||
value={formData.phone_number}
|
||||
onChange={handleChange}
|
||||
/>
|
||||
<div className="help-block with-errors" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-sm-6">
|
||||
<div className="form-group">
|
||||
<input
|
||||
type="text"
|
||||
id="subject"
|
||||
name="subject"
|
||||
className="form-control"
|
||||
placeholder="Subject"
|
||||
required
|
||||
data-error="Please enter your Subject"
|
||||
value={formData.subject}
|
||||
onChange={handleChange}
|
||||
/>
|
||||
<div className="help-block with-errors" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-sm-12">
|
||||
<div className="form-group">
|
||||
<textarea
|
||||
name="message"
|
||||
id="message"
|
||||
className="form-control"
|
||||
rows={4}
|
||||
placeholder="Write Message"
|
||||
required
|
||||
data-error="Please enter your Message"
|
||||
value={formData.message}
|
||||
onChange={handleChange}
|
||||
/>
|
||||
<div className="help-block with-errors" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-sm-12 mt-3 mb-3">
|
||||
<ReCAPTCHA
|
||||
sitekey="6Lfi9o4rAAAAAOatjscl4m4UaOA7_g_rFBHOaf5n"
|
||||
onChange={handleCaptchaChange}
|
||||
/>
|
||||
</div>
|
||||
<div className="col-sm-12">
|
||||
<div className="form-group mb-0">
|
||||
<button type="submit" className="theme-btn">
|
||||
Send Message Us <i className="far fa-arrow-alt-right" />
|
||||
</button>
|
||||
<div id="msgSubmit" className="hidden" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
{alert.show && (
|
||||
<div className={`alert alert-${alert.type} alert-dismissible fade show`} role="alert">
|
||||
{alert.message}
|
||||
<button
|
||||
type="button"
|
||||
className="btn-close"
|
||||
onClick={() => setAlert({ ...alert, show: false })}
|
||||
></button>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default ContactForm;
|
||||
27
components/Counter.js
Normal file
@ -0,0 +1,27 @@
|
||||
"use client";
|
||||
import CountUp from "react-countup";
|
||||
import ReactVisibilitySensor from "react-visibility-sensor";
|
||||
const Counter = ({ end, decimals, extraClass }) => {
|
||||
return (
|
||||
<CountUp
|
||||
end={end ? end : 100}
|
||||
duration={3}
|
||||
decimals={decimals ? decimals : 0}
|
||||
>
|
||||
{({ countUpRef, start }) => (
|
||||
<ReactVisibilitySensor onChange={start} delayedCall>
|
||||
<span
|
||||
className={`${extraClass}`}
|
||||
data-from="0"
|
||||
data-to={end}
|
||||
ref={countUpRef}
|
||||
>
|
||||
count
|
||||
</span>
|
||||
</ReactVisibilitySensor>
|
||||
)}
|
||||
</CountUp>
|
||||
);
|
||||
};
|
||||
|
||||
export default Counter;
|
||||
84
components/FoodCategory.js
Normal file
@ -0,0 +1,84 @@
|
||||
import Link from "next/link";
|
||||
|
||||
const FoodCategory = () => {
|
||||
return (
|
||||
<section className="food-category-area pb-90 rpb-65 rel z-1">
|
||||
<div className="container">
|
||||
<div className="row justify-content-center">
|
||||
<div className="col-xxl-6 col-xl-7 col-lg-9">
|
||||
<div
|
||||
className="section-title text-center mb-50"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<span className="sub-title mb-5">popular food category</span>
|
||||
<h2>
|
||||
we provide amazing & Quality food for your good health
|
||||
</h2>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="row justify-content-center">
|
||||
<div
|
||||
className="col-xl-4 col-md-6"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="featured-item">
|
||||
<div className="icon">
|
||||
<i className="flaticon-recommended-food" />
|
||||
</div>
|
||||
<div className="content">
|
||||
<h4>
|
||||
<Link href="menu-restaurant">Best Quality Food</Link>
|
||||
</h4>
|
||||
<p>Sed ut perspiciatis unde omnis este natus sit voluptatem</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
className="col-xl-4 col-md-6"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={50}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="featured-item">
|
||||
<div className="icon">
|
||||
<i className="flaticon-fast-delivery" />
|
||||
</div>
|
||||
<div className="content">
|
||||
<h4>
|
||||
<Link href="menu-restaurant">fast food delivery</Link>
|
||||
</h4>
|
||||
<p>Sed ut perspiciatis unde omnis este natus sit voluptatem</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
className="col-xl-4 col-md-6"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={100}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="featured-item">
|
||||
<div className="icon">
|
||||
<i className="flaticon-cashback" />
|
||||
</div>
|
||||
<div className="content">
|
||||
<h4>
|
||||
<Link href="menu-restaurant">money back guarantee</Link>
|
||||
</h4>
|
||||
<p>Sed ut perspiciatis unde omnis este natus sit voluptatem</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
};
|
||||
export default FoodCategory;
|
||||
214
components/GalleryIsotope.js
Normal file
@ -0,0 +1,214 @@
|
||||
"use client";
|
||||
import Isotope from "isotope-layout";
|
||||
import { Fragment, useEffect, useRef, useState } from "react";
|
||||
const GalleryIsotope = () => {
|
||||
const isotope = useRef();
|
||||
const [filterKey, setFilterKey] = useState("*");
|
||||
useEffect(() => {
|
||||
setTimeout(() => {
|
||||
isotope.current = new Isotope(".gallery-active", {
|
||||
itemSelector: ".item",
|
||||
percentPosition: true,
|
||||
masonry: {
|
||||
columnWidth: ".item",
|
||||
},
|
||||
animationOptions: {
|
||||
duration: 750,
|
||||
easing: "linear",
|
||||
queue: false,
|
||||
},
|
||||
});
|
||||
}, 500);
|
||||
}, []);
|
||||
useEffect(() => {
|
||||
if (isotope.current) {
|
||||
filterKey === "*"
|
||||
? isotope.current.arrange({ filter: `*` })
|
||||
: isotope.current.arrange({ filter: `.${filterKey}` });
|
||||
}
|
||||
}, [filterKey]);
|
||||
const handleFilterKeyChange = (key) => () => {
|
||||
setFilterKey(key);
|
||||
};
|
||||
const activeBtn = (value) => (value === filterKey ? "active" : "");
|
||||
return (
|
||||
<Fragment>
|
||||
<ul
|
||||
className="nav gallery-nav food-menu-tab mb-40"
|
||||
role="tablist"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={50}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<li>
|
||||
<button
|
||||
className={`nav-link ${activeBtn("*")}`}
|
||||
onClick={handleFilterKeyChange("*")}
|
||||
data-filter="*"
|
||||
>
|
||||
<i className="flaticon-cupcake" />
|
||||
<span>dessert</span>
|
||||
</button>
|
||||
</li>
|
||||
<li>
|
||||
<button
|
||||
className={`nav-link ${activeBtn("vegetarian")}`}
|
||||
onClick={handleFilterKeyChange("vegetarian")}
|
||||
data-filter=".vegetarian"
|
||||
>
|
||||
<i className="flaticon-broccoli" />
|
||||
<span>vegetarian</span>
|
||||
</button>
|
||||
</li>
|
||||
<li>
|
||||
<button
|
||||
className={`nav-link ${activeBtn("potatoes")}`}
|
||||
onClick={handleFilterKeyChange("potatoes")}
|
||||
data-filter=".potatoes"
|
||||
>
|
||||
<i className="flaticon-fried-potatoes" />
|
||||
<span>potatoes</span>
|
||||
</button>
|
||||
</li>
|
||||
<li>
|
||||
<button
|
||||
className={`nav-link ${activeBtn("seafood")}`}
|
||||
onClick={handleFilterKeyChange("seafood")}
|
||||
data-filter=".seafood"
|
||||
>
|
||||
<i className="flaticon-crab" />
|
||||
<span>seafood</span>
|
||||
</button>
|
||||
</li>
|
||||
<li>
|
||||
<button
|
||||
className={`nav-link ${activeBtn("drinks")}`}
|
||||
onClick={handleFilterKeyChange("drinks")}
|
||||
data-filter=".drinks"
|
||||
>
|
||||
<i className="flaticon-poinsettia" />
|
||||
<span>drinks</span>
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
<div className="row gallery-active">
|
||||
<div className="col-lg-4 col-sm-6 item potatoes">
|
||||
<div
|
||||
className="gallery-item-three"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<img src="assets/images/gallery/gallery-three1.jpg" alt="Gallery" />
|
||||
<h3>Chicken burger</h3>
|
||||
<span className="category">Delicious food</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-4 col-sm-6 item vegetarian drinks">
|
||||
<div
|
||||
className="gallery-item-three"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={50}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<img src="assets/images/gallery/gallery-three2.jpg" alt="Gallery" />
|
||||
<h3>yamee Chicken fry</h3>
|
||||
<span className="category">Delicious food</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-4 col-sm-6 item seafood">
|
||||
<div
|
||||
className="gallery-item-three"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={100}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<img src="assets/images/gallery/gallery-three3.jpg" alt="Gallery" />
|
||||
<h3>beef vegetable hot dog</h3>
|
||||
<span className="category">Delicious food</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-4 col-sm-6 item potatoes drinks">
|
||||
<div
|
||||
className="gallery-item-three"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<img src="assets/images/gallery/gallery-three4.jpg" alt="Gallery" />
|
||||
<h3>hot dog with mustard</h3>
|
||||
<span className="category">Delicious food</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-4 col-sm-6 item vegetarian">
|
||||
<div
|
||||
className="gallery-item-three"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={50}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<img src="assets/images/gallery/gallery-three5.jpg" alt="Gallery" />
|
||||
<h3>traditional Italian pizza</h3>
|
||||
<span className="category">Delicious food</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-4 col-sm-6 item seafood drinks">
|
||||
<div
|
||||
className="gallery-item-three"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={100}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<img src="assets/images/gallery/gallery-three6.jpg" alt="Gallery" />
|
||||
<h3>Chicken burger</h3>
|
||||
<span className="category">Delicious food</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-4 col-sm-6 item potatoes">
|
||||
<div
|
||||
className="gallery-item-three"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<img src="assets/images/gallery/gallery-three7.jpg" alt="Gallery" />
|
||||
<h3>Chicken burger</h3>
|
||||
<span className="category">Delicious food</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-4 col-sm-6 item vegetarian drinks">
|
||||
<div
|
||||
className="gallery-item-three"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={50}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<img src="assets/images/gallery/gallery-three8.jpg" alt="Gallery" />
|
||||
<h3>Chicken burger</h3>
|
||||
<span className="category">Delicious food</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-4 col-sm-6 item seafood drinks">
|
||||
<div
|
||||
className="gallery-item-three"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={100}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<img src="assets/images/gallery/gallery-three9.jpg" alt="Gallery" />
|
||||
<h3>Chicken burger</h3>
|
||||
<span className="category">Delicious food</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</Fragment>
|
||||
);
|
||||
};
|
||||
export default GalleryIsotope;
|
||||
59
components/Headline.js
Normal file
@ -0,0 +1,59 @@
|
||||
const Headline = ({ mb = "105" }) => {
|
||||
return (
|
||||
<div className={`headline-area mb-${mb} rmb-85 rel z-1`}>
|
||||
<span className="marquee-wrap">
|
||||
<span className="marquee-inner left">
|
||||
<span className="marquee-item">Italian pizza</span>
|
||||
<span className="marquee-item">
|
||||
<i className="flaticon-star" />
|
||||
</span>
|
||||
<span className="marquee-item">delicious foods</span>
|
||||
<span className="marquee-item">
|
||||
<i className="flaticon-star" />
|
||||
</span>
|
||||
<span className="marquee-item">burger king</span>
|
||||
<span className="marquee-item">
|
||||
<i className="flaticon-star" />
|
||||
</span>
|
||||
</span>
|
||||
<span className="marquee-inner left">
|
||||
<span className="marquee-item">Italian pizza</span>
|
||||
<span className="marquee-item">
|
||||
<i className="flaticon-star" />
|
||||
</span>
|
||||
<span className="marquee-item">delicious foods</span>
|
||||
<span className="marquee-item">
|
||||
<i className="flaticon-star" />
|
||||
</span>
|
||||
<span className="marquee-item">burger king</span>
|
||||
<span className="marquee-item">
|
||||
<i className="flaticon-star" />
|
||||
</span>
|
||||
</span>
|
||||
<span className="marquee-inner left">
|
||||
<span className="marquee-item">Italian pizza</span>
|
||||
<span className="marquee-item">
|
||||
<i className="flaticon-star" />
|
||||
</span>
|
||||
<span className="marquee-item">delicious foods</span>
|
||||
<span className="marquee-item">
|
||||
<i className="flaticon-star" />
|
||||
</span>
|
||||
<span className="marquee-item">burger king</span>
|
||||
<span className="marquee-item">
|
||||
<i className="flaticon-star" />
|
||||
</span>
|
||||
</span>
|
||||
</span>
|
||||
<div className="headline-shapes">
|
||||
<div className="shape one">
|
||||
<img src="assets/images/shapes/tomato.png" alt="Shape" />
|
||||
</div>
|
||||
<div className="shape two">
|
||||
<img src="assets/images/shapes/burger.png" alt="Shape" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
export default Headline;
|
||||
94
components/HomeCounterSection.js
Normal file
@ -0,0 +1,94 @@
|
||||
"use client"
|
||||
import Counter from "@/components/Counter";
|
||||
|
||||
const HomeCounterSection = () => {
|
||||
return (
|
||||
<div
|
||||
className="counter-area-four bgs-cover pt-100"
|
||||
style={{ backgroundImage: "url(/assets/images/home/bg-image.jpg)" }}
|
||||
>
|
||||
<div className="container">
|
||||
<div className="row justify-content-end">
|
||||
<div className="col-xl-7 col-lg-9">
|
||||
<div className="row no-gap">
|
||||
|
||||
<div className="col-lg-4 col-sm-6">
|
||||
<div
|
||||
className="counter-item style-four bgc-secondary counter-text-wrap"
|
||||
data-aos="fade-down"
|
||||
data-aos-delay={50}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<span
|
||||
className="count-text plus"
|
||||
data-speed={3000}
|
||||
data-stop={20}
|
||||
>
|
||||
<Counter end={20} />
|
||||
</span>
|
||||
<div className="wave">
|
||||
<img
|
||||
src="/assets/images/shapes/counter-wave.png"
|
||||
alt="Shape"
|
||||
/>
|
||||
</div>
|
||||
<h6 className="counter-title">Experience Chefs</h6>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-4 col-sm-6">
|
||||
<div
|
||||
className="counter-item text-white style-four counter-text-wrap"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50} style={{ backgroundColor: "#222222" }}
|
||||
>
|
||||
<span
|
||||
className="count-text k-plus"
|
||||
data-speed={3000}
|
||||
data-stop={2}
|
||||
>
|
||||
<Counter end={2} />
|
||||
</span>
|
||||
<div className="wave">
|
||||
<img
|
||||
src="/assets/images/shapes/counter-wave-white.png"
|
||||
alt="Shape"
|
||||
/>
|
||||
</div>
|
||||
<h6 className="counter-title">Happy Customers</h6>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-4 col-sm-6">
|
||||
<div
|
||||
className="counter-item style-four bgc-primary counter-text-wrap"
|
||||
data-aos="fade-down"
|
||||
data-aos-delay={100}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<span
|
||||
className="count-text plus"
|
||||
data-speed={3000}
|
||||
data-stop={40}
|
||||
>
|
||||
<Counter end={40} />
|
||||
</span>
|
||||
<div className="wave">
|
||||
<img
|
||||
src="/assets/images/shapes/counter-wave.png"
|
||||
alt="Shape"
|
||||
/>
|
||||
</div>
|
||||
<h6 className="counter-title">Favorite Dishes</h6>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
export default HomeCounterSection;
|
||||
|
||||
53
components/InstagramArea.js
Normal file
@ -0,0 +1,53 @@
|
||||
import Slider from "react-slick";
|
||||
|
||||
|
||||
const instagramData = [
|
||||
{ id: 1, image: "/assets/images/home/bottom/1.webp" },
|
||||
{ id: 2, image: "/assets/images/home/bottom/2.webp" },
|
||||
{ id: 3, image: "/assets/images/home/bottom/3.webp" },
|
||||
{ id: 4, image: "/assets/images/home/bottom/4.webp" },
|
||||
{ id: 5, image: "/assets/images/home/bottom/5.webp" },
|
||||
];
|
||||
|
||||
const InstagramArea = () => {
|
||||
return (
|
||||
<div className="instagram-area">
|
||||
<Slider
|
||||
dots={false}
|
||||
arrows={false}
|
||||
infinite={true}
|
||||
speed={500}
|
||||
slidesToShow={5}
|
||||
slidesToScroll={1}
|
||||
autoplay={true}
|
||||
autoplaySpeed={2500}
|
||||
responsive={[
|
||||
{ breakpoint: 1400, settings: { slidesToShow: 5 } },
|
||||
{ breakpoint: 1200, settings: { slidesToShow: 4 } },
|
||||
{ breakpoint: 992, settings: { slidesToShow: 3 } },
|
||||
{ breakpoint: 576, settings: { slidesToShow: 3 } },
|
||||
{ breakpoint: 0, settings: { slidesToShow: 1 } },
|
||||
]}
|
||||
>
|
||||
{instagramData.map((item, index) => (
|
||||
<div
|
||||
key={item.id}
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={index * 50}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="instagram-item">
|
||||
<img src={item.image} alt={`Instagram ${item.id}`} />
|
||||
{/* <a href={item.image}>
|
||||
<i className="fab fa-instagram" />
|
||||
</a> */}
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</Slider>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default InstagramArea;
|
||||
24
components/MenuIframe.js
Normal file
@ -0,0 +1,24 @@
|
||||
|
||||
const MenuIframe=()=>{
|
||||
return(
|
||||
<section className="contact-page-area pb-100">
|
||||
<div className="container-fluid">
|
||||
<div className="row align-items-center">
|
||||
<div
|
||||
className="our-location"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div style={{position:"relative", paddingTop:"max(60%,324px)", width:"100%", height:"0px"}}><iframe style={{position:"absolute", border:"none", width:"100%", height:"100%", left:"0", top:"0"}} src="https://online.fliphtml5.com/fgssp/kwnq/" seamless="seamless" scrolling="no" frameborder="0" allowtransparency="true" allowfullscreen="true" ></iframe></div>
|
||||
|
||||
{/* <iframe src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d369174.37626170606!2d-79.647352!3d43.706916!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x882b3bfed533002b%3A0xe83c1cd7caca2ee6!2s7166%20Airport%20Rd%2C%20Mississauga%2C%20ON%20L4T%202H2%2C%20Canada!5e0!3m2!1sen!2sus!4v1748536731832!5m2!1sen!2sus" style={{ border: 0, width: "100%" }}
|
||||
allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe> */}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
|
||||
}
|
||||
export default MenuIframe;
|
||||
108
components/OfferCard.js
Normal file
@ -0,0 +1,108 @@
|
||||
const OfferCard = () => {
|
||||
return (
|
||||
<div className="offer-card-area">
|
||||
<div className="row no-gap row-cols-xxl-5 row-cols-xl-4 row-cols-lg-3 row-cols-sm-2 row-cols-1 justify-content-center">
|
||||
<div
|
||||
className="col"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="offer-card-item">
|
||||
<img src="assets/images/offer/good-food.png" alt="Good Food" />
|
||||
<div className="badge">Hot</div>
|
||||
<div className="image">
|
||||
<img src="assets/images/offer/offer-card1.png" alt="Food" />
|
||||
</div>
|
||||
<span className="title">Burger</span>
|
||||
<span className="available-item">35+ Burger menu items</span>
|
||||
<div className="bg-text">
|
||||
<span>Burger</span> <span>Burger</span> <span>Burger</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
className="col"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={50}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="offer-card-item style-two">
|
||||
<img src="assets/images/offer/good-food.png" alt="Good Food" />
|
||||
<div className="badge">-10%</div>
|
||||
<div className="image">
|
||||
<img src="assets/images/offer/offer-card2.png" alt="Food" />
|
||||
</div>
|
||||
<span className="title">Pizza</span>
|
||||
<span className="available-item">35+ Burger menu items</span>
|
||||
<div className="bg-text">
|
||||
<span>Pizza</span> <span>Pizza</span> <span>Pizza</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
className="col"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={100}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="offer-card-item">
|
||||
<img src="assets/images/offer/good-food.png" alt="Good Food" />
|
||||
<div className="badge">Hot</div>
|
||||
<div className="image">
|
||||
<img src="assets/images/offer/offer-card3.png" alt="Food" />
|
||||
</div>
|
||||
<span className="title">hotdog</span>
|
||||
<span className="available-item">35+ Burger menu items</span>
|
||||
<div className="bg-text">
|
||||
<span>hotdog</span> <span>hotdog</span> <span>hotdog</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
className="col"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={150}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="offer-card-item style-two">
|
||||
<img src="assets/images/offer/good-food.png" alt="Good Food" />
|
||||
<div className="badge">-15%</div>
|
||||
<div className="image">
|
||||
<img src="assets/images/offer/offer-card4.png" alt="Food" />
|
||||
</div>
|
||||
<span className="title">chickens</span>
|
||||
<span className="available-item">35+ Burger menu items</span>
|
||||
<div className="bg-text">
|
||||
<span>chickens</span> <span>chickens</span> <span>chickens</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
className="col"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={200}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="offer-card-item">
|
||||
<img src="assets/images/offer/good-food.png" alt="Good Food" />
|
||||
<div className="badge">Hot</div>
|
||||
<div className="image">
|
||||
<img src="assets/images/offer/offer-card5.png" alt="Food" />
|
||||
</div>
|
||||
<span className="title">seafood</span>
|
||||
<span className="available-item">35+ Burger menu items</span>
|
||||
<div className="bg-text">
|
||||
<span>seafood</span> <span>seafood</span> <span>seafood</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
export default OfferCard;
|
||||
41
components/PageBanner.js
Normal file
@ -0,0 +1,41 @@
|
||||
import Link from "next/link";
|
||||
|
||||
const PageBanner = ({ pageTitle, pageName, background }) => {
|
||||
return (
|
||||
<section
|
||||
className="page-banner-area overlay pt-215 rpt-150 pb-160 rpb-120 rel z-1 bgs-cover text-center"
|
||||
style={{ backgroundImage: `url(${background})` }}
|
||||
|
||||
>
|
||||
<div className="container">
|
||||
<div className="banner-inner text-white">
|
||||
<h1
|
||||
className="page-title"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
{pageTitle}
|
||||
</h1>
|
||||
<nav aria-label="breadcrumb">
|
||||
<ol
|
||||
className="breadcrumb justify-content-center"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={200}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<li className="breadcrumb-item">
|
||||
<Link href="/">Home</Link>
|
||||
</li>
|
||||
<li className="breadcrumb-item active">
|
||||
{pageName ? pageName : pageTitle}
|
||||
</li>
|
||||
</ol>
|
||||
</nav>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
};
|
||||
export default PageBanner;
|
||||
27
components/PlusMinusBtn.js
Normal file
@ -0,0 +1,27 @@
|
||||
"use client";
|
||||
import { memo, useState } from "react";
|
||||
|
||||
const PlusMinusBtn = () => {
|
||||
const [value, setValue] = useState(1);
|
||||
return (
|
||||
<div className="quantity-input">
|
||||
<button
|
||||
className="quantity-down"
|
||||
onClick={() => setValue(value == 1 ? 1 : value - 1)}
|
||||
>
|
||||
--
|
||||
</button>
|
||||
<input
|
||||
className="quantity"
|
||||
type="text"
|
||||
defaultValue={1}
|
||||
value={value}
|
||||
name="quantity"
|
||||
/>
|
||||
<button className="quantity-up" onClick={() => setValue(value + 1)}>
|
||||
+
|
||||
</button>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
export default memo(PlusMinusBtn);
|
||||
19
components/ProgressBar.js
Normal file
@ -0,0 +1,19 @@
|
||||
"use client";
|
||||
import { buildStyles, CircularProgressbar } from "react-circular-progressbar";
|
||||
|
||||
const ProgressBar = ({ value, color, extraCls, emptyFill }) => {
|
||||
return (
|
||||
<div className={`canvas ${extraCls ? extraCls : "one"}`}>
|
||||
<CircularProgressbar
|
||||
width={120}
|
||||
value={value}
|
||||
strokeWidth={3}
|
||||
styles={buildStyles({
|
||||
pathColor: color ? color : "#EC3D08",
|
||||
trailColor: emptyFill ? emptyFill : "#FBDDD5",
|
||||
})}
|
||||
/>{" "}
|
||||
</div>
|
||||
);
|
||||
};
|
||||
export default ProgressBar;
|
||||
1846
components/RestaurantMenu.js
Normal file
113
components/Testimonial.js
Normal file
@ -0,0 +1,113 @@
|
||||
"use client";
|
||||
import { sliderProps } from "@/utility/sliderProps";
|
||||
import Slider from "react-slick";
|
||||
|
||||
const Testimonial = () => {
|
||||
return (
|
||||
<section
|
||||
className="testimonials-two bgc-primary"
|
||||
style={{
|
||||
backgroundImage:
|
||||
"url(assets/images/testimonials/testimonials-two-bg.png)",
|
||||
}}
|
||||
>
|
||||
<div className="row align-items-center">
|
||||
<div className="col-lg-6">
|
||||
<div className="why-choose-two-image">
|
||||
<img
|
||||
src="/assets/images/home/home-testi.webp"
|
||||
alt="Testimonials" loading="lazy"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-6">
|
||||
<div className="testimonials-two-content rel z-1 text-center text-white p-45 rpy-55">
|
||||
<div
|
||||
className="section-title mb-20"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<span className="sub-title mb-5">customer feedback</span>
|
||||
<h2>what have lot’s off happy customer explore feedback</h2>
|
||||
</div>
|
||||
<span className="marquee-wrap style-two">
|
||||
<span className="marquee-inner left">review </span>
|
||||
<span className="marquee-inner left">review </span>
|
||||
<span className="marquee-inner left">review </span>
|
||||
</span>
|
||||
<Slider
|
||||
{...sliderProps.testimonialsTwoCarousel}
|
||||
className="testimonials-two-carousel"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={50}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="testimonial-two-item">
|
||||
<div className="ratting">
|
||||
<i className="fas fa-star text-white" />
|
||||
<i className="fas fa-star text-white" />
|
||||
<i className="fas fa-star text-white" />
|
||||
<i className="fas fa-star text-white" />
|
||||
<i className="fas fa-star text-white" />
|
||||
</div>
|
||||
<div className="text">
|
||||
Visited this beautiful restaurant while nearby for a conference. The staff were welcoming from the very start! We started with the Gobi 65 which had light spice but a to. Of flavour. Then, we had the hakka noodles, masala dosa and chettinadu chicken curry which was so tasty. Our Server Gagan recommended it and I’m glad he did. He was fantastic and if we are in town again, we will definitely return!
|
||||
</div>
|
||||
<span className="author">Cam Larocque</span>
|
||||
{/* <span className="designation">Manager</span> */}
|
||||
</div>
|
||||
<div className="testimonial-two-item">
|
||||
<div className="ratting">
|
||||
<i className="fas fa-star text-white" />
|
||||
<i className="fas fa-star text-white" />
|
||||
<i className="fas fa-star text-white" />
|
||||
<i className="fas fa-star text-white" />
|
||||
<i className="fas fa-star text-white" />
|
||||
</div>
|
||||
<div className="text">
|
||||
Good to have another new south india cuisine in GTA. The food was amazing, The service was good and fast, thanks for offering the milk burfi for tasting.
|
||||
I have been to their other restaurant locations in GTA and KW area, the service and food was excellent. All the best for this new location. Must visit for guys looking to try south indian Biryani.
|
||||
</div>
|
||||
<span className="author">Sen K</span>
|
||||
{/* <span className="designation">Manager</span> */}
|
||||
</div>
|
||||
<div className="testimonial-two-item">
|
||||
<div className="ratting mb-3">
|
||||
<i className="fas fa-star text-white" />
|
||||
<i className="fas fa-star text-white" />
|
||||
<i className="fas fa-star text-white" />
|
||||
<i className="fas fa-star text-white" />
|
||||
<i className="fas fa-star text-white" />
|
||||
</div>
|
||||
<div className="text">
|
||||
Absolutely incredible experience! This Tamil restaurant is a hidden gem in Canada. The flavors are rich, authentic, and remind me of home. Each dish was perfectly spiced and cooked to perfection. The staff were warm, welcoming, and attentive, making the whole visit even more enjoyable. The ambiance is cozy yet vibrant, and you can tell they take pride in both their food and service. Highly recommend to anyone looking for a true taste of South Indian cuisine!
|
||||
</div>
|
||||
<span className="author">manimala s</span>
|
||||
{/* <span className="designation">Manager</span> */}
|
||||
</div>
|
||||
{/* <div className="testimonial-two-item">
|
||||
<div className="quote">
|
||||
<i className="flaticon-quote" />
|
||||
</div>
|
||||
<div className="text">
|
||||
Renowned for its versatility in the kitchen, Red King Crab can
|
||||
prepared in various ways, from simple steaming or boiling to
|
||||
elaborate preparations such as grilling incorporating weather
|
||||
loving
|
||||
</div>
|
||||
<span className="author">Salvador I. Burton</span>
|
||||
<span className="designation">Manager</span>
|
||||
</div> */}
|
||||
</Slider>
|
||||
<div className="shape">
|
||||
<img src="assets/images/shapes/tomato.png" alt="Shape" loading="lazy" />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
};
|
||||
export default Testimonial;
|
||||
311
components/TestimonialSlider.js
Normal file
@ -0,0 +1,311 @@
|
||||
"use client";
|
||||
import { sliderProps } from "@/utility/sliderProps";
|
||||
import { useEffect, useState } from "react";
|
||||
import Slider from "react-slick";
|
||||
|
||||
function TestimonialSlider() {
|
||||
const [nav1, setNav1] = useState(null);
|
||||
const [nav2, setNav2] = useState(null);
|
||||
const [slider1, setSlider1] = useState(null);
|
||||
const [slider2, setSlider2] = useState(null);
|
||||
useEffect(() => {
|
||||
setNav1(slider1);
|
||||
setNav2(slider2);
|
||||
});
|
||||
|
||||
const thumbs = {
|
||||
dots: false,
|
||||
arrows: false,
|
||||
speed: 800,
|
||||
autoplay: true,
|
||||
focusOnSelect: true,
|
||||
slidesToShow: 3,
|
||||
slidesToScroll: 1,
|
||||
};
|
||||
const slider = {
|
||||
arrows: false,
|
||||
dots: false,
|
||||
infinite: false,
|
||||
autoplay: true,
|
||||
speed: 500,
|
||||
fade: true,
|
||||
slidesToShow: 1,
|
||||
slidesToScroll: 1,
|
||||
};
|
||||
|
||||
return (
|
||||
<section className="testimonials-five rel z-1 bgc-lighter py-130 rpy-100">
|
||||
<div className="container rel">
|
||||
<div className="row text-center justify-content-center">
|
||||
<div className="col-xl-6 col-lg-7 col-md-8">
|
||||
<div
|
||||
className="section-title mb-50"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<span className="sub-title mb-5">Customer Feedback</span>
|
||||
<h2>We’ve Lot’s off Happy Customer Explore Our Feedback</h2>
|
||||
</div>
|
||||
<Slider
|
||||
asNavFor={nav1}
|
||||
ref={(slider) => setSlider2(slider)}
|
||||
{...sliderProps.testimonialsFiveAuthors}
|
||||
className="testimonials-five-authors mb-20"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={50}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="testimonial-five-author-item">
|
||||
<img
|
||||
src="assets/images/testimonials/testi-author-five1.jpg"
|
||||
alt="Author"
|
||||
/>
|
||||
</div>
|
||||
<div className="testimonial-five-author-item">
|
||||
<img
|
||||
src="assets/images/testimonials/testi-author-five2.jpg"
|
||||
alt="Author"
|
||||
/>
|
||||
</div>
|
||||
<div className="testimonial-five-author-item">
|
||||
<img
|
||||
src="assets/images/testimonials/testi-author-five3.jpg"
|
||||
alt="Author"
|
||||
/>
|
||||
</div>
|
||||
<div className="testimonial-five-author-item">
|
||||
<img
|
||||
src="assets/images/testimonials/testi-author-five2.jpg"
|
||||
alt="Author"
|
||||
/>
|
||||
</div>
|
||||
</Slider>
|
||||
<Slider
|
||||
className="testimonials-five-content"
|
||||
asNavFor={nav2}
|
||||
ref={(slider) => setSlider1(slider)}
|
||||
{...sliderProps.testimonialsFiveContent}
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={100}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="testimonial-five-item">
|
||||
<div className="text">
|
||||
Renowned for its versatility in the kitchen Red can prepared
|
||||
various ways from simple steaming boiling to elaborate
|
||||
preparations such
|
||||
</div>
|
||||
<span className="author">Salvador I. Burton</span>
|
||||
<span className="designation">Manager</span>
|
||||
</div>
|
||||
<div className="testimonial-five-item">
|
||||
<div className="text">
|
||||
From simple steaming boiling to elaborate preparations such
|
||||
Renowned for its versatility in the kitchen Red can prepared
|
||||
various ways
|
||||
</div>
|
||||
<span className="author">Salvador I. Burton</span>
|
||||
<span className="designation">Manager</span>
|
||||
</div>
|
||||
<div className="testimonial-five-item">
|
||||
<div className="text">
|
||||
Renowned for its steaming boiling to elaborate preparations
|
||||
suchver satility in the kitchen Red can prepared various ways
|
||||
from simple{" "}
|
||||
</div>
|
||||
<span className="author">Salvador I. Burton</span>
|
||||
<span className="designation">Manager</span>
|
||||
</div>
|
||||
<div className="testimonial-five-item">
|
||||
<div className="text">
|
||||
Elaborate preparations such renowned for its versatility in
|
||||
the kitchen Red can prepared various ways from simple steaming
|
||||
boiling to
|
||||
</div>
|
||||
<span className="author">Salvador I. Burton</span>
|
||||
<span className="designation">Manager</span>
|
||||
</div>
|
||||
</Slider>
|
||||
</div>
|
||||
</div>
|
||||
<div className="testimonials-five-shapes">
|
||||
<div
|
||||
className="shape left"
|
||||
data-aos="fade-left"
|
||||
data-aos-delay={150}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<img
|
||||
src="assets/images/testimonials/testi-five-left.png"
|
||||
alt="Left"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
className="shape right"
|
||||
data-aos="fade-right"
|
||||
data-aos-delay={150}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<img
|
||||
src="assets/images/testimonials/testi-five-right.png"
|
||||
alt="Left"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="testimonials-shapes">
|
||||
<div className="shape one">
|
||||
<img
|
||||
src="assets/images/testimonials/testi-five-shape3.png"
|
||||
alt="Shape"
|
||||
/>
|
||||
</div>
|
||||
<div className="shape three">
|
||||
<img
|
||||
src="assets/images/testimonials/testi-five-shape1.png"
|
||||
alt="Shape"
|
||||
/>
|
||||
</div>
|
||||
<div className="shape four">
|
||||
<img
|
||||
src="assets/images/testimonials/testi-five-shape2.png"
|
||||
alt="Shape"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
}
|
||||
|
||||
export default TestimonialSlider;
|
||||
|
||||
export const TestimonialSlider2 = () => {
|
||||
return (
|
||||
<Slider {...sliderProps.testimonialsActive} className="testimonials-active">
|
||||
<div
|
||||
className="testimonial-item"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="quote">
|
||||
<i className="flaticon-quote" />
|
||||
</div>
|
||||
<div className="text">
|
||||
Renowned for its versatility in the kitchen, Red King Crab can be
|
||||
prepared in various ways, from simple steaming or boiling to elaborate
|
||||
preparations such as grilling incorporating
|
||||
</div>
|
||||
<div className="author">
|
||||
<img src="assets/images/testimonials/author1.jpg" alt="Author" />
|
||||
<div className="description">
|
||||
<h5>Steven H. Paxson</h5>
|
||||
<span>CEO & Founder</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
className="testimonial-item"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={50}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="quote">
|
||||
<i className="flaticon-quote" />
|
||||
</div>
|
||||
<div className="text">
|
||||
Renowned for its versatility in the kitchen, Red King Crab can be
|
||||
prepared in various ways, from simple steaming or boiling to elaborate
|
||||
preparations such as grilling incorporating
|
||||
</div>
|
||||
<div className="author">
|
||||
<img src="assets/images/testimonials/author2.jpg" alt="Author" />
|
||||
<div className="description">
|
||||
<h5>Steven H. Paxson</h5>
|
||||
<span>CEO & Founder</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
className="testimonial-item"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={100}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="quote">
|
||||
<i className="flaticon-quote" />
|
||||
</div>
|
||||
<div className="text">
|
||||
Renowned for its versatility in the kitchen, Red King Crab can be
|
||||
prepared in various ways, from simple steaming or boiling to elaborate
|
||||
preparations such as grilling incorporating
|
||||
</div>
|
||||
<div className="author">
|
||||
<img src="assets/images/testimonials/author3.jpg" alt="Author" />
|
||||
<div className="description">
|
||||
<h5>Steven H. Paxson</h5>
|
||||
<span>CEO & Founder</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="testimonial-item">
|
||||
<div className="quote">
|
||||
<i className="flaticon-quote" />
|
||||
</div>
|
||||
<div className="text">
|
||||
Renowned for its versatility in the kitchen, Red King Crab can be
|
||||
prepared in various ways, from simple steaming or boiling to elaborate
|
||||
preparations such as grilling incorporating
|
||||
</div>
|
||||
<div className="author">
|
||||
<img src="assets/images/testimonials/author1.jpg" alt="Author" />
|
||||
<div className="description">
|
||||
<h5>Steven H. Paxson</h5>
|
||||
<span>CEO & Founder</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="testimonial-item">
|
||||
<div className="quote">
|
||||
<i className="flaticon-quote" />
|
||||
</div>
|
||||
<div className="text">
|
||||
Renowned for its versatility in the kitchen, Red King Crab can be
|
||||
prepared in various ways, from simple steaming or boiling to elaborate
|
||||
preparations such as grilling incorporating
|
||||
</div>
|
||||
<div className="author">
|
||||
<img src="assets/images/testimonials/author2.jpg" alt="Author" />
|
||||
<div className="description">
|
||||
<h5>Steven H. Paxson</h5>
|
||||
<span>CEO & Founder</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="testimonial-item">
|
||||
<div className="quote">
|
||||
<i className="flaticon-quote" />
|
||||
</div>
|
||||
<div className="text">
|
||||
Renowned for its versatility in the kitchen, Red King Crab can be
|
||||
prepared in various ways, from simple steaming or boiling to elaborate
|
||||
preparations such as grilling incorporating
|
||||
</div>
|
||||
<div className="author">
|
||||
<img src="assets/images/testimonials/author3.jpg" alt="Author" />
|
||||
<div className="description">
|
||||
<h5>Steven H. Paxson</h5>
|
||||
<span>CEO & Founder</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</Slider>
|
||||
);
|
||||
};
|
||||
60
components/blog/ListOfBlogSection.js
Normal file
@ -0,0 +1,60 @@
|
||||
import { Blog } from "@/utility/constant.utils";
|
||||
import Link from "next/link";
|
||||
|
||||
const ListOfBlogSection = () => {
|
||||
return (
|
||||
<section className="blog-area pt-100 rpt-70 pb-90 rpb-60 rel z-1">
|
||||
<div className="container">
|
||||
<div className="row justify-content-center">
|
||||
<div className="col-lg-12">
|
||||
<div
|
||||
className="section-title text-center mb-50"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<span className="sub-title mb-5">The Latest News What We Have</span>
|
||||
<h2>Our Latest Food News</h2>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="row justify-content-center">
|
||||
{
|
||||
Blog?.map((blog) => {
|
||||
return (
|
||||
<div className="col-xl-4 col-md-6" key={blog?.id}>
|
||||
<div
|
||||
className="blog-item"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={50}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="image">
|
||||
<img src={blog?.image} alt={blog?.slug} />
|
||||
</div>
|
||||
<div className="content">
|
||||
<h4>
|
||||
<Link href={`/blog/${blog?.slug}`}>
|
||||
{blog?.title}
|
||||
</Link>
|
||||
</h4>
|
||||
<p>
|
||||
{blog?.short_des}
|
||||
</p>
|
||||
<Link href={`/blog/${blog?.slug}`} className="read-more">
|
||||
Read more <i className="far fa-arrow-alt-right" />
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
})
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
};
|
||||
|
||||
export default ListOfBlogSection;
|
||||
105
components/home/AboutSection.js
Normal file
@ -0,0 +1,105 @@
|
||||
import Link from "next/link";
|
||||
import Counter from "../Counter";
|
||||
|
||||
const AboutSection = ({
|
||||
productImage = "/assets/images/home/left-side-image.webp",
|
||||
title = "Dosa",
|
||||
product = "Dosa",
|
||||
}) => {
|
||||
return (
|
||||
<section className="about-us-area pt-100 rpt-60 pb-30 rel z-1">
|
||||
<div className="container">
|
||||
<div className="row align-items-center">
|
||||
<div className="col-lg-6">
|
||||
<div
|
||||
className="about-image-part style-two mb-30 rmb-55"
|
||||
data-aos="fade-left"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<img src={productImage} alt={`About ${product}`} loading="lazy" />
|
||||
{/* <div
|
||||
className="quality-food"
|
||||
style={{
|
||||
backgroundImage:
|
||||
"url(assets/images/shapes/about-star-yellow.png)",
|
||||
}}
|
||||
>
|
||||
<span className="for-border" />
|
||||
<span className="text">
|
||||
quality <br />
|
||||
food
|
||||
</span>
|
||||
</div> */}
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-6">
|
||||
<div
|
||||
className="about-us-content"
|
||||
data-aos="fade-right"
|
||||
data-aos-delay={150}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="section-title mb-25">
|
||||
<span className="sub-title mb-5">Real . authentic . South Indian</span>
|
||||
<h2> Welcome to Shiva Sakthi Restaurant</h2>
|
||||
</div>
|
||||
<p>
|
||||
Your new favorite destination for authentic South Indian cuisine, now in the Greater Toronto Area (GTA). Enjoy dine-in, take-out, and full-service catering tailored to your needs. We also offer a spacious party hall for your special occasions.
|
||||
</p>
|
||||
<div className="about-btn-author pt-5 mb-60">
|
||||
<Link href="/about" className="theme-btn style-two">
|
||||
learn more us <i className="far fa-arrow-alt-right" />
|
||||
</Link>
|
||||
<Link href="/menu" className="read-more">
|
||||
Explore popular menu <i className="far fa-arrow-alt-right" />
|
||||
</Link>
|
||||
</div>
|
||||
{/* <div className="row">
|
||||
<div className="col-sm-4 col-6">
|
||||
<div className="counter-item style-two counter-text-wrap">
|
||||
<span
|
||||
className="count-text k-plus"
|
||||
data-speed={3000}
|
||||
data-stop={34}
|
||||
>
|
||||
<Counter end={34} />
|
||||
</span>
|
||||
<span className="counter-title">Organic Planting</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-sm-4 col-6">
|
||||
<div className="counter-item style-two counter-text-wrap">
|
||||
<span
|
||||
className="count-text plus"
|
||||
data-speed={3000}
|
||||
data-stop={356}
|
||||
>
|
||||
<Counter end={356} />
|
||||
</span>
|
||||
<span className="counter-title">Passionate Chef’s</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-sm-4 col-6">
|
||||
<div className="counter-item style-two counter-text-wrap">
|
||||
<span
|
||||
className="count-text plus"
|
||||
data-speed={3000}
|
||||
data-stop={8534}
|
||||
>
|
||||
<Counter end={8534} />
|
||||
</span>
|
||||
<span className="counter-title">Favourite Dishes</span>
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/* <span className="about-bg-text">{title}</span> */}
|
||||
</section>
|
||||
);
|
||||
};
|
||||
export default AboutSection;
|
||||
60
components/home/BlogSection.js
Normal file
@ -0,0 +1,60 @@
|
||||
import { Blog } from "@/utility/constant.utils";
|
||||
import Link from "next/link";
|
||||
|
||||
const BlogSection = () => {
|
||||
return (
|
||||
<section className="blog-area pt-100 rpt-70 pb-90 rpb-60 rel z-1">
|
||||
<div className="container">
|
||||
<div className="row justify-content-center">
|
||||
<div className="col-lg-12">
|
||||
<div
|
||||
className="section-title text-center mb-50"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<span className="sub-title mb-5">The Latest News What We Have</span>
|
||||
<h2>Our Latest Food News</h2>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="row justify-content-center">
|
||||
{
|
||||
Blog?.map((blog) => {
|
||||
return (
|
||||
<div className="col-xl-4 col-md-6" key={blog?.id}>
|
||||
<div
|
||||
className="blog-item"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={50}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="image">
|
||||
<img src={blog?.image} alt={blog?.slug} loading="lazy" />
|
||||
</div>
|
||||
<div className="content">
|
||||
<h4>
|
||||
<Link href={`/blog/${blog?.slug}`}>
|
||||
{blog?.title}
|
||||
</Link>
|
||||
</h4>
|
||||
<p>
|
||||
{blog?.short_des}
|
||||
</p>
|
||||
<Link href={`/blog/${blog?.slug}`} className="read-more">
|
||||
Read more <i className="far fa-arrow-alt-right" />
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
})
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
};
|
||||
|
||||
export default BlogSection;
|
||||
138
components/home/CategorySection.js
Normal file
@ -0,0 +1,138 @@
|
||||
import Link from "next/link";
|
||||
import Slider from "react-slick";
|
||||
import { sliderProps } from "@/utility/sliderProps";
|
||||
|
||||
const CategorySection = () => {
|
||||
const CategoryData = [
|
||||
{
|
||||
id: 1,
|
||||
title: "Soups & Salads",
|
||||
image: "/assets/images/home/category/salads.webp",
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
title: "Veg Appetizers",
|
||||
image: "/assets/images/home/category/veg-appetizer.webp",
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
title: "Non - Veg Appetizers",
|
||||
image: "/assets/images/home/category/chicken-appetizer.webp",
|
||||
},
|
||||
{
|
||||
id: 4,
|
||||
title: "Egg Delights",
|
||||
image: "/assets/images/home/category/egg.webp",
|
||||
},
|
||||
{
|
||||
id: 5,
|
||||
title: "DOSA",
|
||||
image: "/assets/images/home/category/dosa.webp",
|
||||
},
|
||||
{
|
||||
id: 6,
|
||||
title: "IDLY",
|
||||
image: "/assets/images/home/category/idly.webp",
|
||||
},
|
||||
{
|
||||
id: 7,
|
||||
title: "Uttapam",
|
||||
image: "/assets/images/home/category/uthappam.webp",
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
title: "Indian Breads",
|
||||
image: "/assets/images/home/category/indian-breads.webp",
|
||||
},
|
||||
{
|
||||
id: 9,
|
||||
title: "Tandoori Breads",
|
||||
image: "/assets/images/home/category/tandoor-breads.webp",
|
||||
},
|
||||
{
|
||||
id: 10,
|
||||
title: "Hakka",
|
||||
image: "/assets/images/home/category/hakka.webp",
|
||||
},
|
||||
{
|
||||
id: 11,
|
||||
title: "Veg Biryani",
|
||||
image: "/assets/images/home/category/veg-biryani.webp",
|
||||
},
|
||||
{
|
||||
id: 12,
|
||||
title: "Veg Curry",
|
||||
image: "/assets/images/home/category/veg-curry.webp",
|
||||
},
|
||||
{
|
||||
id: 13,
|
||||
title: "NON - Veg Biryani",
|
||||
image: "/assets/images/home/category/nonveg-biryani.webp",
|
||||
},
|
||||
{
|
||||
id: 14,
|
||||
title: "NON - Veg Curry",
|
||||
image: "/assets/images/home/category/nv-curry.webp",
|
||||
},
|
||||
{
|
||||
id: 15,
|
||||
title: "Deserts",
|
||||
image: "/assets/images/home/category/dessert.webp",
|
||||
},
|
||||
{
|
||||
id: 16,
|
||||
title: "Beverages",
|
||||
image: "/assets/images/home/category/beverages.webp",
|
||||
}
|
||||
];
|
||||
|
||||
return (
|
||||
<section className="related-products-area pt-130 rpt-100 pb-100 rpb-70 rel z-1">
|
||||
<div className="container">
|
||||
<div className="row justify-content-center">
|
||||
<div className="col-lg-12">
|
||||
<div
|
||||
className="section-title text-center mb-50"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<span className="sub-title mb-5">South Indian And North Indian</span>
|
||||
<h2>POPULAR DISHES</h2>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<Slider {...sliderProps.categorySlider}>
|
||||
{CategoryData.map((cat) => (
|
||||
<div key={cat.id} className="px-2">
|
||||
<div className="product-item-two">
|
||||
<div className="image">
|
||||
<img src={cat.image} alt={cat.title} />
|
||||
</div>
|
||||
<div className="content" style={{ backgroundColor: "#ffb936" }}>
|
||||
<h5>{cat.title}</h5>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</Slider>
|
||||
</div>
|
||||
<div className="testimonials-shapes">
|
||||
<div className="shape one">
|
||||
<img src="/assets/images/home/popular-menu/right.webp" alt="Shape" style={{ width: "50%" }} />
|
||||
</div>
|
||||
{/* <div className="shape two">
|
||||
<img src="assets/images/shapes/hero-shape3.png" alt="Shape" />
|
||||
</div>
|
||||
<div className="shape three">
|
||||
<img src="assets/images/shapes/hero-shape3.png" alt="Shape" />
|
||||
</div> */}
|
||||
<div className="shape four">
|
||||
<img src="/assets/images/home/popular-menu/left.webp" alt="Shape" style={{ width: "50%" }} />
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
};
|
||||
|
||||
export default CategorySection;
|
||||
72
components/home/DosaOfferSection.js
Normal file
@ -0,0 +1,72 @@
|
||||
import Link from "next/link";
|
||||
|
||||
const DosaOfferSection = () => {
|
||||
return (
|
||||
<section className="special-offer-area-two bgc-black pt-105 rpt-85 pb-130 rpb-100 rel z-1"
|
||||
style={{ backgroundImage: "url(/assets/images/background/hero.jpg)" }}
|
||||
>
|
||||
<div className="container">
|
||||
<div className="row align-items-center">
|
||||
<div className="col-lg-5">
|
||||
<div
|
||||
className="offer-content-two text-white rmb-55"
|
||||
data-aos="fade-right"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<img
|
||||
src="/assets/images/home/offer-dosa/left-side-img.webp"
|
||||
alt="Dosa" loading="lazy"
|
||||
/>
|
||||
<div className="section-title mt-45 mb-25">
|
||||
<h2>South Indian and North Indian Cusine</h2>
|
||||
</div>
|
||||
{/* <p className="ms-0">
|
||||
South Indian and North Indian Cusine
|
||||
</p> */}
|
||||
<a href="/menu" className="theme-btn mt-15">
|
||||
order now <i className="far fa-arrow-alt-right" />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-7">
|
||||
<div
|
||||
className="offer-image style-two style-three"
|
||||
data-aos="fade-left"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<img src="/assets/images/home/offer-dosa/right-side-img.webp" alt="Burger Image" loading="lazy" />
|
||||
{/* <div
|
||||
className="offer-badge"
|
||||
style={{
|
||||
backgroundImage: "url(assets/images/shapes/about-star.png)",
|
||||
}}
|
||||
>
|
||||
<span>
|
||||
only <br />
|
||||
<span className="price">$59</span>
|
||||
</span>
|
||||
</div> */}
|
||||
<span className="marquee-wrap style-two text-white">
|
||||
<span className="marquee-inner left">dosa</span>
|
||||
<span className="marquee-inner left">dosa</span>
|
||||
<span className="marquee-inner left">dosa</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="testimonials-shapes">
|
||||
{/* <div className="shape one">
|
||||
<img src="assets/images/shapes/hero-shape5.png" alt="Shape" />
|
||||
</div> */}
|
||||
{/* <div className="shape two">
|
||||
<img src="assets/images/shapes/hero-shape3.png" alt="Shape" />
|
||||
</div> */}
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
};
|
||||
|
||||
export default DosaOfferSection;
|
||||
137
components/home/HeroBanner.js
Normal file
@ -0,0 +1,137 @@
|
||||
import { useState } from "react";
|
||||
import Link from "next/link";
|
||||
import Slider from "react-slick";
|
||||
import { sliderProps } from "@/utility/sliderProps";
|
||||
|
||||
const heroSlides = [
|
||||
{
|
||||
subtitle: "Welcome to Shiva Sakthi Restaurant",
|
||||
title: "Taste the <br/> & Tradition On Weekdays",
|
||||
description:
|
||||
"At Shiva Sakthi, we serve more than just food — we serve memories. Taste the heritage of South India in every bite, lovingly prepared with spices that tell a story.",
|
||||
buttonText: "Order now",
|
||||
buttonLink: "https://gosnappy.io/owa/r/shiva-sakthi-restaurant/5921/menu_655/",
|
||||
leftImage: "/assets/images/home/right-4.webp",
|
||||
rightImage: "/assets/images/home/right-4.webp",
|
||||
},
|
||||
{
|
||||
subtitle: "Welcome to Shiva Sakthi Restaurant",
|
||||
title: "Unlimited Thali On Weeekends By Reservation Only",
|
||||
description:
|
||||
"Enjoy the comfort of home-style cooking blended with restaurant excellence. At Shiva Sakthi, every meal is crafted with love and served with joy.",
|
||||
buttonText: "Book now",
|
||||
buttonLink: "https://gosnappy.io/reservation/?storeId=5921&returnUrl=https:%2F%2Fgosnappy.io%2Fowa%2Fr%2Fshiva-sakthi-restaurant%2F5921%2Fmenu_655%2F",
|
||||
leftImage: "/assets/images/home/left-5.webp",
|
||||
rightImage: "/assets/images/home/right-5.webp",
|
||||
},
|
||||
{
|
||||
subtitle: "Authentic Flavors. Timeless Traditions.",
|
||||
title: "SOUTH INDIAN SOUL ON EVERY PLATE",
|
||||
description:
|
||||
"At Shiva Sakthi, we serve more than just food — we serve memories. Taste the heritage of South India in every bite, lovingly prepared with spices that tell a story.",
|
||||
buttonText: "Explore Menu",
|
||||
buttonLink: "/menu",
|
||||
leftImage: "/assets/images/home/left-2.webp",
|
||||
rightImage: "/assets/images/home/right-2.webp",
|
||||
},
|
||||
{
|
||||
subtitle: "Pure Veg & Non-Veg Cuisine Inspired by Tradition",
|
||||
title: "YOUR TASTE OF TAMIL HERITAGE",
|
||||
description:
|
||||
"Celebrate Tamil culinary roots with our rich variety of dishes. From hearty curries to crisp dosas, every plate is a tribute to South Indian hospitality.",
|
||||
buttonText: "Explore Menu",
|
||||
buttonLink: "/menu",
|
||||
leftImage: "/assets/images/home/left-1.webp",
|
||||
rightImage: "/assets/images/home/right-1.webp",
|
||||
},
|
||||
{
|
||||
subtitle: "Wholesome Dishes with a Homemade Touch",
|
||||
title: "MADE WITH LOVE, SERVED WITH PRIDE",
|
||||
description:
|
||||
"Enjoy the comfort of home-style cooking blended with restaurant excellence. At Shiva Sakthi, every meal is crafted with love and served with joy.",
|
||||
buttonText: "Explore Menu",
|
||||
buttonLink: "/menu",
|
||||
leftImage: "/assets/images/home/left-3.webp",
|
||||
rightImage: "/assets/images/home/right-3.webp",
|
||||
},
|
||||
];
|
||||
|
||||
|
||||
const HeroBanner = () => {
|
||||
const [currentSlide, setCurrentSlide] = useState(0);
|
||||
|
||||
const handleBeforeChange = (_, next) => {
|
||||
setCurrentSlide(next);
|
||||
};
|
||||
|
||||
const settings = {
|
||||
...sliderProps.heroBanner,
|
||||
beforeChange: handleBeforeChange,
|
||||
};
|
||||
|
||||
const activeSlide = heroSlides[currentSlide];
|
||||
|
||||
return (
|
||||
<section
|
||||
className="hero-area-five bgs-cover pt-150 rpt-105 pb-100 rel z-1"
|
||||
style={{ backgroundImage: "url(/assets/images/background/hero.jpg)" }}
|
||||
>
|
||||
{/* Dynamic Content Slider */}
|
||||
<Slider {...settings} className="hero-slider container">
|
||||
{heroSlides.map((slide, index) => (
|
||||
<div key={index}>
|
||||
<div
|
||||
className="hero-content-four style-two rpt-0 text-center text-white"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<span className="sub-title">{slide.subtitle}</span>
|
||||
<h1 dangerouslySetInnerHTML={{ __html: slide.title }}></h1>
|
||||
<p>{slide.description}</p>
|
||||
<Link href={slide.buttonLink} className="theme-btn mt-25" target={slide.buttonLink.startsWith("http") && index < 2 && "_blank"} >
|
||||
{slide.buttonText} <i className="far fa-arrow-alt-right" />
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</Slider>
|
||||
|
||||
{/* Static and Dynamic Shapes */}
|
||||
<div className="hero-shapes">
|
||||
{/* Static shapes */}
|
||||
{/* <div className="shape one">
|
||||
<img src="/assets/images/shapes/hero-shape1.png" alt="Shape" />
|
||||
</div> */}
|
||||
<div className="shape two">
|
||||
<img src="/assets/images/shapes/hero-shape2.png" alt="Shape" />
|
||||
</div>
|
||||
<div className="shape five">
|
||||
<img src="/assets/images/shapes/hero-shape5.png" alt="Shape" />
|
||||
</div>
|
||||
|
||||
{/* Dynamic left/right shape images based on slide */}
|
||||
<div
|
||||
className="hero-left"
|
||||
data-aos="zoom-in"
|
||||
data-aos-delay={50}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<img src={activeSlide.leftImage} alt="Hero Left Shape" />
|
||||
</div>
|
||||
<div
|
||||
className="hero-right"
|
||||
data-aos="zoom-in"
|
||||
data-aos-delay={100}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<img src={activeSlide.rightImage} alt="Hero Right Shape" />
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
};
|
||||
|
||||
export default HeroBanner;
|
||||
97
components/home/MealsOfferScetion.js
Normal file
@ -0,0 +1,97 @@
|
||||
import Link from "next/link";
|
||||
|
||||
const MealsOfferSection = () => {
|
||||
return (
|
||||
<section className="special-offer-area-two bgc-black pt-105 rpt-85 pb-130 rpb-100 rel z-1"
|
||||
style={{ backgroundImage: "url(/assets/images/background/hero.jpg)" }}
|
||||
>
|
||||
<div className="container">
|
||||
<div className="row align-items-center">
|
||||
<div className="col-lg-6">
|
||||
<div
|
||||
className="offer-content-two text-center text-white rmb-55"
|
||||
data-aos="fade-right"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<img
|
||||
src="/assets/images/home/unlimited-thali/left.webp"
|
||||
alt="Unlimited Thali"
|
||||
/>
|
||||
<div className="section-title mt-45 mb-25">
|
||||
<h2>For Reservation</h2>
|
||||
</div>
|
||||
<p>
|
||||
Enjoy our Unlimited Thali, available by reservation Recomented, every Saturday and Sunday from 12 PM to 4 PM.
|
||||
</p>
|
||||
<ul className="offer-countdown-wrap mt-40 mb-25">
|
||||
<li>
|
||||
<span id="days" />
|
||||
Saturday
|
||||
</li>
|
||||
<li>
|
||||
<span id="hours" />
|
||||
Sunday
|
||||
</li>
|
||||
{/* <li>
|
||||
<span id="minutes" />
|
||||
Min
|
||||
</li>
|
||||
<li>
|
||||
<span id="seconds" />
|
||||
Sec
|
||||
</li> */}
|
||||
</ul>
|
||||
<Link href="https://gosnappy.io/reservation/?storeId=5921&returnUrl=https:%2F%2Fgosnappy.io%2Fowa%2Fr%2Fshiva-sakthi-restaurant%2F5921%2Fmenu_655%2F" target="_blank" className="theme-btn style-three">
|
||||
Reservation <i className="far fa-arrow-alt-right" />
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-6">
|
||||
<div
|
||||
className="offer-image style-two"
|
||||
data-aos="fade-left"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<img src="/assets/images/home/unlimited-thali/right.webp" alt="Thali Image" loading="lazy" />
|
||||
{/* <div
|
||||
className="offer-badge"
|
||||
style={{
|
||||
backgroundImage:
|
||||
"url(assets/images/shapes/offer-circle-shape.png)",
|
||||
}}
|
||||
>
|
||||
<span>
|
||||
only <br />
|
||||
<span className="price">$59</span>
|
||||
</span>
|
||||
</div> */}
|
||||
<span className="marquee-wrap style-two text-white">
|
||||
<span className="marquee-inner left">Thali</span>
|
||||
<span className="marquee-inner left">Thali</span>
|
||||
<span className="marquee-inner left">Thali</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="testimonials-shapes">
|
||||
<div className="shape one">
|
||||
<img src="assets/images/shapes/hero-shape5.png" alt="Shape" loading="lazy" />
|
||||
</div>
|
||||
<div className="shape two">
|
||||
<img src="assets/images/shapes/hero-shape3.png" alt="Shape" loading="lazy" />
|
||||
</div>
|
||||
<div className="shape three">
|
||||
<img src="assets/images/shapes/hero-shape5.png" alt="Shape" loading="lazy" />
|
||||
</div>
|
||||
<div className="shape four">
|
||||
<img src="assets/images/shapes/hero-shape3.png" alt="Shape" loading="lazy" />
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
};
|
||||
|
||||
export default MealsOfferSection;
|
||||
37
components/home/OfferCard.js
Normal file
@ -0,0 +1,37 @@
|
||||
import Link from "next/link";
|
||||
|
||||
const HomeOfferCard = () => {
|
||||
return (
|
||||
<section className="container-fluid pb-100 rpb-60">
|
||||
<div className="category-banner-area px-4">
|
||||
<div className="row row-cols-xl-2 row-cols-lg-2 row-cols-sm-2 row-cols-1 justify-content-center">
|
||||
<div
|
||||
className="col"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={50}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div>
|
||||
<img src="/assets/images/home/offer-card-1.webp" alt="offer-card-1" style={{width:"100%"}} loading="lazy" />
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
className="col"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={100}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div>
|
||||
<img src="/assets/images/home/offer-card-2.webp" alt="offer-card-2" style={{width:"100%"}} loading="lazy" />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
)
|
||||
}
|
||||
|
||||
export default HomeOfferCard;
|
||||
131
components/home/PopularMenu.js
Normal file
@ -0,0 +1,131 @@
|
||||
import Link from "next/link";
|
||||
|
||||
const PopularMenu = () => {
|
||||
const menuData = [
|
||||
{
|
||||
title: "Medhu Vada",
|
||||
price: "$7.99",
|
||||
description: "The popular soft and savory appetizer",
|
||||
image: "/assets/images/home/popular-menu/medhu-vada.webp",
|
||||
},
|
||||
{
|
||||
title: "Garlic Naan",
|
||||
price: "$1.99",
|
||||
description: "Naan infused with garlic",
|
||||
image: "/assets/images/home/popular-menu/garlic-naan.webp",
|
||||
},
|
||||
{
|
||||
title: "King Fish Fry",
|
||||
price: "$17.99",
|
||||
description: "House Special - Premium King Fish Slice Fry",
|
||||
image: "/assets/images/home/popular-menu/fish-fry.webp",
|
||||
},
|
||||
{
|
||||
title: "Paruppu pradhaman",
|
||||
price: "$3.99",
|
||||
description: "south style Payasam made with cocunut, Lentils and Jaggery",
|
||||
image: "/assets/images/home/popular-menu/paruppu-pradhaman.webp",
|
||||
},
|
||||
{
|
||||
title: "Egg Bhurji (Podimas)",
|
||||
price: "$11.99",
|
||||
description: "Masala Egg Bhurji (Podimas)",
|
||||
image: "/assets/images/home/popular-menu/egg-kothu.webp",
|
||||
},
|
||||
{
|
||||
title: "Veg Biryani",
|
||||
price: "$13.99",
|
||||
description: "Cooked in Chettinadu style using Basmati rice",
|
||||
image: "/assets/images/home/popular-menu/veg-birani.webp",
|
||||
},
|
||||
{
|
||||
title: "Hakka Noodles (veg) ",
|
||||
price: "$13.99",
|
||||
description: "Hakka Flovored Noodles",
|
||||
image: "/assets/images/home/popular-menu/veg-hakka.webp",
|
||||
},
|
||||
{
|
||||
title: "Thalapakattu Mutton Biryani",
|
||||
price: "$16.99",
|
||||
description: "Authentic Thalapakattu style in seeraga samba rice",
|
||||
image: "/assets/images/home/popular-menu/thalappakatti-mutton-biryani.webp",
|
||||
},
|
||||
{
|
||||
title: "PIZZA DOSA",
|
||||
price: "$14.99",
|
||||
description: "Classic Dosa made to taste like pizza and favorite with kids and adults alike",
|
||||
image: "/assets/images/home/popular-menu/pizza-dosa.webp",
|
||||
},
|
||||
{
|
||||
title: "Payasam",
|
||||
price: "$3.99",
|
||||
description: "Traditional Tamilnadu style vermichilli payasam",
|
||||
image: "/assets/images/home/popular-menu/payasam.webp",
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
<section className="popular-menu-area-three pt-130 rpt-100 pb-115 rpb-90 rel z-1">
|
||||
<div className="container">
|
||||
<div className="row justify-content-center">
|
||||
<div className="col-lg-7 col-md-8">
|
||||
<div
|
||||
className="section-title text-center mb-50"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<span className="sub-title mb-5">popular menu</span>
|
||||
<h2>
|
||||
From Authentic Indian Kitchen
|
||||
</h2>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="row no-gap">
|
||||
{[0, 1].map((colIndex) => (
|
||||
<div className="col-lg-6" key={colIndex}>
|
||||
<div
|
||||
className="popular-menu-wrap"
|
||||
data-aos={colIndex === 0 ? "fade-left" : "fade-right"}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
{menuData
|
||||
.slice(colIndex * 5, (colIndex + 1) * 5)
|
||||
.map((item, index) => (
|
||||
<div className="food-menu-item style-two" key={index}>
|
||||
<div className="image">
|
||||
<img src={item.image} alt={item.title} loading="lazy" />
|
||||
</div>
|
||||
<div className="content">
|
||||
<h5>
|
||||
<span className="title">{item.title}</span>{" "}
|
||||
<span className="dots" />{" "}
|
||||
<span className="price">{item.price}</span>
|
||||
</h5>
|
||||
<p>{item.description}</p>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
<div className="text-center mt-3">
|
||||
<a class="theme-btn style-two" href="/menu">View Full Menu <i class="far fa-arrow-alt-right"></i></a>
|
||||
</div>
|
||||
</div>
|
||||
<div className="menu-items-shape">
|
||||
<div className="shape one">
|
||||
<img src="/assets/images/home/popular-menu/left.webp" alt="Shape" loading="lazy" />
|
||||
</div>
|
||||
<div className="shape two">
|
||||
<img src="/assets/images/home/popular-menu/right.webp" alt="Shape" loading="lazy" />
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
);
|
||||
};
|
||||
|
||||
export default PopularMenu;
|
||||
8
jsconfig.json
Normal file
@ -0,0 +1,8 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"paths": {
|
||||
"@/*": ["./*"],
|
||||
"@css/*": ["./public/assets/css/*"]
|
||||
}
|
||||
}
|
||||
}
|
||||
785
layout/Footer.js
Normal file
@ -0,0 +1,785 @@
|
||||
import Link from "next/link";
|
||||
|
||||
const Footer = ({ footer = 1 }) => {
|
||||
switch (footer) {
|
||||
case 1:
|
||||
return <DefaultFooter />;
|
||||
case 2:
|
||||
return <Footer2 />;
|
||||
case 3:
|
||||
return <Footer3 />;
|
||||
case 5:
|
||||
return <Footer5 />;
|
||||
case 6:
|
||||
return <Footer6 />;
|
||||
default:
|
||||
return <DefaultFooter />;
|
||||
}
|
||||
};
|
||||
export default Footer;
|
||||
|
||||
const DefaultFooter = () => {
|
||||
return (
|
||||
<footer
|
||||
className="main-footer bgc-black rel z-1"
|
||||
style={{
|
||||
backgroundImage: "url(/assets/images/background/footer-bg.png)",
|
||||
}}
|
||||
>
|
||||
{/* <div className="footer-top py-130 rpy-100">
|
||||
<div className="container">
|
||||
<div className="row justify-content-center">
|
||||
<div
|
||||
className="col-xl-7 col-lg-9"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="section-title text-white text-center mb-35">
|
||||
<span className="sub-title mb-10">join our newsletter</span>
|
||||
<h2>subscribe follow our newsletter to get more updates</h2>
|
||||
</div>
|
||||
<form className="newsletter-form" action="#">
|
||||
<label htmlFor="news-email">
|
||||
<i className="fas fa-envelope" />
|
||||
</label>
|
||||
<input
|
||||
id="news-email"
|
||||
type="email"
|
||||
placeholder="Email Address"
|
||||
required=""
|
||||
/>
|
||||
<button className="theme-btn" type="submit">
|
||||
Subscribe <i className="far fa-arrow-alt-right" />
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
<div className="widget-area pt-100 pb-70">
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
{/* Column 1 - 4 units */}
|
||||
<div className="col-xl-4 col-lg-6 col-md-6 col-sm-12 mb-4" data-aos="fade-up" data-aos-duration={1500}>
|
||||
<div className="footer-widget footer-text">
|
||||
<div className="footer-logo mb-25">
|
||||
<Link href="/" className="d-flex gap-2 align-items-center">
|
||||
<img src="/assets/images/logos/logo.webp" alt="Logo" title="Logo" />
|
||||
|
||||
</Link>
|
||||
</div>
|
||||
<p>
|
||||
At Shiva Sakthi Restaurant, we bring you the best of South and North Indian cuisine, crafted with passion and authenticity. From our kitchen to your plate, every dish is a celebration of India's rich culinary heritage.
|
||||
</p>
|
||||
<div className="social-style-one mt-15">
|
||||
<Link href="https://www.facebook.com/shivasakthi.ca/" target="_blank"><i className="fab fa-facebook-f" /></Link>
|
||||
<Link href="https://www.instagram.com/shivasakthi.ca/" target="_blank"><i className="fab fa-instagram" /></Link>
|
||||
<Link href="https://www.youtube.com/@ShivaSakthiRestaurant" target="_blank"><i className="fab fa-youtube" /></Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Column 2 - 2 units */}
|
||||
<div className="col-xl-2 col-lg-6 col-md-6 col-sm-12 mb-4" data-aos="fade-up" data-aos-delay={50} data-aos-duration={1500}>
|
||||
<div className="footer-widget footer-links">
|
||||
<div className="footer-title"><h5>Quick Links</h5></div>
|
||||
<ul>
|
||||
<li><Link href="/">Home</Link></li>
|
||||
<li><Link href="/about">About</Link></li>
|
||||
<li><Link href="/menu">Menu</Link></li>
|
||||
<li><Link href="/contact">Contact</Link></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Column 3 - 3 units */}
|
||||
<div className="col-xl-3 col-lg-6 col-md-6 col-sm-12 mb-4" data-aos="fade-up" data-aos-delay={100} data-aos-duration={1500}>
|
||||
<div className="footer-widget footer-contact">
|
||||
<div className="footer-title"><h5>Contact Us</h5></div>
|
||||
<ul>
|
||||
<li>7166 Airport Road, Mississauga Ontario.L4T 2H2, Canada</li>
|
||||
<li><a href="mailto:info@shivasakthi.ca"><u>info@shivasakthi.ca</u></a></li>
|
||||
<li><a href="callto:905 677 3555">905 677 3555</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{/* Column 4 - 3 units */}
|
||||
<div className="col-xl-3 col-lg-6 col-md-6 col-sm-12 mb-4" data-aos="fade-up" data-aos-delay={150} data-aos-duration={1500}>
|
||||
<div className="footer-widget opening-hour">
|
||||
<div className="footer-title"><h5>Opening Hour</h5></div>
|
||||
<ul>
|
||||
<li>Monday – Friday: <span>11.30 am - 10.00 pm</span></li>
|
||||
<li>Saturday, Sunday: <span>12.00 pm - 10.00 pm</span></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="footer-bottom pt-30 pb-15">
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-12">
|
||||
<div className="copyright-text text-center">
|
||||
<p>
|
||||
Copyright {new Date().getFullYear()} © Shivas Dosa Restaurant. Powered by <Link href="https://metatroncubesolutions.com/">MetatronCube</Link>. All Right Reserved.{" "}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
{/* <div className="col-lg-5 text-center text-lg-end">
|
||||
<ul className="footer-bottom-nav">
|
||||
<li>
|
||||
<a href="#">Privacy Policy</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">Terms & Condition</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div> */}
|
||||
</div>
|
||||
<button
|
||||
className="scroll-top scroll-to-target"
|
||||
onClick={() => window.scrollTo({ top: 0, behavior: 'smooth' })}
|
||||
>
|
||||
<i className="fas fa-arrow-alt-up" />
|
||||
</button>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
{/* <div className="footer-shapes">
|
||||
<div className="shape one">
|
||||
<img src="/assets/images/footer-shape/2.webp" alt="Shape" />
|
||||
</div>
|
||||
<div className="shape two">
|
||||
<img src="/assets/images/footer-shape/3.webp" alt="Shape" />
|
||||
</div>
|
||||
<div className="shape three">
|
||||
<img src="/assets/images/footer-shape/1.webp" alt="Shape" />
|
||||
</div>
|
||||
</div> */}
|
||||
</footer>
|
||||
);
|
||||
};
|
||||
|
||||
const Footer2 = () => {
|
||||
return (
|
||||
<footer
|
||||
className="main-footer bgc-black pt-130 rpt-100 rel z-1"
|
||||
style={{ backgroundImage: "url(assets/images/background/footer-bg.png)" }}
|
||||
>
|
||||
<div className="widget-area pb-70">
|
||||
<div className="container">
|
||||
<div className="row justify-content-between">
|
||||
<div className="col-xl-3 col-lg-4 col-sm-6">
|
||||
<div
|
||||
className="footer-widget footer-text"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="footer-logo mb-25">
|
||||
<Link href="/">
|
||||
<img src="/assets/images/logos/logo-white.png" alt="Logo" />
|
||||
</Link>
|
||||
</div>
|
||||
<p>
|
||||
Temporibus autem quibusdam officiis aut rerum necessitatibus
|
||||
eveniet voluta repudiandae molestiae recusandae
|
||||
</p>
|
||||
<div className="social-style-one mt-15">
|
||||
<Link href="https://www.facebook.com/shivasdosa/">
|
||||
<i className="fab fa-facebook-f" />
|
||||
</Link>
|
||||
{/* <Link href="#">
|
||||
<i className="fab fa-twitter" />
|
||||
</Link>
|
||||
<Link href="#">
|
||||
<i className="fab fa-linkedin-in" />
|
||||
</Link> */}
|
||||
<Link href="https://www.instagram.com/shivasdosa/">
|
||||
<i className="fab fa-instagram" />
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-xl-4 col-lg-5 col-sm-6">
|
||||
<div
|
||||
className="footer-widget footer-links"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={50}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="footer-title">
|
||||
<h5>popular food</h5>
|
||||
</div>
|
||||
<ul className="two-column">
|
||||
<li>
|
||||
<Link href="product-details">Hamburger</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="product-details">French fries</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="product-details">Chicken pizza</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="product-details">Onion rings</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="product-details">Vegetable roll</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="product-details">Chicken nuggets</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="product-details">Sea fish</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="product-details">Tacos Pizza</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="product-details">Fried chicken</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="product-details">Hot Dogs</Link>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-xl-5">
|
||||
<div className="row justify-content-between">
|
||||
<div className="col-xl-6 col-lg-5 col-sm-6">
|
||||
<div
|
||||
className="footer-widget footer-contact"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={100}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="footer-title">
|
||||
<h5>contact us</h5>
|
||||
</div>
|
||||
<ul>
|
||||
<li>
|
||||
1403 Washington Ave, New Orlea ns, LA 70130, United
|
||||
States
|
||||
</li>
|
||||
<li>
|
||||
<a href="mailto:wellfood@gmail.com">
|
||||
<u>wellfood@gmail.com</u>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="callto:+(1)0987654321">+(1) 098 765 4321</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-xl-6 col-lg-5 col-sm-6">
|
||||
<div
|
||||
className="footer-widget opening-hour"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={150}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="footer-title">
|
||||
<h5>opening hour</h5>
|
||||
</div>
|
||||
<ul>
|
||||
<li>
|
||||
Monday – Friday: <span>8am – 4pm</span>
|
||||
</li>
|
||||
<li>
|
||||
Saturday: <span>8am – 12am</span>
|
||||
</li>
|
||||
</ul>
|
||||
<div className="any-question mt-20">
|
||||
<h5>Have any questions?</h5>
|
||||
<a href="#" className="theme-btn style-two">
|
||||
let’s talk us <i className="far fa-arrow-alt-right" />
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="footer-bottom pt-30 pb-15">
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-5">
|
||||
<div className="copyright-text text-center text-lg-start">
|
||||
<p>
|
||||
Copyright 2024 <Link href="/">Wellfood</Link>. All Rights
|
||||
Reserved{" "}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-7 text-center text-lg-end">
|
||||
<ul className="footer-bottom-nav">
|
||||
<li>
|
||||
<a href="#">Privacy Policy</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">Terms & Condition</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
{/* Scroll Top Button */}
|
||||
<button className="scroll-top scroll-to-target" data-target="html">
|
||||
<i className="fas fa-arrow-alt-up" />
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
);
|
||||
};
|
||||
const Footer3 = () => {
|
||||
return (
|
||||
<footer
|
||||
className="main-footer footer-two bgc-black pt-120 rpt-90 rel z-1"
|
||||
style={{ backgroundImage: "url(assets/images/background/footer-bg.png)" }}
|
||||
>
|
||||
<div className="widget-area pb-70">
|
||||
<div className="container">
|
||||
<div className="row justify-content-between">
|
||||
<div
|
||||
className="col-xl-3 col-lg-4 col-sm-6"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="footer-widget footer-text">
|
||||
<div className="footer-title">
|
||||
<h5>Location</h5>
|
||||
</div>
|
||||
<p>
|
||||
1403 Washington Ave, New Orlea ns, LA 70130, United States
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
className="col-xl-2 col-lg-3 col-sm-6"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={50}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="footer-widget footer-contact">
|
||||
<div className="footer-title">
|
||||
<h5>contact us</h5>
|
||||
</div>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="mailto:wellfood@gmail.com">
|
||||
<u>wellfood@gmail.com</u>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="callto:+(1)0987654321">+(1) 098 765 4321</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
className="col-xl-3 col-lg-4 col-sm-6"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={100}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="footer-widget opening-hour">
|
||||
<div className="footer-title">
|
||||
<h5>opening hour</h5>
|
||||
</div>
|
||||
<ul>
|
||||
<li>
|
||||
Monday – Friday: <span>8am – 4pm</span>
|
||||
</li>
|
||||
<li>
|
||||
Saturday: <span>8am – 12am</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
className="col-xl-3 col-lg-4 col-sm-6"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={150}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="footer-widget footer-text">
|
||||
<div className="footer-title">
|
||||
<h5>Follow Us</h5>
|
||||
</div>
|
||||
<div className="social-style-one mt-5">
|
||||
<Link href="contact">
|
||||
<i className="fab fa-facebook-f" />
|
||||
</Link>
|
||||
<Link href="contact">
|
||||
<i className="fab fa-twitter" />
|
||||
</Link>
|
||||
<Link href="contact">
|
||||
<i className="fab fa-linkedin-in" />
|
||||
</Link>
|
||||
<Link href="contact">
|
||||
<i className="fab fa-instagram" />
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="footer-bottom pt-30 pb-15">
|
||||
<div className="container rel text-center">
|
||||
<ul className="footer-bottom-nav">
|
||||
<li>
|
||||
<Link href="product-details">Hamburger</Link>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">Pizza</a>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="product-details">Vegetable roll</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="product-details">Sea fish</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="product-details">Fried chicken</Link>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">Burger</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">Saladr</a>
|
||||
</li>
|
||||
</ul>
|
||||
{/* Scroll Top Button */}
|
||||
<button className="scroll-top scroll-to-target" data-target="html">
|
||||
<i className="fas fa-arrow-alt-up" />
|
||||
</button>
|
||||
</div>
|
||||
<hr className="mt-25 mb-30" />
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-5">
|
||||
<div className="copyright-text text-center text-lg-start">
|
||||
<p>
|
||||
Copyright 2024 <Link href="/">Wellfood</Link>. All Rights
|
||||
Reserved{" "}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-7 text-center text-lg-end">
|
||||
<ul className="footer-bottom-nav">
|
||||
<li>
|
||||
<a href="#">Privacy Policy</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">Terms & Condition</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
);
|
||||
};
|
||||
|
||||
const Footer5 = () => {
|
||||
return (
|
||||
<footer className="main-footer footer-two bgc-dark-green pt-120 rpt-90 rel z-1">
|
||||
<div className="widget-area pb-70">
|
||||
<div className="container">
|
||||
<div className="row justify-content-between">
|
||||
<div className="col-xl-3 col-lg-4 col-sm-6">
|
||||
<div
|
||||
className="footer-widget footer-text"
|
||||
data-aos="fade-up"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="footer-title">
|
||||
<h5>Location</h5>
|
||||
</div>
|
||||
<p>
|
||||
1403 Washington Ave, New Orlea ns, LA 70130, United States
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-xl-2 col-lg-3 col-sm-6">
|
||||
<div
|
||||
className="footer-widget footer-contact"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={50}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="footer-title">
|
||||
<h5>contact us</h5>
|
||||
</div>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="mailto:wellfood@gmail.com">
|
||||
<u>wellfood@gmail.com</u>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="callto:+(1)0987654321">+(1) 098 765 4321</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-xl-3 col-lg-4 col-sm-6">
|
||||
<div
|
||||
className="footer-widget opening-hour"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={100}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="footer-title">
|
||||
<h5>opening hour</h5>
|
||||
</div>
|
||||
<ul>
|
||||
<li>
|
||||
Monday – Friday: <span>8am – 4pm</span>
|
||||
</li>
|
||||
<li>
|
||||
Saturday: <span>8am – 12am</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-xl-3 col-lg-4 col-sm-6">
|
||||
<div
|
||||
className="footer-widget footer-text"
|
||||
data-aos="fade-up"
|
||||
data-aos-delay={150}
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="footer-title">
|
||||
<h5>Follow Us</h5>
|
||||
</div>
|
||||
<div className="social-style-one mt-5">
|
||||
<Link href="contact">
|
||||
<i className="fab fa-facebook-f" />
|
||||
</Link>
|
||||
<Link href="contact">
|
||||
<i className="fab fa-twitter" />
|
||||
</Link>
|
||||
<Link href="contact">
|
||||
<i className="fab fa-linkedin-in" />
|
||||
</Link>
|
||||
<Link href="contact">
|
||||
<i className="fab fa-instagram" />
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="footer-bottom pt-30 pb-15">
|
||||
<div className="container rel text-center">
|
||||
<ul className="footer-bottom-nav">
|
||||
<li>
|
||||
<Link href="product-details">Hamburger</Link>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">Pizza</a>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="product-details">Vegetable roll</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="product-details">Sea fish</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="product-details">Fried chicken</Link>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">Burger</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">Saladr</a>
|
||||
</li>
|
||||
</ul>
|
||||
{/* Scroll Top Button */}
|
||||
<button className="scroll-top scroll-to-target" data-target="html">
|
||||
<i className="fas fa-arrow-alt-up" />
|
||||
</button>
|
||||
</div>
|
||||
<hr className="mt-25 mb-30" />
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-5">
|
||||
<div className="copyright-text text-center text-lg-start">
|
||||
<p>
|
||||
Copyright 2024 <Link href="/">Wellfood</Link>. All Rights
|
||||
Reserved{" "}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-7 text-center text-lg-end">
|
||||
<ul className="footer-bottom-nav">
|
||||
<li>
|
||||
<a href="#">Privacy Policy</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">Terms & Condition</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
);
|
||||
};
|
||||
|
||||
const Footer6 = () => {
|
||||
return (
|
||||
<footer
|
||||
className="main-footer footer-two bgc-black pt-120 rpt-90 rel z-1"
|
||||
style={{ backgroundImage: "url(assets/images/background/footer-bg.png)" }}
|
||||
>
|
||||
<div className="widget-area pb-70">
|
||||
<div className="container">
|
||||
<div className="row justify-content-between">
|
||||
<div className="col-xl-3 col-lg-4 col-sm-6">
|
||||
<div className="footer-widget footer-text">
|
||||
<div className="footer-title">
|
||||
<h5>Location</h5>
|
||||
</div>
|
||||
<p>
|
||||
1403 Washington Ave, New Orlea ns, LA 70130, United States
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-xl-2 col-lg-3 col-sm-6">
|
||||
<div className="footer-widget footer-contact">
|
||||
<div className="footer-title">
|
||||
<h5>contact us</h5>
|
||||
</div>
|
||||
<ul>
|
||||
<li>
|
||||
<a href="mailto:wellfood@gmail.com">
|
||||
<u>wellfood@gmail.com</u>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="callto:+(1)0987654321">+(1) 098 765 4321</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-xl-3 col-lg-4 col-sm-6">
|
||||
<div className="footer-widget opening-hour">
|
||||
<div className="footer-title">
|
||||
<h5>opening hour</h5>
|
||||
</div>
|
||||
<ul>
|
||||
<li>
|
||||
Monday – Friday: <span>8am – 4pm</span>
|
||||
</li>
|
||||
<li>
|
||||
Saturday: <span>8am – 12am</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-xl-3 col-lg-4 col-sm-6">
|
||||
<div className="footer-widget footer-text">
|
||||
<div className="footer-title">
|
||||
<h5>Follow Us</h5>
|
||||
</div>
|
||||
<div className="social-style-one mt-5">
|
||||
<Link href="contact">
|
||||
<i className="fab fa-facebook-f" />
|
||||
</Link>
|
||||
<Link href="contact">
|
||||
<i className="fab fa-twitter" />
|
||||
</Link>
|
||||
<Link href="contact">
|
||||
<i className="fab fa-linkedin-in" />
|
||||
</Link>
|
||||
<Link href="contact">
|
||||
<i className="fab fa-instagram" />
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="footer-bottom pt-30 pb-15">
|
||||
<div className="container rel text-center">
|
||||
<ul className="footer-bottom-nav">
|
||||
<li>
|
||||
<Link href="product-details">Hamburger</Link>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">Pizza</a>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="product-details">Vegetable roll</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="product-details">Sea fish</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="product-details">Fried chicken</Link>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">Burger</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">Saladr</a>
|
||||
</li>
|
||||
</ul>
|
||||
{/* Scroll Top Button */}
|
||||
<button className="scroll-top scroll-to-target" data-target="html">
|
||||
<i className="fas fa-arrow-alt-up" />
|
||||
</button>
|
||||
</div>
|
||||
<hr className="mt-25 mb-30" />
|
||||
<div className="container">
|
||||
<div className="row">
|
||||
<div className="col-lg-5">
|
||||
<div className="copyright-text text-center text-lg-start">
|
||||
<p>
|
||||
Copyright 2024 <Link href="/">Wellfood</Link>. All Rights
|
||||
Reserved{" "}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="col-lg-7 text-center text-lg-end">
|
||||
<ul className="footer-bottom-nav">
|
||||
<li>
|
||||
<a href="#">Privacy Policy</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="#">Terms & Condition</a>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
);
|
||||
};
|
||||
745
layout/Header.js
Normal file
@ -0,0 +1,745 @@
|
||||
"use client";
|
||||
import { wellfoodUtility } from "@/utility";
|
||||
import useClickOutside from "@/utility/useClickOutside";
|
||||
import Link from "next/link";
|
||||
import { Fragment, useEffect, useState } from "react";
|
||||
|
||||
const Sidebar = () => {
|
||||
return (
|
||||
<Fragment>
|
||||
{/*Form Back Drop*/}
|
||||
<div
|
||||
className="form-back-drop"
|
||||
onClick={() =>
|
||||
document
|
||||
.querySelector("body")
|
||||
.classList.remove("side-content-visible")
|
||||
}
|
||||
/>
|
||||
{/* Hidden Sidebar */}
|
||||
<section className="hidden-bar">
|
||||
<div className="inner-box text-center">
|
||||
<div
|
||||
className="cross-icon"
|
||||
onClick={() =>
|
||||
document
|
||||
.querySelector("body")
|
||||
.classList.remove("side-content-visible")
|
||||
}
|
||||
>
|
||||
<span className="fa fa-times" />
|
||||
</div>
|
||||
<div className="title">
|
||||
<h4>Get Appointment</h4>
|
||||
</div>
|
||||
{/*Appointment Form*/}
|
||||
<div className="appointment-form">
|
||||
<form
|
||||
onSubmit={(e) => {
|
||||
e.preventDefault();
|
||||
document
|
||||
.querySelector("body")
|
||||
.classList.remove("side-content-visible");
|
||||
}}
|
||||
>
|
||||
<div className="form-group">
|
||||
<input
|
||||
type="text"
|
||||
name="text"
|
||||
defaultValue=""
|
||||
placeholder="Name"
|
||||
required=""
|
||||
/>
|
||||
</div>
|
||||
<div className="form-group">
|
||||
<input
|
||||
type="email"
|
||||
name="email"
|
||||
defaultValue=""
|
||||
placeholder="Email Address"
|
||||
required=""
|
||||
/>
|
||||
</div>
|
||||
<div className="form-group">
|
||||
<textarea placeholder="Message" rows={5} defaultValue={""} />
|
||||
</div>
|
||||
<div className="form-group">
|
||||
<button type="submit" className="theme-btn style-two">
|
||||
Submit now
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
{/*Social Icons*/}
|
||||
<div className="social-style-one">
|
||||
<Link href="https://www.facebook.com/shivasdosa/">
|
||||
<i className="fab fa-facebook-f" />
|
||||
</Link>
|
||||
<Link href="#">
|
||||
<i className="fab fa-twitter" />
|
||||
</Link>
|
||||
<Link href="#">
|
||||
<i className="fab fa-linkedin-in" />
|
||||
</Link>
|
||||
<Link href="https://www.instagram.com/shivasdosa/">
|
||||
<i className="fab fa-instagram" />
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
{/*End Hidden Sidebar */}
|
||||
</Fragment>
|
||||
);
|
||||
};
|
||||
|
||||
const SearchBtn = () => {
|
||||
const [toggleSearch, setToggleSearch] = useState(false);
|
||||
|
||||
let domNode = useClickOutside(() => {
|
||||
setToggleSearch(false);
|
||||
});
|
||||
return (
|
||||
<div className="nav-search py-10" ref={domNode}>
|
||||
<button
|
||||
className="far fa-search"
|
||||
onClick={() => setToggleSearch(!toggleSearch)}
|
||||
/>
|
||||
<form
|
||||
onSubmit={(e) => {
|
||||
e.preventDefault();
|
||||
setToggleSearch(false);
|
||||
}}
|
||||
className={toggleSearch ? "" : "hide"}
|
||||
>
|
||||
<input
|
||||
type="text"
|
||||
placeholder="Search"
|
||||
className="searchbox"
|
||||
required=""
|
||||
/>
|
||||
<button type="submit" className="searchbutton far fa-search" />
|
||||
</form>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
const MobileMenu = () => {
|
||||
const [toggle, setToggle] = useState(false);
|
||||
const [activeMenu, setActiveMenu] = useState("");
|
||||
const activeMenuSet = (value) =>
|
||||
setActiveMenu(activeMenu === value ? "" : value),
|
||||
activeLi = (value) =>
|
||||
value === activeMenu ? { display: "block" } : { display: "none" };
|
||||
return (
|
||||
<Fragment>
|
||||
<header className="main-header white-menu menu-absolute d-block d-xl-none">
|
||||
{/*Header-Upper*/}
|
||||
<div className="header-upper">
|
||||
<div className="container-fluid clearfix">
|
||||
<div className="header-inner rel d-flex align-items-center justify-content-between">
|
||||
<div className="logo-outer">
|
||||
<div className="logo">
|
||||
<Link href="/">
|
||||
<img
|
||||
src="/assets/images/logos/logo.webp"
|
||||
alt="Logo"
|
||||
title="Logo"
|
||||
/>
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
<div className="nav-outer ms-lg-5 ps-xxl-4 clearfix">
|
||||
{/* Main Menu */}
|
||||
<nav className="main-menu navbar-expand-lg">
|
||||
<div className="navbar-header py-10">
|
||||
<div className="mobile-logo">
|
||||
<Link href="/" className="d-flex gap-2 align-items-center">
|
||||
<img
|
||||
src="/assets/images/logos/logo.webp"
|
||||
alt="Logo"
|
||||
title="Logo"
|
||||
/>
|
||||
{/* <h3 className="mb-0 text-white">SHIVASAKTHI</h3> */}
|
||||
</Link>
|
||||
</div>
|
||||
{/* Toggle Button */}
|
||||
<button
|
||||
type="button"
|
||||
className="navbar-toggle"
|
||||
data-bs-toggle="collapse"
|
||||
data-bs-target=".navbar-collapse"
|
||||
onClick={() => setToggle(!toggle)}
|
||||
>
|
||||
<span className="icon-bar" />
|
||||
<span className="icon-bar" />
|
||||
<span className="icon-bar" />
|
||||
</button>
|
||||
</div>
|
||||
<div
|
||||
className={`navbar-collapse collapse clearfix ${toggle ? "show" : ""
|
||||
}`}
|
||||
>
|
||||
<ul className="navigation clearfix ">
|
||||
{/* <li className="dropdown">
|
||||
<a href="#">Home</a>
|
||||
<ul>
|
||||
<li>
|
||||
<Link href="/">Home Restauran</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="index2">Home Pizza</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="index3">Home Burger</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="index4">Home Chiken</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="index5">Juice & Drinks</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="index6">Home Grill</Link>
|
||||
</li>
|
||||
</ul>
|
||||
<div className="dropdown-btn">
|
||||
<span className="far fa-angle-down" />
|
||||
</div>
|
||||
</li> */}
|
||||
|
||||
<li>
|
||||
<Link href="/">Home</Link>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<Link href="/about">About Us</Link>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<Link href="/menu">Food Menu</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="/blog">Blog</Link>
|
||||
</li>
|
||||
|
||||
{/* <li className="dropdown">
|
||||
<a href="#">Menu</a>
|
||||
<ul>
|
||||
<li>
|
||||
<Link href="menu-restaurant">Menu Restaurant</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="menu-pizza">Menu Pizza</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="menu-grill">Menu Gril</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="menu-burger">Menu Burger</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="menu-sea-food">Menu Sea Food</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="menu-chicken">Menu Chicken</Link>
|
||||
</li>
|
||||
</ul>
|
||||
<div className="dropdown-btn">
|
||||
<span className="far fa-angle-down" />
|
||||
</div>
|
||||
</li> */}
|
||||
{/* <li className="dropdown">
|
||||
<a href="#">pages</a>
|
||||
<ul>
|
||||
<li>
|
||||
<Link href="about">About Us</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="history">Our History</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="faq">faqs</Link>
|
||||
</li>
|
||||
<li className="dropdown">
|
||||
<a href="#">chefs</a>
|
||||
<ul>
|
||||
<li>
|
||||
<Link href="chefs">Our chefs</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="chef-details">chef Details</Link>
|
||||
</li>
|
||||
</ul>
|
||||
<div className="dropdown-btn">
|
||||
<span className="far fa-angle-down" />
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="gallery">Gallery</Link>
|
||||
</li>
|
||||
</ul>
|
||||
<div className="dropdown-btn">
|
||||
<span className="far fa-angle-down" />
|
||||
</div>
|
||||
</li> */}
|
||||
{/* <li className="dropdown">
|
||||
<a href="#">blog</a>
|
||||
<ul style={activeLi("blog")}>
|
||||
<li>
|
||||
<Link href="blog">blog standard</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="blog-details">blog details</Link>
|
||||
</li>
|
||||
</ul>
|
||||
<div
|
||||
className="dropdown-btn"
|
||||
onClick={() => activeMenuSet("blog")}
|
||||
>
|
||||
<span className="far fa-angle-down" />
|
||||
</div>
|
||||
</li> */}
|
||||
{/* <li className="dropdown">
|
||||
<a href="#">shop</a>
|
||||
<ul>
|
||||
<li>
|
||||
<Link href="shop">Products</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="product-details">Product Details</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="cart">Shopping Cart</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="checkout">Checkout Page</Link>
|
||||
</li>
|
||||
</ul>
|
||||
<div className="dropdown-btn">
|
||||
<span className="far fa-angle-down" />
|
||||
</div>
|
||||
</li> */}
|
||||
<li>
|
||||
<Link href="/contact">Contact</Link>
|
||||
</li>
|
||||
</ul>
|
||||
{/* <ul className="navigation clearfix">
|
||||
<li className="dropdown" style={activeLi("home")}>
|
||||
<a href="#">Home</a>
|
||||
<ul>
|
||||
<li>
|
||||
<Link href="/">Home Restauran</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="index2">Home Pizza</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="index3">Home Burger</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="index4">Home Chiken</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="index5">Juice & Drinks</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="index6">Home Grill</Link>
|
||||
</li>
|
||||
</ul>
|
||||
<div
|
||||
className="dropdown-btn"
|
||||
onClick={() => activeMenuSet("home")}
|
||||
>
|
||||
<span className="far fa-angle-down" />
|
||||
</div>
|
||||
</li>
|
||||
<li className="dropdown">
|
||||
<a href="#">Menu</a>
|
||||
<ul style={activeLi("Menu")}>
|
||||
<li>
|
||||
<Link href="menu-restaurant">Menu Restaurant</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="menu-pizza">Menu Pizza</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="menu-grill">Menu Gril</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="menu-burger">Menu Burger</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="menu-sea-food">Menu Sea Food</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="menu-chicken">Menu Chicken</Link>
|
||||
</li>
|
||||
</ul>
|
||||
<div
|
||||
className="dropdown-btn"
|
||||
onClick={() => activeMenuSet("Menu")}
|
||||
>
|
||||
<span className="far fa-angle-down" />
|
||||
</div>
|
||||
</li>
|
||||
<li className="dropdown">
|
||||
<a href="#">pages</a>
|
||||
<ul style={activeLi("pages")}>
|
||||
<li>
|
||||
<Link href="about">About Us</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="history">Our History</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="faq">faqs</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="chefs">Our chefs</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="chef-details">chef Details</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="gallery">Gallery</Link>
|
||||
</li>
|
||||
</ul>
|
||||
<div
|
||||
className="dropdown-btn"
|
||||
onClick={() => activeMenuSet("pages")}
|
||||
>
|
||||
<span className="far fa-angle-down" />
|
||||
</div>
|
||||
</li>
|
||||
<li className="dropdown">
|
||||
<a href="#">blog</a>
|
||||
<ul style={activeLi("blog")}>
|
||||
<li>
|
||||
<Link href="blog">blog standard</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="blog-details">blog details</Link>
|
||||
</li>
|
||||
</ul>
|
||||
<div
|
||||
className="dropdown-btn"
|
||||
onClick={() => activeMenuSet("blog")}
|
||||
>
|
||||
<span className="far fa-angle-down" />
|
||||
</div>
|
||||
</li>
|
||||
<li className="dropdown">
|
||||
<a href="#">shop</a>
|
||||
<ul style={activeLi("shop")}>
|
||||
<li>
|
||||
<Link href="shop">Products</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="product-details">Product Details</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="product-details">Product Details</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="cart">Shopping Cart</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="checkout">Checkout Page</Link>
|
||||
</li>
|
||||
</ul>
|
||||
<div
|
||||
className="dropdown-btn"
|
||||
onClick={() => activeMenuSet("shop")}
|
||||
>
|
||||
<span className="far fa-angle-down" />
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="contact">Contact</Link>
|
||||
</li>
|
||||
</ul> */}
|
||||
</div>
|
||||
</nav>
|
||||
{/* Main Menu End*/}
|
||||
</div>
|
||||
{/* <div className="header-number">
|
||||
<i className="far fa-phone" />
|
||||
Call : <a href="callto:+88012345688">+880 123 456 88</a>
|
||||
</div>
|
||||
<SearchBtn />
|
||||
<div className="menu-btns">
|
||||
<button>
|
||||
<i className="far fa-shopping-cart" /> <span>2</span>
|
||||
</button>
|
||||
<Link href="contact" className="theme-btn">
|
||||
Book now <i className="far fa-arrow-alt-right" />
|
||||
</Link>
|
||||
<div className="menu-sidebar">
|
||||
<button
|
||||
className="bg-transparent"
|
||||
onClick={() =>
|
||||
document
|
||||
.querySelector("body")
|
||||
.classList.add("side-content-visible")
|
||||
}
|
||||
/>
|
||||
</div>
|
||||
</div> */}
|
||||
</div>
|
||||
</div>
|
||||
<div className="bg-lines">
|
||||
<span />
|
||||
<span />
|
||||
<span />
|
||||
<span />
|
||||
</div>
|
||||
</div>
|
||||
{/*End Header Upper*/}
|
||||
</header>
|
||||
</Fragment>
|
||||
);
|
||||
};
|
||||
|
||||
const Header = () => {
|
||||
useEffect(() => {
|
||||
wellfoodUtility.fixedHeader();
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<Fragment>
|
||||
<header className="main-header white-menu menu-absolute d-none d-xl-block">
|
||||
{/*Header-Upper*/}
|
||||
<div className="header-upper">
|
||||
<div className="container clearfix">
|
||||
<div className="header-inner rel d-flex align-items-center justify-content-between">
|
||||
<div className="logo-outer">
|
||||
<div className="logo">
|
||||
<Link href="/" className="d-flex gap-2 align-items-center">
|
||||
<img
|
||||
src="/assets/images/logos/logo.webp"
|
||||
alt="Logo"
|
||||
title="Logo"
|
||||
/>
|
||||
{/* <h3 className="mb-0 text-white">SHIVASAKTHI</h3> */}
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
<div className="nav-outer ms-lg-5 ps-xxl-4 clearfix">
|
||||
{/* Main Menu */}
|
||||
<nav className="main-menu navbar-expand-lg">
|
||||
<div className="navbar-header py-10">
|
||||
<div className="mobile-logo">
|
||||
<Link href="/">
|
||||
<img
|
||||
src="/assets/images/logos/logo.png"
|
||||
alt="Logo"
|
||||
title="Logo"
|
||||
/>
|
||||
</Link>
|
||||
</div>
|
||||
{/* Toggle Button */}
|
||||
<button
|
||||
type="button"
|
||||
className="navbar-toggle"
|
||||
data-bs-toggle="collapse"
|
||||
data-bs-target=".navbar-collapse"
|
||||
>
|
||||
<span className="icon-bar" />
|
||||
<span className="icon-bar" />
|
||||
<span className="icon-bar" />
|
||||
</button>
|
||||
</div>
|
||||
<div className="navbar-collapse collapse clearfix">
|
||||
<ul className="navigation clearfix ">
|
||||
{/* <li className="dropdown">
|
||||
<a href="#">Home</a>
|
||||
<ul>
|
||||
<li>
|
||||
<Link href="/">Home Restauran</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="index2">Home Pizza</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="index3">Home Burger</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="index4">Home Chiken</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="index5">Juice & Drinks</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="index6">Home Grill</Link>
|
||||
</li>
|
||||
</ul>
|
||||
<div className="dropdown-btn">
|
||||
<span className="far fa-angle-down" />
|
||||
</div>
|
||||
</li> */}
|
||||
|
||||
<li>
|
||||
<Link href="/">Home</Link>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<Link href="/about">About Us</Link>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<Link href="/menu">Food Menu</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="/blog">Blog</Link>
|
||||
</li>
|
||||
|
||||
{/* <li className="dropdown">
|
||||
<a href="#">Menu</a>
|
||||
<ul>
|
||||
<li>
|
||||
<Link href="menu-restaurant">Menu Restaurant</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="menu-pizza">Menu Pizza</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="menu-grill">Menu Gril</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="menu-burger">Menu Burger</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="menu-sea-food">Menu Sea Food</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="menu-chicken">Menu Chicken</Link>
|
||||
</li>
|
||||
</ul>
|
||||
<div className="dropdown-btn">
|
||||
<span className="far fa-angle-down" />
|
||||
</div>
|
||||
</li> */}
|
||||
{/* <li className="dropdown">
|
||||
<a href="#">pages</a>
|
||||
<ul>
|
||||
<li>
|
||||
<Link href="about">About Us</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="history">Our History</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="faq">faqs</Link>
|
||||
</li>
|
||||
<li className="dropdown">
|
||||
<a href="#">chefs</a>
|
||||
<ul>
|
||||
<li>
|
||||
<Link href="chefs">Our chefs</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="chef-details">chef Details</Link>
|
||||
</li>
|
||||
</ul>
|
||||
<div className="dropdown-btn">
|
||||
<span className="far fa-angle-down" />
|
||||
</div>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="gallery">Gallery</Link>
|
||||
</li>
|
||||
</ul>
|
||||
<div className="dropdown-btn">
|
||||
<span className="far fa-angle-down" />
|
||||
</div>
|
||||
</li> */}
|
||||
{/* <li className="dropdown">
|
||||
<a href="#">blog</a>
|
||||
<ul>
|
||||
<li>
|
||||
<Link href="blog">blog standard</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="blog-details">blog details</Link>
|
||||
</li>
|
||||
</ul>
|
||||
<div className="dropdown-btn">
|
||||
<span className="far fa-angle-down" />
|
||||
</div>
|
||||
</li> */}
|
||||
{/* <li className="dropdown">
|
||||
<a href="#">shop</a>
|
||||
<ul>
|
||||
<li>
|
||||
<Link href="shop">Products</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="product-details">Product Details</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="cart">Shopping Cart</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link href="checkout">Checkout Page</Link>
|
||||
</li>
|
||||
</ul>
|
||||
<div className="dropdown-btn">
|
||||
<span className="far fa-angle-down" />
|
||||
</div>
|
||||
</li> */}
|
||||
<li>
|
||||
<Link href="/contact">Contact</Link>
|
||||
</li>
|
||||
</ul>
|
||||
<div className="menu-btns" style={{ paddingLeft: "30px" }}>
|
||||
<Link href="https://gosnappy.io/owa/r/shiva-sakthi-restaurant/5921/menu_655/" target="_blank" className="theme-btn">
|
||||
Order now <i className="far fa-arrow-alt-right" />
|
||||
</Link>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
{/* Main Menu End*/}
|
||||
</div>
|
||||
{/* <div className="header-number">
|
||||
<i className="far fa-phone" />
|
||||
Call : <a href="callto:+88012345688">+880 123 456 88</a>
|
||||
</div> */}
|
||||
{/* Nav Search */}
|
||||
{/* <SearchBtn /> */}
|
||||
{/* Menu Button */}
|
||||
{/* <div className="menu-btns">
|
||||
<button>
|
||||
<i className="far fa-shopping-cart" /> <span>2</span>
|
||||
</button>
|
||||
<Link href="contact" className="theme-btn">
|
||||
Book now <i className="far fa-arrow-alt-right" />
|
||||
</Link>
|
||||
|
||||
<div className="menu-sidebar">
|
||||
<button
|
||||
className="bg-transparent"
|
||||
onClick={() =>
|
||||
document
|
||||
.querySelector("body")
|
||||
.classList.add("side-content-visible")
|
||||
}
|
||||
/>
|
||||
</div>
|
||||
</div> */}
|
||||
</div>
|
||||
</div>
|
||||
<div className="bg-lines">
|
||||
<span />
|
||||
<span />
|
||||
<span />
|
||||
<span />
|
||||
</div>
|
||||
</div>
|
||||
{/*End Header Upper*/}
|
||||
</header>
|
||||
<MobileMenu />
|
||||
{/* <Sidebar /> */}
|
||||
</Fragment>
|
||||
);
|
||||
};
|
||||
export default Header;
|
||||
32
layout/WellFoodLayout.js
Normal file
@ -0,0 +1,32 @@
|
||||
"use client";
|
||||
import { wellfoodUtility } from "@/utility";
|
||||
import { useEffect } from "react";
|
||||
import niceSelect from "react-nice-select";
|
||||
import Footer from "./Footer";
|
||||
import Header from "./Header";
|
||||
|
||||
const WellFoodLayout = ({ children, bgBlack, footer }) => {
|
||||
useEffect(() => {
|
||||
niceSelect();
|
||||
wellfoodUtility.animation();
|
||||
console.log(bgBlack);
|
||||
if (bgBlack) {
|
||||
document.querySelector(".page-wrapper").classList.add("bg-black");
|
||||
} else {
|
||||
if (
|
||||
document.querySelector(".page-wrapper").classList.contains("bg-black")
|
||||
) {
|
||||
document.querySelector(".page-wrapper").classList.remove("bg-black");
|
||||
}
|
||||
}
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<div className="page-wrapper">
|
||||
<Header />
|
||||
{children}
|
||||
<Footer footer={footer} />
|
||||
</div>
|
||||
);
|
||||
};
|
||||
export default WellFoodLayout;
|
||||
22
next.config.js
Normal file
@ -0,0 +1,22 @@
|
||||
/** @type {import('next').NextConfig} */
|
||||
const nextConfig = {
|
||||
output: "export",
|
||||
reactStrictMode: false,
|
||||
trailingSlash: true, // if needed for static export
|
||||
|
||||
async headers() {
|
||||
return [
|
||||
{
|
||||
source: '/(.*)', // apply this to all routes
|
||||
headers: [
|
||||
{
|
||||
key: 'Cache-Control',
|
||||
value: 'no-store, no-cache, must-revalidate, proxy-revalidate',
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
},
|
||||
};
|
||||
|
||||
module.exports = nextConfig;
|
||||
1223
package-lock.json
generated
Normal file
27
package.json
Normal file
@ -0,0 +1,27 @@
|
||||
{
|
||||
"name": "shivasakthi-restarunt",
|
||||
"version": "0.1.0",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "next dev",
|
||||
"build": "next build",
|
||||
"start": "next start",
|
||||
"lint": "next lint"
|
||||
},
|
||||
"dependencies": {
|
||||
"aos": "^2.3.4",
|
||||
"axios": "^1.9.0",
|
||||
"isotope-layout": "^3.0.6",
|
||||
"next": "14.2.4",
|
||||
"react": "^18",
|
||||
"react-bootstrap": "^1.6.1",
|
||||
"react-circular-progressbar": "^2.1.0",
|
||||
"react-countup": "^6.5.3",
|
||||
"react-dom": "^18",
|
||||
"react-google-recaptcha": "^3.1.0",
|
||||
"react-nice-select": "^1.0.6",
|
||||
"react-player": "^2.16.0",
|
||||
"react-slick": "^0.30.2",
|
||||
"react-visibility-sensor": "^5.1.1"
|
||||
}
|
||||
}
|
||||
1
public/assets/css/aos.css
Normal file
7
public/assets/css/bootstrap.min.css
vendored
Normal file
12
public/assets/css/flaticon.min.css
vendored
Normal file
@ -0,0 +1,12 @@
|
||||
/*!
|
||||
* ______ _ _ _
|
||||
* | ____| | | | (_)
|
||||
* | |__ | | __ _| |_ _ ___ ___ _ __
|
||||
* | __| | |/ _` | __| |/ __/ _ \| '_ \
|
||||
* | | | | (_| | |_| | (_| (_) | | | |
|
||||
* |_| |_|\__,_|\__|_|\___\___/|_| |_|
|
||||
*
|
||||
* https://www.flaticon.com
|
||||
*/
|
||||
|
||||
@font-face{font-family:flaticon_wellfood;src:url("../fonts/flaticon_wellfood.woff2?b408068d07dc6882716d7cd15a2e1a88") format("woff2"),url("../fonts/flaticon_wellfood.woff?b408068d07dc6882716d7cd15a2e1a88") format("woff"),url("../fonts/flaticon_wellfood.eot?b408068d07dc6882716d7cd15a2e1a88#iefix") format("embedded-opentype"),url("../fonts/flaticon_wellfood.ttf?b408068d07dc6882716d7cd15a2e1a88") format("truetype"),url("../fonts/flaticon_wellfood.svg?b408068d07dc6882716d7cd15a2e1a88#flaticon_wellfood") format("svg")}i[class*=" flaticon-"]:before,i[class^=flaticon-]:before{font-family:flaticon_wellfood!important;font-style:normal;font-weight:400!important;font-variant:normal;text-transform:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.flaticon-star-1:before{content:"\f101"}.flaticon-star:before{content:"\f102"}.flaticon-quote:before{content:"\f103"}.flaticon-dish:before{content:"\f104"}.flaticon-fast-delivery:before{content:"\f105"}.flaticon-cashback:before{content:"\f106"}.flaticon-recommended-food:before{content:"\f107"}.flaticon-chef:before{content:"\f108"}.flaticon-high-quality:before{content:"\f109"}.flaticon-ship:before{content:"\f10a"}.flaticon-rate:before{content:"\f10b"}.flaticon-medal:before{content:"\f10c"}.flaticon-happiness:before{content:"\f10d"}.flaticon-poinsettia:before{content:"\f10e"}.flaticon-crab:before{content:"\f10f"}.flaticon-crawfish:before{content:"\f110"}.flaticon-fried-potatoes:before{content:"\f111"}.flaticon-cupcake:before{content:"\f112"}.flaticon-broccoli:before{content:"\f113"}
|
||||
5
public/assets/css/fontawesome-5.14.0.min.css
vendored
Normal file
7
public/assets/css/jquery-ui.min.css
vendored
Normal file
2
public/assets/css/magnific-popup.min.css
vendored
Normal file
1
public/assets/css/nice-select.min.css
vendored
Normal file
@ -0,0 +1 @@
|
||||
.nice-select{-webkit-tap-highlight-color:transparent;background-color:#fff;border-radius:5px;border:solid 1px #e8e8e8;box-sizing:border-box;clear:both;cursor:pointer;display:block;float:left;font-family:inherit;font-size:14px;font-weight:400;height:42px;line-height:40px;outline:0;padding-left:18px;padding-right:30px;position:relative;text-align:left!important;-webkit-transition:all .2s ease-in-out;transition:all .2s ease-in-out;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;white-space:nowrap;width:auto}.nice-select:hover{border-color:#dbdbdb}.nice-select.open,.nice-select:active,.nice-select:focus{border-color:#999}.nice-select:after{border-bottom:2px solid #999;border-right:2px solid #999;content:'';display:block;height:5px;margin-top:-4px;pointer-events:none;position:absolute;right:12px;top:50%;-webkit-transform-origin:66% 66%;-ms-transform-origin:66% 66%;transform-origin:66% 66%;-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg);-webkit-transition:all .15s ease-in-out;transition:all .15s ease-in-out;width:5px}.nice-select.open:after{-webkit-transform:rotate(-135deg);-ms-transform:rotate(-135deg);transform:rotate(-135deg)}.nice-select.open .list{opacity:1;pointer-events:auto;-webkit-transform:scale(1) translateY(0);-ms-transform:scale(1) translateY(0);transform:scale(1) translateY(0)}.nice-select.disabled{border-color:#ededed;color:#999;pointer-events:none}.nice-select.disabled:after{border-color:#ccc}.nice-select.wide{width:100%}.nice-select.wide .list{left:0!important;right:0!important}.nice-select.right{float:right}.nice-select.right .list{left:auto;right:0}.nice-select.small{font-size:12px;height:36px;line-height:34px}.nice-select.small:after{height:4px;width:4px}.nice-select.small .option{line-height:34px;min-height:34px}.nice-select .list{background-color:#fff;border-radius:5px;box-shadow:0 0 0 1px rgba(68,68,68,.11);box-sizing:border-box;margin-top:4px;opacity:0;overflow:hidden;padding:0;pointer-events:none;position:absolute;top:100%;left:0;-webkit-transform-origin:50% 0;-ms-transform-origin:50% 0;transform-origin:50% 0;-webkit-transform:scale(.75) translateY(-21px);-ms-transform:scale(.75) translateY(-21px);transform:scale(.75) translateY(-21px);-webkit-transition:all .2s cubic-bezier(.5, 0, 0, 1.25),opacity .15s ease-out;transition:all .2s cubic-bezier(.5, 0, 0, 1.25),opacity .15s ease-out;z-index:9}.nice-select .list:hover .option:not(:hover){background-color:transparent!important}.nice-select .option{cursor:pointer;font-weight:400;line-height:40px;list-style:none;min-height:40px;outline:0;padding-left:18px;padding-right:29px;text-align:left;-webkit-transition:all .2s;transition:all .2s}.nice-select .option.focus,.nice-select .option.selected.focus,.nice-select .option:hover{background-color:#f6f6f6}.nice-select .option.selected{font-weight:700}.nice-select .option.disabled{background-color:transparent;color:#999;cursor:default}.no-csspointerevents .nice-select .list{display:none}.no-csspointerevents .nice-select.open .list{display:block}
|
||||
2
public/assets/css/slick.min.css
vendored
Normal file
@ -0,0 +1,2 @@
|
||||
/* Slick Slider */
|
||||
.slick-slider{position:relative;display:block;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-touch-callout:none;-khtml-user-select:none;-ms-touch-action:pan-y;touch-action:pan-y;-webkit-tap-highlight-color:transparent}.slick-list{position:relative;display:block;overflow:hidden;margin:0;padding:0}.slick-list:focus{outline:0}.slick-list.dragging{cursor:pointer;cursor:hand}.slick-slider .slick-list,.slick-slider .slick-track{-webkit-transform:translate3d(0,0,0);-moz-transform:translate3d(0,0,0);-ms-transform:translate3d(0,0,0);-o-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.slick-track{position:relative;top:0;left:0;display:block;margin-left:auto;margin-right:auto}.slick-track:after,.slick-track:before{display:table;content:""}.slick-track:after{clear:both}.slick-loading .slick-track{visibility:hidden}.slick-slide{display:none;float:left;height:100%;min-height:1px}[dir=rtl] .slick-slide{float:right}.slick-slide img{display:block}.slick-slide.slick-loading img{display:none}.slick-slide.dragging img{pointer-events:none}.slick-initialized .slick-slide{display:block}.slick-loading .slick-slide{visibility:hidden}.slick-vertical .slick-slide{display:block;height:auto;border:1px solid transparent}.slick-arrow.slick-hidden{display:none}
|
||||
12355
public/assets/css/style.css
Normal file
12072
public/assets/css/update.css
Normal file
BIN
public/assets/fonts/fa-brands-400.eot
Normal file
3637
public/assets/fonts/fa-brands-400.svg
Normal file
|
After Width: | Height: | Size: 713 KiB |
BIN
public/assets/fonts/fa-brands-400.ttf
Normal file
BIN
public/assets/fonts/fa-brands-400.woff
Normal file
BIN
public/assets/fonts/fa-brands-400.woff2
Normal file
BIN
public/assets/fonts/fa-duotone-900.eot
Normal file
15299
public/assets/fonts/fa-duotone-900.svg
Normal file
|
After Width: | Height: | Size: 2.5 MiB |
BIN
public/assets/fonts/fa-duotone-900.ttf
Normal file
BIN
public/assets/fonts/fa-duotone-900.woff
Normal file
BIN
public/assets/fonts/fa-duotone-900.woff2
Normal file
BIN
public/assets/fonts/fa-light-300.eot
Normal file
12397
public/assets/fonts/fa-light-300.svg
Normal file
|
After Width: | Height: | Size: 2.3 MiB |
BIN
public/assets/fonts/fa-light-300.ttf
Normal file
BIN
public/assets/fonts/fa-light-300.woff
Normal file
BIN
public/assets/fonts/fa-light-300.woff2
Normal file
BIN
public/assets/fonts/fa-regular-400.eot
Normal file
11299
public/assets/fonts/fa-regular-400.svg
Normal file
|
After Width: | Height: | Size: 2.1 MiB |
BIN
public/assets/fonts/fa-regular-400.ttf
Normal file
BIN
public/assets/fonts/fa-regular-400.woff
Normal file
BIN
public/assets/fonts/fa-regular-400.woff2
Normal file
BIN
public/assets/fonts/fa-solid-900.eot
Normal file
9634
public/assets/fonts/fa-solid-900.svg
Normal file
|
After Width: | Height: | Size: 1.7 MiB |
BIN
public/assets/fonts/fa-solid-900.ttf
Normal file
BIN
public/assets/fonts/fa-solid-900.woff
Normal file
BIN
public/assets/fonts/fa-solid-900.woff2
Normal file
89
public/assets/fonts/flaticon_wellfood.css
Normal file
@ -0,0 +1,89 @@
|
||||
/*!
|
||||
* ______ _ _ _
|
||||
* | ____| | | | (_)
|
||||
* | |__ | | __ _| |_ _ ___ ___ _ __
|
||||
* | __| | |/ _` | __| |/ __/ _ \| '_ \
|
||||
* | | | | (_| | |_| | (_| (_) | | | |
|
||||
* |_| |_|\__,_|\__|_|\___\___/|_| |_|
|
||||
*
|
||||
* https://www.flaticon.com
|
||||
*/
|
||||
|
||||
@font-face {
|
||||
font-family: "flaticon_wellfood";
|
||||
src: url("./flaticon_wellfood.woff2?b408068d07dc6882716d7cd15a2e1a88") format("woff2"),
|
||||
url("./flaticon_wellfood.woff?b408068d07dc6882716d7cd15a2e1a88") format("woff"),
|
||||
url("./flaticon_wellfood.eot?b408068d07dc6882716d7cd15a2e1a88#iefix") format("embedded-opentype"),
|
||||
url("./flaticon_wellfood.ttf?b408068d07dc6882716d7cd15a2e1a88") format("truetype"),
|
||||
url("./flaticon_wellfood.svg?b408068d07dc6882716d7cd15a2e1a88#flaticon_wellfood") format("svg")
|
||||
}
|
||||
|
||||
i[class^="flaticon-"]:before, i[class*=" flaticon-"]:before {
|
||||
font-family: flaticon_wellfood !important;
|
||||
font-style: normal;
|
||||
font-weight: normal !important;
|
||||
font-variant: normal;
|
||||
text-transform: none;
|
||||
line-height: 1;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
.flaticon-star-1:before {
|
||||
content: "\f101";
|
||||
}
|
||||
.flaticon-star:before {
|
||||
content: "\f102";
|
||||
}
|
||||
.flaticon-quote:before {
|
||||
content: "\f103";
|
||||
}
|
||||
.flaticon-dish:before {
|
||||
content: "\f104";
|
||||
}
|
||||
.flaticon-fast-delivery:before {
|
||||
content: "\f105";
|
||||
}
|
||||
.flaticon-cashback:before {
|
||||
content: "\f106";
|
||||
}
|
||||
.flaticon-recommended-food:before {
|
||||
content: "\f107";
|
||||
}
|
||||
.flaticon-chef:before {
|
||||
content: "\f108";
|
||||
}
|
||||
.flaticon-high-quality:before {
|
||||
content: "\f109";
|
||||
}
|
||||
.flaticon-ship:before {
|
||||
content: "\f10a";
|
||||
}
|
||||
.flaticon-rate:before {
|
||||
content: "\f10b";
|
||||
}
|
||||
.flaticon-medal:before {
|
||||
content: "\f10c";
|
||||
}
|
||||
.flaticon-happiness:before {
|
||||
content: "\f10d";
|
||||
}
|
||||
.flaticon-poinsettia:before {
|
||||
content: "\f10e";
|
||||
}
|
||||
.flaticon-crab:before {
|
||||
content: "\f10f";
|
||||
}
|
||||
.flaticon-crawfish:before {
|
||||
content: "\f110";
|
||||
}
|
||||
.flaticon-fried-potatoes:before {
|
||||
content: "\f111";
|
||||
}
|
||||
.flaticon-cupcake:before {
|
||||
content: "\f112";
|
||||
}
|
||||
.flaticon-broccoli:before {
|
||||
content: "\f113";
|
||||
}
|
||||
|
||||
BIN
public/assets/fonts/flaticon_wellfood.eot
Normal file
665
public/assets/fonts/flaticon_wellfood.html
Normal file
@ -0,0 +1,665 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>Flaticon Webfont</title>
|
||||
<link rel="stylesheet" type="text/css" href="flaticon_wellfood.css"/>
|
||||
<meta charset="UTF-8">
|
||||
<style>
|
||||
html, body, div, span, applet, object, iframe,
|
||||
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
|
||||
a, abbr, acronym, address, big, cite, code,
|
||||
del, dfn, em, img, ins, kbd, q, s, samp,
|
||||
small, strike, strong, sub, sup, tt, var,
|
||||
b, u, i, center,
|
||||
dl, dt, dd, ol, ul, li,
|
||||
fieldset, form, label, legend,
|
||||
table, caption, tbody, tfoot, thead, tr, th, td,
|
||||
article, aside, canvas, details, embed,
|
||||
figure, figcaption, footer, header, hgroup,
|
||||
menu, nav, output, ruby, section, summary,
|
||||
time, mark, audio, video {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
font-size: 100%;
|
||||
font: inherit;
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
/* HTML5 display-role reset for older browsers */
|
||||
article, aside, details, figcaption, figure,
|
||||
footer, header, hgroup, menu, nav, section {
|
||||
display: block;
|
||||
}
|
||||
|
||||
body {
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
ol, ul {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
blockquote, q {
|
||||
quotes: none;
|
||||
}
|
||||
|
||||
blockquote:before, blockquote:after,
|
||||
q:before, q:after {
|
||||
content: '';
|
||||
content: none;
|
||||
}
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0;
|
||||
}
|
||||
|
||||
body {
|
||||
font-family: Inter, 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
||||
font-size: 15px;
|
||||
line-height: 1.6;
|
||||
color: #777777;
|
||||
}
|
||||
|
||||
a {
|
||||
color: #52D999;
|
||||
font-weight: bold;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
* {
|
||||
-moz-box-sizing: border-box;
|
||||
-webkit-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
[class^="flaticon-"]:before, [class*=" flaticon-"]:before, [class^="flaticon-"]:after, [class*=" flaticon-"]:after {
|
||||
font-family: Flaticon;
|
||||
font-size: 32px;
|
||||
line-height: 1.25;
|
||||
font-style: normal;
|
||||
margin-left: 20px;
|
||||
color: #424242;
|
||||
}
|
||||
|
||||
.wrapper {
|
||||
max-width: 600px;
|
||||
margin: auto;
|
||||
padding: 0 1em;
|
||||
}
|
||||
|
||||
.title {
|
||||
margin-bottom: 24px;
|
||||
text-transform: uppercase;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
header {
|
||||
text-align: center;
|
||||
padding: 24px;
|
||||
}
|
||||
|
||||
header .logo {
|
||||
height: auto;
|
||||
border: none;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
header strong {
|
||||
font-size: 24px;
|
||||
line-height: 1.25;
|
||||
font-weight: 500;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.demo {
|
||||
margin: 2em auto;
|
||||
line-height: 1.25;
|
||||
}
|
||||
|
||||
.demo ul li {
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
|
||||
.demo ul li code {
|
||||
background-color: #121212;
|
||||
border-radius: 3px;
|
||||
padding: 12px;
|
||||
display: inline-block;
|
||||
color: #fff;
|
||||
font-family: Consolas, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace;
|
||||
font-weight: lighter;
|
||||
margin-top: 12px;
|
||||
font-size: 13px;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
.demo ul li code .red {
|
||||
color: #EB644C;
|
||||
}
|
||||
|
||||
.demo ul li code .green {
|
||||
color: #52D999;
|
||||
}
|
||||
|
||||
.demo ul li code .yellow {
|
||||
color: #FFF4D9;
|
||||
}
|
||||
|
||||
.demo ul li code .blue {
|
||||
color: #648EEF;
|
||||
}
|
||||
|
||||
.demo ul li code .purple {
|
||||
color: #6569BD;
|
||||
}
|
||||
|
||||
.demo ul li code .dots {
|
||||
margin-top: 0.5em;
|
||||
display: block;
|
||||
}
|
||||
|
||||
#glyphs {
|
||||
border-bottom: 1px solid #E5E5E5;
|
||||
padding: 2em 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.glyph {
|
||||
display: inline-block;
|
||||
width: 9em;
|
||||
margin: 1em;
|
||||
text-align: center;
|
||||
vertical-align: top;
|
||||
background: #FFF;
|
||||
}
|
||||
|
||||
.glyph .flaticon {
|
||||
padding: 10px;
|
||||
display: block;
|
||||
font-family: "Flaticon";
|
||||
font-size: 64px;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.glyph .flaticon:before {
|
||||
font-size: 64px;
|
||||
color: #777777;
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.class-name {
|
||||
font-size: 0.65em;
|
||||
background-color: #E5E5E5;
|
||||
color: #9C9C9C;
|
||||
border-radius: 4px 4px 0 0;
|
||||
padding: 0.5em;
|
||||
font-family: Consolas, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace;
|
||||
}
|
||||
|
||||
.author-name {
|
||||
font-size: 0.6em;
|
||||
background-color: #EFF3F6;
|
||||
border-top: 0;
|
||||
border-radius: 0 0 4px 4px;
|
||||
padding: 0.5em;
|
||||
}
|
||||
|
||||
.author-name a {
|
||||
color: #121212;
|
||||
}
|
||||
|
||||
.class-name:last-child {
|
||||
font-size: 10px;
|
||||
line-height: 1.75;
|
||||
color: #888;
|
||||
}
|
||||
|
||||
.class-name:last-child a {
|
||||
font-size: 10px;
|
||||
line-height: 1.75;
|
||||
color: #555;
|
||||
}
|
||||
|
||||
.glyph > input {
|
||||
display: block;
|
||||
width: 100px;
|
||||
margin: 5px auto;
|
||||
text-align: center;
|
||||
font-size: 12px;
|
||||
line-height: 1.75;
|
||||
cursor: text;
|
||||
}
|
||||
|
||||
.glyph > input.icon-input {
|
||||
font-family: "Flaticon";
|
||||
font-size: 15px;
|
||||
line-height: 1.6;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.attribution .title {
|
||||
margin-top: 2em;
|
||||
}
|
||||
|
||||
.attribution textarea {
|
||||
background-color: #F8FAFB;
|
||||
color: #121212;
|
||||
padding: 1em;
|
||||
border: none;
|
||||
box-shadow: none;
|
||||
border: 1px solid #E5E5E5;
|
||||
border-radius: 4px;
|
||||
resize: none;
|
||||
width: 100%;
|
||||
height: 150px;
|
||||
font-size: 13px;
|
||||
line-height: 1.6;
|
||||
font-family: Consolas, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace;
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
|
||||
.attribution textarea:hover {
|
||||
border-color: #CFD9E0;
|
||||
}
|
||||
|
||||
.attribution textarea:focus {
|
||||
border-color: #52D999;
|
||||
}
|
||||
|
||||
.iconsuse {
|
||||
margin: 2em auto;
|
||||
text-align: center;
|
||||
max-width: 1200px;
|
||||
}
|
||||
|
||||
.iconsuse:after {
|
||||
content: '';
|
||||
display: table;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.iconsuse .image {
|
||||
float: left;
|
||||
width: 25%;
|
||||
padding: 0 1em;
|
||||
}
|
||||
|
||||
.iconsuse .image p {
|
||||
margin-bottom: 1em;
|
||||
}
|
||||
|
||||
.iconsuse .image span {
|
||||
display: block;
|
||||
font-size: 0.65em;
|
||||
background-color: #222;
|
||||
color: #fff;
|
||||
border-radius: 4px;
|
||||
padding: 10px;
|
||||
color: #FFFF99;
|
||||
margin-top: 1em;
|
||||
font-family: Consolas, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace;
|
||||
}
|
||||
|
||||
.flaticon:before {
|
||||
color: #777777;
|
||||
}
|
||||
|
||||
#footer {
|
||||
text-align: center;
|
||||
background-color: #121212;
|
||||
color: #9C9C9C;
|
||||
padding: 12px;
|
||||
font-size: 13px;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
#footer a {
|
||||
font-weight: normal;
|
||||
}
|
||||
|
||||
@media (max-width: 960px) {
|
||||
.iconsuse .image {
|
||||
width: 50%;
|
||||
}
|
||||
}
|
||||
|
||||
.preview {
|
||||
width: 100px;
|
||||
display: inline-block;
|
||||
margin: 10px;
|
||||
}
|
||||
|
||||
.preview .inner {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
background: #F7F7F7;
|
||||
-webkit-border-radius: 3px 3px 0 0;
|
||||
-moz-border-radius: 3px 3px 0 0;
|
||||
border-radius: 3px 3px 0 0;
|
||||
}
|
||||
|
||||
.preview .inner {
|
||||
line-height: 85px;
|
||||
font-size: 40px;
|
||||
color: #424242;
|
||||
}
|
||||
|
||||
.label {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
padding: 5px;
|
||||
font-size: 10px;
|
||||
font-family: Monaco, monospace;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
background: #ddd;
|
||||
-webkit-border-radius: 0 0 3px 3px;
|
||||
-moz-border-radius: 0 0 3px 3px;
|
||||
border-radius: 0 0 3px 3px;
|
||||
color: #777;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<a href="https://www.flaticon.com/" target="_blank" class="logo">
|
||||
<img src="https://media.flaticon.com/dist/min/img/logos/flaticon-by-positive-hor.svg" alt="logo">
|
||||
</a>
|
||||
</header>
|
||||
<section class="demo wrapper">
|
||||
|
||||
<p class="title">Webfont Instructions</p>
|
||||
|
||||
<ul>
|
||||
<li>
|
||||
<span class="num">1. </span>Copy the "Fonts" files and CSS files to your website CSS folder.
|
||||
</li>
|
||||
<li>
|
||||
<span class="num">2. </span>Add the CSS link to your website source code on header.
|
||||
<code class="big">
|
||||
<<span class="red">head</span>>
|
||||
<br/><span class="dots">...</span>
|
||||
<br/><<span class="red">link</span> <span class="green">rel</span>=<span
|
||||
class="yellow">"stylesheet"</span> <span class="green">type</span>=<span
|
||||
class="yellow">"text/css"</span> <span class="green">href</span>=<span class="yellow">"your_website_domain/css_root/flaticon_collection_name.css"</span>>
|
||||
<br/><span class="dots">...</span>
|
||||
<br/></<span class="red">head</span>>
|
||||
</code>
|
||||
</li>
|
||||
|
||||
<li>
|
||||
<p>
|
||||
<span class="num">3. </span>Use the icon class on <code>"<span class="blue">display</span>:<span
|
||||
class="purple"> inline</span>"</code> elements:
|
||||
<br/>
|
||||
Use example: <code><<span class="red">i</span> <span class="green">class</span>=<span class="yellow">"flaticon-airplane49"</span>></<span
|
||||
class="red">i</span>></code> or <code><<span class="red">span</span> <span
|
||||
class="green">class</span>=<span class="yellow">"flaticon-airplane49"</span>></<span
|
||||
class="red">span</span>></code>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
</section>
|
||||
<section id="glyphs">
|
||||
<div class="glyph">
|
||||
<i class="flaticon flaticon-star-1"></i>
|
||||
<div class="class-name">.flaticon-star-1</div>
|
||||
<div class="author-name">Author: #author-link-flaticon-star-1# </div>
|
||||
</div>
|
||||
|
||||
<div class="glyph">
|
||||
<i class="flaticon flaticon-star"></i>
|
||||
<div class="class-name">.flaticon-star</div>
|
||||
<div class="author-name">Author: #author-link-flaticon-star# </div>
|
||||
</div>
|
||||
|
||||
<div class="glyph">
|
||||
<i class="flaticon flaticon-quote"></i>
|
||||
<div class="class-name">.flaticon-quote</div>
|
||||
<div class="author-name">Author: #author-link-flaticon-quote# </div>
|
||||
</div>
|
||||
|
||||
<div class="glyph">
|
||||
<i class="flaticon flaticon-dish"></i>
|
||||
<div class="class-name">.flaticon-dish</div>
|
||||
<div class="author-name">Author: #author-link-flaticon-dish# </div>
|
||||
</div>
|
||||
|
||||
<div class="glyph">
|
||||
<i class="flaticon flaticon-fast-delivery"></i>
|
||||
<div class="class-name">.flaticon-fast-delivery</div>
|
||||
<div class="author-name">Author: #author-link-flaticon-fast-delivery# </div>
|
||||
</div>
|
||||
|
||||
<div class="glyph">
|
||||
<i class="flaticon flaticon-cashback"></i>
|
||||
<div class="class-name">.flaticon-cashback</div>
|
||||
<div class="author-name">Author: #author-link-flaticon-cashback# </div>
|
||||
</div>
|
||||
|
||||
<div class="glyph">
|
||||
<i class="flaticon flaticon-recommended-food"></i>
|
||||
<div class="class-name">.flaticon-recommended-food</div>
|
||||
<div class="author-name">Author: #author-link-flaticon-recommended-food# </div>
|
||||
</div>
|
||||
|
||||
<div class="glyph">
|
||||
<i class="flaticon flaticon-chef"></i>
|
||||
<div class="class-name">.flaticon-chef</div>
|
||||
<div class="author-name">Author: #author-link-flaticon-chef# </div>
|
||||
</div>
|
||||
|
||||
<div class="glyph">
|
||||
<i class="flaticon flaticon-high-quality"></i>
|
||||
<div class="class-name">.flaticon-high-quality</div>
|
||||
<div class="author-name">Author: #author-link-flaticon-high-quality# </div>
|
||||
</div>
|
||||
|
||||
<div class="glyph">
|
||||
<i class="flaticon flaticon-ship"></i>
|
||||
<div class="class-name">.flaticon-ship</div>
|
||||
<div class="author-name">Author: #author-link-flaticon-ship# </div>
|
||||
</div>
|
||||
|
||||
<div class="glyph">
|
||||
<i class="flaticon flaticon-rate"></i>
|
||||
<div class="class-name">.flaticon-rate</div>
|
||||
<div class="author-name">Author: #author-link-flaticon-rate# </div>
|
||||
</div>
|
||||
|
||||
<div class="glyph">
|
||||
<i class="flaticon flaticon-medal"></i>
|
||||
<div class="class-name">.flaticon-medal</div>
|
||||
<div class="author-name">Author: #author-link-flaticon-medal# </div>
|
||||
</div>
|
||||
|
||||
<div class="glyph">
|
||||
<i class="flaticon flaticon-happiness"></i>
|
||||
<div class="class-name">.flaticon-happiness</div>
|
||||
<div class="author-name">Author: #author-link-flaticon-happiness# </div>
|
||||
</div>
|
||||
|
||||
<div class="glyph">
|
||||
<i class="flaticon flaticon-poinsettia"></i>
|
||||
<div class="class-name">.flaticon-poinsettia</div>
|
||||
<div class="author-name">Author: #author-link-flaticon-poinsettia# </div>
|
||||
</div>
|
||||
|
||||
<div class="glyph">
|
||||
<i class="flaticon flaticon-crab"></i>
|
||||
<div class="class-name">.flaticon-crab</div>
|
||||
<div class="author-name">Author: #author-link-flaticon-crab# </div>
|
||||
</div>
|
||||
|
||||
<div class="glyph">
|
||||
<i class="flaticon flaticon-crawfish"></i>
|
||||
<div class="class-name">.flaticon-crawfish</div>
|
||||
<div class="author-name">Author: #author-link-flaticon-crawfish# </div>
|
||||
</div>
|
||||
|
||||
<div class="glyph">
|
||||
<i class="flaticon flaticon-fried-potatoes"></i>
|
||||
<div class="class-name">.flaticon-fried-potatoes</div>
|
||||
<div class="author-name">Author: #author-link-flaticon-fried-potatoes# </div>
|
||||
</div>
|
||||
|
||||
<div class="glyph">
|
||||
<i class="flaticon flaticon-cupcake"></i>
|
||||
<div class="class-name">.flaticon-cupcake</div>
|
||||
<div class="author-name">Author: #author-link-flaticon-cupcake# </div>
|
||||
</div>
|
||||
|
||||
<div class="glyph">
|
||||
<i class="flaticon flaticon-broccoli"></i>
|
||||
<div class="class-name">.flaticon-broccoli</div>
|
||||
<div class="author-name">Author: #author-link-flaticon-broccoli# </div>
|
||||
</div>
|
||||
|
||||
</section>
|
||||
|
||||
<section class="attribution wrapper" style="text-align:center;">
|
||||
|
||||
<div class="title">License and attribution:</div><div class="attrDiv">Font generated by <a href="https://www.flaticon.com">flaticon.com</a>. <div>#allAuthorLinksCC# #allAuthorLinksBasic# </div>
|
||||
</div>
|
||||
<div class="title">Copy the Attribution License:</div>
|
||||
|
||||
<textarea onclick="this.focus();this.select();">Font generated by <a href="https://www.flaticon.com">flaticon.com</a>. #allAuthorLinksCC# #allAuthorLinksBasic#
|
||||
</textarea>
|
||||
|
||||
</section>
|
||||
|
||||
<section class="iconsuse">
|
||||
|
||||
<div class="title">Examples:</div>
|
||||
<div class="image">
|
||||
<p>
|
||||
<i class="flaticon flaticon-star-1"></i>
|
||||
<span><i class="flaticon-star-1"></i></span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="image">
|
||||
<p>
|
||||
<i class="flaticon flaticon-star"></i>
|
||||
<span><i class="flaticon-star"></i></span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="image">
|
||||
<p>
|
||||
<i class="flaticon flaticon-quote"></i>
|
||||
<span><i class="flaticon-quote"></i></span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="image">
|
||||
<p>
|
||||
<i class="flaticon flaticon-dish"></i>
|
||||
<span><i class="flaticon-dish"></i></span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="image">
|
||||
<p>
|
||||
<i class="flaticon flaticon-fast-delivery"></i>
|
||||
<span><i class="flaticon-fast-delivery"></i></span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="image">
|
||||
<p>
|
||||
<i class="flaticon flaticon-cashback"></i>
|
||||
<span><i class="flaticon-cashback"></i></span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="image">
|
||||
<p>
|
||||
<i class="flaticon flaticon-recommended-food"></i>
|
||||
<span><i class="flaticon-recommended-food"></i></span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="image">
|
||||
<p>
|
||||
<i class="flaticon flaticon-chef"></i>
|
||||
<span><i class="flaticon-chef"></i></span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="image">
|
||||
<p>
|
||||
<i class="flaticon flaticon-high-quality"></i>
|
||||
<span><i class="flaticon-high-quality"></i></span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="image">
|
||||
<p>
|
||||
<i class="flaticon flaticon-ship"></i>
|
||||
<span><i class="flaticon-ship"></i></span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="image">
|
||||
<p>
|
||||
<i class="flaticon flaticon-rate"></i>
|
||||
<span><i class="flaticon-rate"></i></span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="image">
|
||||
<p>
|
||||
<i class="flaticon flaticon-medal"></i>
|
||||
<span><i class="flaticon-medal"></i></span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="image">
|
||||
<p>
|
||||
<i class="flaticon flaticon-happiness"></i>
|
||||
<span><i class="flaticon-happiness"></i></span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="image">
|
||||
<p>
|
||||
<i class="flaticon flaticon-poinsettia"></i>
|
||||
<span><i class="flaticon-poinsettia"></i></span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="image">
|
||||
<p>
|
||||
<i class="flaticon flaticon-crab"></i>
|
||||
<span><i class="flaticon-crab"></i></span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="image">
|
||||
<p>
|
||||
<i class="flaticon flaticon-crawfish"></i>
|
||||
<span><i class="flaticon-crawfish"></i></span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="image">
|
||||
<p>
|
||||
<i class="flaticon flaticon-fried-potatoes"></i>
|
||||
<span><i class="flaticon-fried-potatoes"></i></span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="image">
|
||||
<p>
|
||||
<i class="flaticon flaticon-cupcake"></i>
|
||||
<span><i class="flaticon-cupcake"></i></span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="image">
|
||||
<p>
|
||||
<i class="flaticon flaticon-broccoli"></i>
|
||||
<span><i class="flaticon-broccoli"></i></span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</section>
|
||||
|
||||
<div id="footer">
|
||||
<div>Generated by <a href="https://www.flaticon.com">flaticon.com</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
69
public/assets/fonts/flaticon_wellfood.svg
Normal file
|
After Width: | Height: | Size: 177 KiB |
BIN
public/assets/fonts/flaticon_wellfood.ttf
Normal file
BIN
public/assets/fonts/flaticon_wellfood.woff
Normal file
BIN
public/assets/fonts/flaticon_wellfood.woff2
Normal file
BIN
public/assets/images/about/about-1.webp
Normal file
|
After Width: | Height: | Size: 85 KiB |
BIN
public/assets/images/about/about-2.webp
Normal file
|
After Width: | Height: | Size: 78 KiB |
BIN
public/assets/images/about/about-3.webp
Normal file
|
After Width: | Height: | Size: 52 KiB |
BIN
public/assets/images/about/about-five.jpg
Normal file
|
After Width: | Height: | Size: 64 KiB |
BIN
public/assets/images/about/about-four-badge.jpg
Normal file
|
After Width: | Height: | Size: 26 KiB |
BIN
public/assets/images/about/about-four1.jpg
Normal file
|
After Width: | Height: | Size: 77 KiB |