Menu page arrow responsive and contact page form and image equal height updated
This commit is contained in:
akash
parent
107f07c035
commit
041638adde
@ -1,8 +1,24 @@
|
||||
// app/blog/[slug]/page.tsx
|
||||
// app/blog/[slug]/page.js
|
||||
import PageBanner from "@/components/PageBanner";
|
||||
import WellFoodLayout from "@/layout/WellFoodLayout";
|
||||
import { Blog } from "@/utility/constant.utils";
|
||||
|
||||
export async function generateMetadata({ params }) {
|
||||
const blog = Blog.find((item) => item.slug === params.slug);
|
||||
|
||||
if (!blog) {
|
||||
return {
|
||||
title: "Blog not found",
|
||||
description: "The blog you are looking for does not exist.",
|
||||
};
|
||||
}
|
||||
|
||||
return {
|
||||
title: blog.metatitle,
|
||||
description: blog.metadescription,
|
||||
};
|
||||
}
|
||||
|
||||
export async function generateStaticParams() {
|
||||
return Blog.map((item) => ({
|
||||
slug: item.slug,
|
||||
@ -11,7 +27,6 @@ export async function generateStaticParams() {
|
||||
|
||||
export default function BlogPage({ params }) {
|
||||
const { slug } = params;
|
||||
|
||||
const blog = Blog.find((item) => item.slug === slug);
|
||||
|
||||
if (!blog) {
|
||||
@ -20,7 +35,10 @@ export default function BlogPage({ params }) {
|
||||
|
||||
return (
|
||||
<WellFoodLayout>
|
||||
<PageBanner pageTitle={"Blog details"} background="/assets/images/inner-banner/2.webp" />
|
||||
<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">
|
||||
@ -33,7 +51,11 @@ export default function BlogPage({ params }) {
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<img src={blog.bigImage} alt="Blog Standard" loading="lazy" />
|
||||
<img
|
||||
src={blog.bigImage}
|
||||
alt={blog.title}
|
||||
loading="lazy"
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
className="content"
|
||||
|
||||
@ -1,22 +1,25 @@
|
||||
|
||||
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",
|
||||
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" >
|
||||
<PageBanner
|
||||
pageTitle={"Contact"}
|
||||
background="/assets/images/inner-banner/3.webp"
|
||||
/>
|
||||
|
||||
{/* === Contact Info Cards === */}
|
||||
<section className="contact-page-area pt-100 rpt-100 pb-60 rpb-30 rel z-1">
|
||||
<div className="container">
|
||||
<div className="row align-items-center">
|
||||
|
||||
<div
|
||||
className="contact-page-content rmb-55"
|
||||
data-aos="fade-up"
|
||||
@ -27,83 +30,109 @@ const page = () => {
|
||||
<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>
|
||||
|
||||
{/* Cards Row with Spacing */}
|
||||
<div className="row gx-4 gy-4">
|
||||
<div className="col-lg-4 col-md-6 col-sm-12 d-flex justify-content-center">
|
||||
<div
|
||||
className="contact-info-item bgc-black flex-fill p-4"
|
||||
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" }}>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>
|
||||
<span className="title" style={{ fontWeight: "bold" }}>
|
||||
Call Us
|
||||
</span>
|
||||
<p>
|
||||
<a href="mailto:info@shivasakthi.ca">info@shivasakthi.ca</a>
|
||||
<br />
|
||||
<br />
|
||||
<a href="tel:9056773555">905 677 3555</a>
|
||||
</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 className="col-lg-4 col-md-6 col-sm-12 d-flex justify-content-center">
|
||||
<div
|
||||
className="contact-info-item bgc-black flex-fill p-4"
|
||||
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>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="col-lg-4 col-md-6 col-sm-12 d-flex justify-content-center">
|
||||
<div
|
||||
className="contact-info-item bgc-black flex-fill p-4"
|
||||
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>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* === Contact Form & Image (Equal Height) === */}
|
||||
<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="row align-items-stretch no-gap">
|
||||
<div className="col-lg-6 d-flex">
|
||||
<div
|
||||
className="contact-page-content rmb-55"
|
||||
className="contact-page-content rmb-55 d-flex w-100"
|
||||
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 className="contact-info-wrap flex-fill">
|
||||
<img
|
||||
src="/assets/images/contact.webp"
|
||||
alt="Contact ShivaSakthi"
|
||||
loading="lazy"
|
||||
style={{ width: "100%", height: "100%", objectFit: "cover" }}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
className="col-lg-6"
|
||||
className="col-lg-6 d-flex"
|
||||
data-aos="fade-right"
|
||||
data-aos-duration={1500}
|
||||
data-aos-offset={50}
|
||||
>
|
||||
<div className="flex-fill d-flex">
|
||||
<ContactForm />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div className="bg-lines">
|
||||
<span />
|
||||
@ -113,6 +142,7 @@ const page = () => {
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/* === Google Map === */}
|
||||
<section className="contact-page-area pt-60">
|
||||
<div className="container-fluid">
|
||||
<div className="row align-items-center">
|
||||
|
||||
@ -1784,7 +1784,7 @@ const RestaurantMenu = ({ menus }) => {
|
||||
<div className="d-flex justify-content-center">
|
||||
<img src={menu.icon} style={{width:"50%"}} loading="lazy" /> {/* margin-end to add space */}
|
||||
</div>
|
||||
<span>{menu.title}</span>
|
||||
<span className="new-class">{menu.title}</span>
|
||||
</div>
|
||||
</Nav.Link>
|
||||
</Nav.Item>
|
||||
|
||||
@ -125,7 +125,7 @@ const DefaultFooter = () => {
|
||||
<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.{" "}
|
||||
Copyright {new Date().getFullYear()} © Shivas Dosa Restaurant. Powered by <Link href="https://metatroncubesolutions.com/" target="_blank">MetatronCube</Link>. All Right Reserved.{" "}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -9,8 +9,8 @@
|
||||
|
||||
Note: This is Main Style CSS File. */
|
||||
/*----------------------------------------------------------------------
|
||||
CSS INDEX
|
||||
----------------------
|
||||
CSS INDEX
|
||||
----------------------
|
||||
|
||||
## Default Style
|
||||
## Common Classes
|
||||
@ -783,6 +783,8 @@ a.theme-btn.style-three:hover {
|
||||
.food-menu-tab .nav-link {
|
||||
padding-top: 12px;
|
||||
padding-bottom: 8px;
|
||||
padding-left: 12px;
|
||||
padding-right: 12px;
|
||||
}
|
||||
}
|
||||
|
||||
@ -805,20 +807,20 @@ a.theme-btn.style-three:hover {
|
||||
}
|
||||
|
||||
.food-menu-tab .nav-link span {
|
||||
font-size: 18px;
|
||||
font-size: 16px;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 991px) {
|
||||
.food-menu-tab .nav-link span {
|
||||
font-size: 16px;
|
||||
font-size: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 575px) {
|
||||
.food-menu-tab .nav-link span {
|
||||
margin-top: 0;
|
||||
font-size: 16px;
|
||||
font-size: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
@ -946,20 +948,54 @@ a.theme-btn.style-three:hover {
|
||||
|
||||
/* Slick Arrows */
|
||||
.slick-arrow {
|
||||
position: absolute;
|
||||
top: 40%;
|
||||
right: 100%;
|
||||
transform: translateY(-50%);
|
||||
font-size: 20px;
|
||||
-webkit-transition: 0.5s;
|
||||
-o-transition: 0.5s;
|
||||
transition: 0.5s;
|
||||
padding-top: 2px;
|
||||
width: 65px;
|
||||
height: 65px;
|
||||
background: white;
|
||||
line-height: 65px;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
background: black;
|
||||
line-height: 40px;
|
||||
border-radius: 50%;
|
||||
text-align: center;
|
||||
color: var(--heading-color);
|
||||
color: #ffff;
|
||||
-webkit-box-shadow: 0px 4px 60px rgba(0, 0, 0, 0.15);
|
||||
box-shadow: 0px 4px 60px rgba(0, 0, 0, 0.15);
|
||||
z-index: 10;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
|
||||
.slick-arrow {
|
||||
right: 98%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 992px) {
|
||||
|
||||
.slick-arrow {
|
||||
right: 97%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 500px) {
|
||||
|
||||
.slick-arrow {
|
||||
right: 92%;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 992px) {
|
||||
|
||||
.slick-prev {
|
||||
left: -1% !important;
|
||||
}
|
||||
}
|
||||
|
||||
.slick-arrow:focus,
|
||||
@ -4549,6 +4585,12 @@ h6,
|
||||
}
|
||||
}
|
||||
|
||||
.new-class{
|
||||
|
||||
font-size: 16px;
|
||||
|
||||
}
|
||||
|
||||
.main-header .logo {
|
||||
z-index: 9;
|
||||
padding: 2px 0;
|
||||
@ -8206,6 +8248,12 @@ h6,
|
||||
margin-left: 20px;
|
||||
}
|
||||
|
||||
@media(max-width:425px) {
|
||||
.food-menu-item.style-two .content h5 .price {
|
||||
margin-left: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.food-menu-item.style-two .content p {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
@ -8225,7 +8273,11 @@ h6,
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@media(max-width:425px) {
|
||||
.food-menu-item.style-two .content h5 {
|
||||
font-size: 17px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.popular-menu-wrap {
|
||||
@ -12281,6 +12333,8 @@ blockquote .blockquote-footer:before {
|
||||
.slick-prev,
|
||||
.slick-next {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
background: #222222;
|
||||
@ -12289,16 +12343,18 @@ blockquote .blockquote-footer:before {
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 50%;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
|
||||
.slick-prev {
|
||||
left: 0%;
|
||||
top: 25%;
|
||||
left: -3%;
|
||||
top: 40%;
|
||||
}
|
||||
|
||||
.slick-next {
|
||||
right: -3% !important;
|
||||
top: 25%
|
||||
top: 40%
|
||||
}
|
||||
|
||||
.about-biryani-category-1 {
|
||||
@ -12315,6 +12371,13 @@ blockquote .blockquote-footer:before {
|
||||
right: -40px !important;
|
||||
}
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
|
||||
.custom-next-arrow {
|
||||
right: 0px !important;
|
||||
}
|
||||
}
|
||||
|
||||
/* For screen widths 1024px and below */
|
||||
@media (max-width: 1024px) {
|
||||
.custom-prev-arrow {
|
||||
@ -12353,3 +12416,9 @@ blockquote .blockquote-footer:before {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 320px) {
|
||||
.slick-arrow {
|
||||
right: 87%;
|
||||
}
|
||||
}
|
||||
@ -3,8 +3,10 @@ export const Blog = [
|
||||
id: 1,
|
||||
slug: "the-flavors-of-north-india-more-than-just-curries",
|
||||
image: "/assets/images/blog/blog-1.webp",
|
||||
bigImage:"/assets/images/blog/blog-large-1.webp",
|
||||
bigImage: "/assets/images/blog/blog-large-1.webp",
|
||||
title: "The Flavors of North India: More Than Just Curries",
|
||||
metatitle: "Flavors of North India: Beyond Just Curries | Shiva Shakthi",
|
||||
metadescription: "Explore the aromatic breads, tandoori delights, rice dishes & hearty vegetarian staples that make North Indian cuisine so much more than just curries.",
|
||||
user: "Admin",
|
||||
date: "05 Dec 2024",
|
||||
short_des: "Exploring the Bread, Tandoor, and Delights of North Indian Cuisine 'North Indian cuisine is not only about rich curries but also a vibrant array of breads, tandoor-cooked",
|
||||
@ -123,8 +125,10 @@ export const Blog = [
|
||||
id: 2,
|
||||
slug: "the-secret-to-perfect-north-indian-curries",
|
||||
image: "/assets/images/blog/blog-2.webp",
|
||||
bigImage:"/assets/images/blog/blog-large-2.webp",
|
||||
bigImage: "/assets/images/blog/blog-large-2.webp",
|
||||
title: "The Secret to Perfect North Indian Curries",
|
||||
metatitle: "The Secret to Perfect North Indian Curries | Shiva Shakthi",
|
||||
metadescription: "Discover how Shiva Shakthi crafts irresistible North Indian curries — from slow-cooked bases and toasted spices to creamy textures and balanced flavors.",
|
||||
user: "Admin",
|
||||
date: "05 Dec 2024",
|
||||
short_des: "Unlocking the Flavors of Authentic North Indian CuisineNorth Indian curries are the heart and soul of Indian cuisine, known for their rich textures, deep flavors, and",
|
||||
@ -229,8 +233,10 @@ export const Blog = [
|
||||
id: 3,
|
||||
slug: "the-rich-history-of-south-indian-cuisine",
|
||||
image: "/assets/images/blog/blog-3.webp",
|
||||
bigImage:"/assets/images/blog/blog-large-3.webp",
|
||||
bigImage: "/assets/images/blog/blog-large-3.webp",
|
||||
title: "The Rich History of South Indian Cuisine",
|
||||
metatitle: "The Rich History of South Indian Cuisine | Shiva Sakthi",
|
||||
metadescription: "Explore the rich history of South Indian cuisine from dosa and sambar origins to regional diversity & authentic flavors at Shiva Sakthi’s culinary journey.",
|
||||
user: "Admin",
|
||||
date: "05 Dec 2024",
|
||||
short_des: "A Journey Through Time: The Story of South Indian Cuisine",
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user