Refactor menu section to highlight authentic Indian dishes and update layout for improved user experience
This commit is contained in:
Alaguraj0361
parent
5d78301f2b
commit
5b6a0d13cf
BIN
addons/dine360_theme_shivasakthi/static/src/img/blog-1-old.webp
Normal file
BIN
addons/dine360_theme_shivasakthi/static/src/img/blog-1-old.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 149 KiB |
BIN
addons/dine360_theme_shivasakthi/static/src/img/blog-2-old.webp
Normal file
BIN
addons/dine360_theme_shivasakthi/static/src/img/blog-2-old.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 147 KiB |
BIN
addons/dine360_theme_shivasakthi/static/src/img/blog-3-old.webp
Normal file
BIN
addons/dine360_theme_shivasakthi/static/src/img/blog-3-old.webp
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 186 KiB |
BIN
addons/dine360_theme_shivasakthi/static/src/img/blog-news-1.png
Normal file
BIN
addons/dine360_theme_shivasakthi/static/src/img/blog-news-1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 890 KiB |
BIN
addons/dine360_theme_shivasakthi/static/src/img/blog-news-2.png
Normal file
BIN
addons/dine360_theme_shivasakthi/static/src/img/blog-news-2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 867 KiB |
BIN
addons/dine360_theme_shivasakthi/static/src/img/blog-news-3.png
Normal file
BIN
addons/dine360_theme_shivasakthi/static/src/img/blog-news-3.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 796 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 47 KiB |
BIN
addons/dine360_theme_shivasakthi/static/src/img/menu-tomato.png
Normal file
BIN
addons/dine360_theme_shivasakthi/static/src/img/menu-tomato.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 65 KiB |
@ -1198,6 +1198,110 @@ section h2.display-4 {
|
||||
}
|
||||
}
|
||||
|
||||
/* Blog News Cards — Screenshot Layout */
|
||||
.s_blog_premium {
|
||||
background-color: #ffffff;
|
||||
|
||||
/* Subtitle above title */
|
||||
.blog-subtitle-top {
|
||||
font-family: 'Bebas Neue', sans-serif !important;
|
||||
color: #ffb800;
|
||||
font-size: 14px;
|
||||
letter-spacing: 3px;
|
||||
text-transform: uppercase;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
/* Main heading */
|
||||
.blog-main-heading {
|
||||
font-family: 'Bebas Neue', sans-serif !important;
|
||||
color: #111111;
|
||||
font-size: clamp(32px, 5vw, 52px);
|
||||
letter-spacing: 2px;
|
||||
text-transform: uppercase;
|
||||
margin-bottom: 0;
|
||||
line-height: 1.1;
|
||||
}
|
||||
|
||||
/* Card wrapper */
|
||||
.blog-news-card {
|
||||
background: #ffffff;
|
||||
border: none;
|
||||
transition: transform 0.3s ease, box-shadow 0.3s ease;
|
||||
|
||||
&:hover {
|
||||
transform: translateY(-6px);
|
||||
box-shadow: 0 12px 30px rgba(0,0,0,0.1);
|
||||
|
||||
.blog-news-img {
|
||||
transform: scale(1.04);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/* Image wrapper — no border radius, like screenshot */
|
||||
.blog-news-img-wrap {
|
||||
overflow: hidden;
|
||||
height: 220px;
|
||||
background: #111;
|
||||
}
|
||||
|
||||
.blog-news-img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
display: block;
|
||||
transition: transform 0.5s ease;
|
||||
}
|
||||
|
||||
/* Text body */
|
||||
.blog-news-body {
|
||||
padding: 20px 4px 10px;
|
||||
}
|
||||
|
||||
/* Blog title — Bebas Neue dark, uppercase */
|
||||
.blog-news-title {
|
||||
font-family: 'Bebas Neue', sans-serif !important;
|
||||
color: #111111;
|
||||
font-size: clamp(16px, 2vw, 20px);
|
||||
letter-spacing: 0.5px;
|
||||
line-height: 1.3;
|
||||
margin-bottom: 12px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
/* Excerpt text */
|
||||
.blog-news-excerpt {
|
||||
font-family: 'Roboto', sans-serif;
|
||||
color: #555555;
|
||||
font-size: 13px;
|
||||
line-height: 1.7;
|
||||
margin-bottom: 14px;
|
||||
}
|
||||
|
||||
/* READ MORE link */
|
||||
.blog-news-readmore {
|
||||
font-family: 'Bebas Neue', sans-serif !important;
|
||||
color: #ffb800;
|
||||
font-size: 14px;
|
||||
letter-spacing: 1.5px;
|
||||
text-decoration: none;
|
||||
text-transform: uppercase;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
gap: 5px;
|
||||
transition: color 0.3s ease;
|
||||
|
||||
.fa-star {
|
||||
font-size: 11px;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
color: #cc9200;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
// Gallery Slider Section
|
||||
.s_gallery_slider_premium {
|
||||
background-color: #F4F1EA;
|
||||
@ -2233,35 +2337,330 @@ body.o_edit_mode {
|
||||
}
|
||||
}
|
||||
|
||||
/* Thali and Deal Sections */
|
||||
.s_unlimited_thali_section,
|
||||
.s_enjoy_flavors_section {
|
||||
/* Thali Section */
|
||||
.s_unlimited_thali_section {
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
position: relative;
|
||||
min-height: 500px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.lead {
|
||||
font-family: 'Roboto', sans-serif !important;
|
||||
/* Enjoy the Flavors Section — Exact Screenshot Banner Layout */
|
||||
.s_enjoy_flavors_section {
|
||||
background-color: #111111;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
min-height: 380px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
/* ─── LEFT SIDE ─── */
|
||||
|
||||
/* "ENJOY THE" small chalk/brush line */
|
||||
.enjoy-title-enjoy {
|
||||
font-family: 'Bebas Neue', sans-serif !important;
|
||||
font-size: clamp(28px, 4vw, 42px);
|
||||
color: #ffffff;
|
||||
letter-spacing: 3px;
|
||||
line-height: 1;
|
||||
margin-bottom: 2px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
img {
|
||||
transition: transform 0.5s ease;
|
||||
/* "FLAVORS" large brush text image */
|
||||
.enjoy-title-flavors {
|
||||
margin-bottom: 20px;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.enjoy-flavors-img {
|
||||
/* The image is the brush-style "FLAVORS" text in white */
|
||||
max-width: 340px;
|
||||
width: 100%;
|
||||
display: block;
|
||||
filter: brightness(1.1);
|
||||
}
|
||||
|
||||
/* Golden subtitle */
|
||||
.enjoy-subtitle {
|
||||
font-family: 'Bebas Neue', sans-serif !important;
|
||||
color: #ffb800;
|
||||
font-size: clamp(16px, 2.2vw, 22px);
|
||||
letter-spacing: 2px;
|
||||
line-height: 1.3;
|
||||
margin-bottom: 28px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
/* Outline "ORDER NOW" button matching screenshot */
|
||||
.enjoy-btn-outline {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
border: 2px solid #ffb800;
|
||||
color: #ffb800;
|
||||
background: transparent;
|
||||
padding: 10px 28px;
|
||||
font-family: 'Bebas Neue', sans-serif !important;
|
||||
font-size: 15px;
|
||||
letter-spacing: 2px;
|
||||
text-decoration: none;
|
||||
border-radius: 3px;
|
||||
transition: all 0.3s ease;
|
||||
|
||||
&:hover {
|
||||
transform: scale(1.03) translateY(-5px);
|
||||
background: #ffb800;
|
||||
color: #111111;
|
||||
}
|
||||
}
|
||||
|
||||
/* ─── RIGHT SIDE ─── */
|
||||
|
||||
.enjoy-right-col {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
min-height: 340px;
|
||||
}
|
||||
|
||||
/* Main dosa tray image */
|
||||
.enjoy-dosa-img {
|
||||
position: relative;
|
||||
z-index: 3;
|
||||
max-width: 520px;
|
||||
width: 100%;
|
||||
filter: drop-shadow(0 20px 50px rgba(0, 0, 0, 0.8));
|
||||
animation: enjoyDosaFloat 4s ease-in-out infinite;
|
||||
}
|
||||
|
||||
/* "DOSADOS" watermark behind image */
|
||||
.enjoy-watermark {
|
||||
position: absolute;
|
||||
right: -10px;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
font-family: 'Bebas Neue', sans-serif !important;
|
||||
font-size: clamp(60px, 10vw, 120px);
|
||||
color: rgba(255, 255, 255, 0.06);
|
||||
letter-spacing: 6px;
|
||||
white-space: nowrap;
|
||||
z-index: 1;
|
||||
pointer-events: none;
|
||||
user-select: none;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
/* Shared floating element base */
|
||||
.enjoy-float {
|
||||
position: absolute;
|
||||
z-index: 4;
|
||||
pointer-events: none;
|
||||
filter: drop-shadow(0 6px 16px rgba(0, 0, 0, 0.5));
|
||||
}
|
||||
|
||||
/* Onion ring — top-left of image area */
|
||||
.enjoy-float-onion {
|
||||
width: 70px;
|
||||
top: 10%;
|
||||
left: 5%;
|
||||
animation: enjoyFloatA 3.5s ease-in-out infinite;
|
||||
}
|
||||
|
||||
/* Green chili — top-right */
|
||||
.enjoy-float-chili {
|
||||
width: 50px;
|
||||
top: 5%;
|
||||
right: 8%;
|
||||
transform: rotate(20deg);
|
||||
animation: enjoyFloatB 3s ease-in-out infinite;
|
||||
}
|
||||
|
||||
/* Tomato slice — bottom-right */
|
||||
.enjoy-float-tomato {
|
||||
width: 55px;
|
||||
bottom: 10%;
|
||||
right: 5%;
|
||||
animation: enjoyFloatC 4s ease-in-out infinite;
|
||||
}
|
||||
|
||||
/* Steam container — positioned above dosa image */
|
||||
.enjoy-steam {
|
||||
position: absolute;
|
||||
top: 5%;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
display: flex;
|
||||
gap: 12px;
|
||||
z-index: 5;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.enjoy-steam-line {
|
||||
width: 3px;
|
||||
height: 40px;
|
||||
border-radius: 3px;
|
||||
background: linear-gradient(to top, rgba(255,255,255,0.35), transparent);
|
||||
|
||||
&.s1 { animation: steamRise 2s ease-out 0s infinite; }
|
||||
&.s2 { animation: steamRise 2s ease-out 0.4s infinite; height: 55px; }
|
||||
&.s3 { animation: steamRise 2s ease-out 0.8s infinite; }
|
||||
}
|
||||
}
|
||||
|
||||
/* ─── Keyframes ─── */
|
||||
@keyframes enjoyDosaFloat {
|
||||
0%, 100% { transform: translateY(0px); }
|
||||
50% { transform: translateY(-8px); }
|
||||
}
|
||||
@keyframes enjoyFloatA {
|
||||
0%, 100% { transform: translateY(0px) rotate(-10deg); }
|
||||
50% { transform: translateY(-12px) rotate(-10deg); }
|
||||
}
|
||||
@keyframes enjoyFloatB {
|
||||
0%, 100% { transform: translateY(0px) rotate(20deg); }
|
||||
50% { transform: translateY(-10px) rotate(20deg); }
|
||||
}
|
||||
@keyframes enjoyFloatC {
|
||||
0%, 100% { transform: translateY(0px) rotate(15deg); }
|
||||
50% { transform: translateY(-14px) rotate(15deg); }
|
||||
}
|
||||
@keyframes steamRise {
|
||||
0% { opacity: 0; transform: translateY(0) scaleX(1); }
|
||||
30% { opacity: 0.5; }
|
||||
100% { opacity: 0; transform: translateY(-50px) scaleX(2); }
|
||||
}
|
||||
|
||||
/* Testimonial Section — Split Layout matching screenshot */
|
||||
.s_testimonials_premium {
|
||||
.testimonial-carousel {
|
||||
.carousel-item {
|
||||
display: none;
|
||||
&.active {
|
||||
display: block !important;
|
||||
}
|
||||
overflow: hidden;
|
||||
|
||||
/* LEFT: Food photo as full-bleed cover */
|
||||
.testi-left-col {
|
||||
min-height: 580px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.testi-left-img {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
background-size: cover;
|
||||
background-position: center;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
min-height: 580px;
|
||||
}
|
||||
|
||||
/* RIGHT: Golden amber background */
|
||||
.testi-right-col {
|
||||
background-color: #f5a623;
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
padding: 60px 50px;
|
||||
min-height: 580px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
/* Tomato accent — bottom-right corner */
|
||||
.testi-tomato-accent {
|
||||
position: absolute;
|
||||
bottom: 15px;
|
||||
right: 20px;
|
||||
z-index: 1;
|
||||
opacity: 0.85;
|
||||
|
||||
img {
|
||||
width: 55px;
|
||||
filter: drop-shadow(0 4px 8px rgba(0,0,0,0.3));
|
||||
}
|
||||
}
|
||||
|
||||
/* Content wrapper — centered */
|
||||
.testi-content-wrap {
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
text-align: center;
|
||||
max-width: 560px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/* Main heading — white bold Bebas Neue */
|
||||
.testi-main-title {
|
||||
font-family: 'Bebas Neue', sans-serif !important;
|
||||
color: #ffffff;
|
||||
font-size: clamp(22px, 3vw, 36px);
|
||||
letter-spacing: 2px;
|
||||
line-height: 1.2;
|
||||
margin-bottom: 20px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
/* Stars */
|
||||
.testi-stars {
|
||||
color: #ffb800;
|
||||
font-size: 20px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
gap: 4px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
/* Review paragraph — white, centered, small */
|
||||
.testi-review-text {
|
||||
font-family: 'Roboto', sans-serif;
|
||||
color: #ffffff;
|
||||
font-size: 13.5px;
|
||||
line-height: 1.8;
|
||||
text-align: center;
|
||||
margin-bottom: 16px;
|
||||
opacity: 0.95;
|
||||
}
|
||||
|
||||
/* Author name */
|
||||
.testi-author-name {
|
||||
font-family: 'Bebas Neue', sans-serif !important;
|
||||
color: #ffffff;
|
||||
font-size: 18px;
|
||||
letter-spacing: 1.5px;
|
||||
text-align: center;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
/* Nav buttons — small circular dark */
|
||||
.testi-nav-btns {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.testi-nav-btn {
|
||||
width: 36px;
|
||||
height: 36px;
|
||||
border-radius: 50%;
|
||||
border: 2px solid rgba(255,255,255,0.6);
|
||||
background: transparent;
|
||||
color: #ffffff;
|
||||
font-size: 13px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
cursor: pointer;
|
||||
transition: all 0.3s ease;
|
||||
|
||||
&:hover {
|
||||
background: #ffffff;
|
||||
color: #f5a623;
|
||||
border-color: #ffffff;
|
||||
}
|
||||
}
|
||||
|
||||
/* Bootstrap carousel override for text slides */
|
||||
.carousel-item {
|
||||
display: none;
|
||||
&.active {
|
||||
display: block !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -2518,3 +2917,131 @@ body.o_edit_mode {
|
||||
0%, 100% { transform: translateY(0) rotate(-15deg); }
|
||||
50% { transform: translateY(8px) rotate(-12deg); }
|
||||
}
|
||||
|
||||
/* From Authentic Indian Kitchen Realignment */
|
||||
.s_authentic_kitchen_section {
|
||||
background-color: #fcfbf7 !important;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
|
||||
.menu-accent-cucumber {
|
||||
position: absolute;
|
||||
left: 2%;
|
||||
top: 8%;
|
||||
width: 140px;
|
||||
z-index: 2;
|
||||
opacity: 0.95;
|
||||
filter: drop-shadow(5px 5px 12px rgba(0,0,0,0.12));
|
||||
animation: floatCucumber 12s ease-in-out infinite;
|
||||
}
|
||||
|
||||
.menu-accent-tomato {
|
||||
position: absolute;
|
||||
right: 3%;
|
||||
bottom: 5%;
|
||||
width: 120px;
|
||||
z-index: 2;
|
||||
opacity: 0.95;
|
||||
filter: drop-shadow(5px 5px 12px rgba(0,0,0,0.12));
|
||||
animation: floatTomatoBottom 10s ease-in-out infinite;
|
||||
}
|
||||
|
||||
.menu-card-container {
|
||||
background: #ffffff;
|
||||
border: 1px solid #eef0eb;
|
||||
border-radius: 6px;
|
||||
box-shadow: 0 10px 30px rgba(0, 0, 0, 0.02);
|
||||
position: relative;
|
||||
z-index: 3;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.menu-column {
|
||||
.menu-list-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
transition: all 0.3s ease;
|
||||
padding: 20px 25px;
|
||||
|
||||
img {
|
||||
width: 65px;
|
||||
height: 65px;
|
||||
object-fit: cover;
|
||||
border-radius: 50%;
|
||||
border: 2px solid #ffb800 !important;
|
||||
box-shadow: 0 4px 10px rgba(0,0,0,0.05);
|
||||
transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
|
||||
}
|
||||
|
||||
h5 {
|
||||
font-family: 'Bebas Neue', sans-serif !important;
|
||||
font-size: 18px;
|
||||
font-weight: 400;
|
||||
color: #04121D !important;
|
||||
letter-spacing: 0.5px;
|
||||
}
|
||||
|
||||
p {
|
||||
font-family: 'Roboto', sans-serif !important;
|
||||
font-size: 13px;
|
||||
color: #777777;
|
||||
}
|
||||
|
||||
.price-text {
|
||||
font-family: 'Bebas Neue', sans-serif !important;
|
||||
font-size: 18px;
|
||||
color: #ffb800 !important;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.border-bottom {
|
||||
border-bottom: 2px dotted rgba(4, 18, 29, 0.15) !important;
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
background-color: #fbfbfa;
|
||||
transform: translateY(-1px);
|
||||
|
||||
img {
|
||||
transform: scale(1.08) rotate(5deg);
|
||||
border-color: #04121D !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.btn-menu-view-all {
|
||||
background-color: #ffb800 !important;
|
||||
color: #04121D !important;
|
||||
font-family: 'Bebas Neue', sans-serif !important;
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
padding: 12px 35px;
|
||||
border-radius: 4px;
|
||||
border: none;
|
||||
letter-spacing: 1px;
|
||||
transition: all 0.3s ease;
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
&:hover {
|
||||
transform: translateY(-3px);
|
||||
box-shadow: 0 4px 15px rgba(254, 205, 79, 0.4);
|
||||
background-color: #04121D !important;
|
||||
color: #ffb800 !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (min-width: 992px) {
|
||||
.border-end-lg {
|
||||
border-right: 1px solid #eef0eb !important;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes floatCucumber {
|
||||
0%, 100% { transform: translateY(0) rotate(0deg); }
|
||||
50% { transform: translateY(-12px) rotate(8deg); }
|
||||
}
|
||||
|
||||
@ -356,299 +356,344 @@
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Menu Section Header -->
|
||||
<section class="s_title o_colored_level pb24 pt64" data-vcss="001" data-snippet="s_title" data-name="Title" style="background-color: white; background-image: none;">
|
||||
<div class="s_allow_columns container">
|
||||
<h6 style="text-align: center;">
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/subtitle-icon.png" style="width: 25px; margin-right: 10px;" loading="lazy"/>
|
||||
<span style="color: #ffb800; font-weight: 700; letter-spacing: 2px; text-transform: uppercase;">CHINESE DISH</span>
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/subtitle-icon.png" style="width: 25px; margin-left: 10px;" loading="lazy"/>
|
||||
</h6>
|
||||
<h2 class="display-4 fw-bold" style="text-align: center; color: #04121D; text-transform: uppercase;">Popular Exquisite Dishes</h2>
|
||||
</div>
|
||||
</section>
|
||||
<!-- From Authentic Indian Kitchen Section -->
|
||||
<section class="s_authentic_kitchen_section o_colored_level pt96 pb96" style="background-color: #fcfbf7; position: relative; overflow: hidden;">
|
||||
<!-- Floating Accent Images -->
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/menu-cucumber.png" class="menu-accent-cucumber d-none d-lg-block" alt="Cucumber Accent"/>
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/menu-tomato.png" class="menu-accent-tomato d-none d-lg-block" alt="Tomato Accent"/>
|
||||
|
||||
<!-- Menu List Section -->
|
||||
<section class="s_menu_section o_colored_level pb80" style="background-color: white;">
|
||||
<div class="container">
|
||||
<div class="row g-5">
|
||||
<!-- Column 1 -->
|
||||
<div class="col-lg-6">
|
||||
<div class="d-flex flex-column gap-4">
|
||||
<!-- Item 1 -->
|
||||
<div class="menu-list-item d-flex align-items-center">
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/crispy-gobi-65.png" class="rounded-circle me-3" style="width: 70px; height: 70px; object-fit: cover; border: 2px solid #ffb800;" alt=""/>
|
||||
<div class="flex-grow-1">
|
||||
<div class="d-flex align-items-baseline">
|
||||
<h5 class="fw-bold mb-0 text-dark" style="font-size: 16px;">CHICKEN MANCHURIAN</h5>
|
||||
<span class="flex-grow-1 border-bottom mx-2" style="border-style: dotted !important; border-color: #ddd !important; border-width: 2px !important;"/>
|
||||
<span class="fw-bold text-dark" style="font-size: 16px;">$15.99</span>
|
||||
<!-- Header -->
|
||||
<div class="row mb-5">
|
||||
<div class="col-12 text-center">
|
||||
<h6 class="mb-2" style="color: #ffb800; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; font-family: 'Bebas Neue', sans-serif !important; font-size: 16px;">POPULAR MENU</h6>
|
||||
<h2 class="display-4 fw-bold" style="color: #04121D; text-transform: uppercase; font-family: 'Bebas Neue', sans-serif !important; font-size: 46px; letter-spacing: 1px; line-height: 1.2;">FROM AUTHENTIC INDIAN KITCHEN</h2>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Menu Card Container -->
|
||||
<div class="menu-card-container mb-5">
|
||||
<div class="row g-0">
|
||||
<!-- Column 1 -->
|
||||
<div class="col-lg-6 menu-column border-end-lg">
|
||||
<div class="d-flex flex-column gap-4 p-4 p-md-5">
|
||||
<!-- Item 1 -->
|
||||
<div class="menu-list-item d-flex align-items-center">
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/crispy-gobi-65.png" class="rounded-circle me-3" alt="Medhu Vada"/>
|
||||
<div class="flex-grow-1">
|
||||
<div class="d-flex align-items-baseline">
|
||||
<h5 class="fw-bold mb-0 text-dark">MEDHU VADA</h5>
|
||||
<span class="flex-grow-1 border-bottom mx-2"/>
|
||||
<span class="fw-bold price-text">$7.99</span>
|
||||
</div>
|
||||
<p class="small text-muted mb-0">The popular soft and savory appetizer</p>
|
||||
</div>
|
||||
<p class="small text-muted mb-0">Tender chicken chunks tossed in spicy Chinese Manchurian sauce.</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Item 2 -->
|
||||
<div class="menu-list-item d-flex align-items-center">
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/cat-curries.png" class="rounded-circle me-3" style="width: 70px; height: 70px; object-fit: cover; border: 2px solid #ffb800;" alt=""/>
|
||||
<div class="flex-grow-1">
|
||||
<div class="d-flex align-items-baseline">
|
||||
<h5 class="fw-bold mb-0 text-dark" style="font-size: 16px;">SCHEZWAN CHICKEN NOODLES</h5>
|
||||
<span class="flex-grow-1 border-bottom mx-2" style="border-style: dotted !important; border-color: #ddd !important; border-width: 2px !important;"/>
|
||||
<span class="fw-bold text-dark" style="font-size: 16px;">$15.99</span>
|
||||
<!-- Item 2 -->
|
||||
<div class="menu-list-item d-flex align-items-center">
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/cat-dosa.png" class="rounded-circle me-3" alt="Garlic Naan"/>
|
||||
<div class="flex-grow-1">
|
||||
<div class="d-flex align-items-baseline">
|
||||
<h5 class="fw-bold mb-0 text-dark">GARLIC NAAN</h5>
|
||||
<span class="flex-grow-1 border-bottom mx-2"/>
|
||||
<span class="fw-bold price-text">$1.99</span>
|
||||
</div>
|
||||
<p class="small text-muted mb-0">Naan infused with garlic</p>
|
||||
</div>
|
||||
<p class="small text-muted mb-0">Noodles stir-fried with chicken and spicy Schezwan sauce.</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Item 3 -->
|
||||
<div class="menu-list-item d-flex align-items-center">
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/cat-biryani.png" class="rounded-circle me-3" style="width: 70px; height: 70px; object-fit: cover; border: 2px solid #ffb800;" alt=""/>
|
||||
<div class="flex-grow-1">
|
||||
<div class="d-flex align-items-baseline">
|
||||
<h5 class="fw-bold mb-0 text-dark" style="font-size: 16px;">VEG FRIED RICE</h5>
|
||||
<span class="flex-grow-1 border-bottom mx-2" style="border-style: dotted !important; border-color: #ddd !important; border-width: 2px !important;"/>
|
||||
<span class="fw-bold text-dark" style="font-size: 16px;">$13.99</span>
|
||||
<!-- Item 3 -->
|
||||
<div class="menu-list-item d-flex align-items-center">
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/fiery-fish-curry.png" class="rounded-circle me-3" alt="King Fish Fry"/>
|
||||
<div class="flex-grow-1">
|
||||
<div class="d-flex align-items-baseline">
|
||||
<h5 class="fw-bold mb-0 text-dark">KING FISH FRY</h5>
|
||||
<span class="flex-grow-1 border-bottom mx-2"/>
|
||||
<span class="fw-bold price-text">$17.99</span>
|
||||
</div>
|
||||
<p class="small text-muted mb-0">House Special - Premium King Fish Slice Fry</p>
|
||||
</div>
|
||||
<p class="small text-muted mb-0">Stir-fried rice mixed with colorful fresh vegetables.</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Item 4 -->
|
||||
<div class="menu-list-item d-flex align-items-center">
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/crispy-gobi-65.png" class="rounded-circle me-3" style="width: 70px; height: 70px; object-fit: cover; border: 2px solid #ffb800;" alt=""/>
|
||||
<div class="flex-grow-1">
|
||||
<div class="d-flex align-items-baseline">
|
||||
<h5 class="fw-bold mb-0 text-dark" style="font-size: 16px;">GOBI MANCHURIAN</h5>
|
||||
<span class="flex-grow-1 border-bottom mx-2" style="border-style: dotted !important; border-color: #ddd !important; border-width: 2px !important;"/>
|
||||
<span class="fw-bold text-dark" style="font-size: 16px;">$14.99</span>
|
||||
<!-- Item 4 -->
|
||||
<div class="menu-list-item d-flex align-items-center">
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/cat-desserts.png" class="rounded-circle me-3" alt="Paruppu Pradhaman"/>
|
||||
<div class="flex-grow-1">
|
||||
<div class="d-flex align-items-baseline">
|
||||
<h5 class="fw-bold mb-0 text-dark">PARUPPU PRADHAMAN</h5>
|
||||
<span class="flex-grow-1 border-bottom mx-2"/>
|
||||
<span class="fw-bold price-text">$3.99</span>
|
||||
</div>
|
||||
<p class="small text-muted mb-0">south style Payasam made with coconut, Lentils and Jaggery</p>
|
||||
</div>
|
||||
<p class="small text-muted mb-0">Crispy cauliflower florets in dark, sweet and tangy sauce.</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Item 5 -->
|
||||
<div class="menu-list-item d-flex align-items-center">
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/cat-dosa.png" class="rounded-circle me-3" style="width: 70px; height: 70px; object-fit: cover; border: 2px solid #ffb800;" alt=""/>
|
||||
<div class="flex-grow-1">
|
||||
<div class="d-flex align-items-baseline">
|
||||
<h5 class="fw-bold mb-0 text-dark" style="font-size: 16px;">CHILLI PANEER</h5>
|
||||
<span class="flex-grow-1 border-bottom mx-2" style="border-style: dotted !important; border-color: #ddd !important; border-width: 2px !important;"/>
|
||||
<span class="fw-bold text-dark" style="font-size: 16px;">$14.99</span>
|
||||
<!-- Item 5 -->
|
||||
<div class="menu-list-item d-flex align-items-center">
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/crispy-gobi-65.png" class="rounded-circle me-3" alt="Egg Bhurji"/>
|
||||
<div class="flex-grow-1">
|
||||
<div class="d-flex align-items-baseline">
|
||||
<h5 class="fw-bold mb-0 text-dark">EGG BHURJI (PODIMAS)</h5>
|
||||
<span class="flex-grow-1 border-bottom mx-2"/>
|
||||
<span class="fw-bold price-text">$11.99</span>
|
||||
</div>
|
||||
<p class="small text-muted mb-0">Masala Egg Bhurji (Podimas)</p>
|
||||
</div>
|
||||
<p class="small text-muted mb-0">Paneer cubes tossed with bell peppers and green chillies.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Column 2 -->
|
||||
<div class="col-lg-6">
|
||||
<div class="d-flex flex-column gap-4">
|
||||
<!-- Item 1 -->
|
||||
<div class="menu-list-item d-flex align-items-center">
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/fiery-fish-curry.png" class="rounded-circle me-3" style="width: 70px; height: 70px; object-fit: cover; border: 2px solid #ffb800;" alt=""/>
|
||||
<div class="flex-grow-1">
|
||||
<div class="d-flex align-items-baseline">
|
||||
<h5 class="fw-bold mb-0 text-dark" style="font-size: 16px;">CHILLI CHICKEN</h5>
|
||||
<span class="flex-grow-1 border-bottom mx-2" style="border-style: dotted !important; border-color: #ddd !important; border-width: 2px !important;"/>
|
||||
<span class="fw-bold text-dark" style="font-size: 16px;">$15.99</span>
|
||||
<!-- Column 2 -->
|
||||
<div class="col-lg-6 menu-column">
|
||||
<div class="d-flex flex-column gap-4 p-4 p-md-5">
|
||||
<!-- Item 1 -->
|
||||
<div class="menu-list-item d-flex align-items-center">
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/cat-biryani.png" class="rounded-circle me-3" alt="Veg Biryani"/>
|
||||
<div class="flex-grow-1">
|
||||
<div class="d-flex align-items-baseline">
|
||||
<h5 class="fw-bold mb-0 text-dark">VEG BIRYANI</h5>
|
||||
<span class="flex-grow-1 border-bottom mx-2"/>
|
||||
<span class="fw-bold price-text">$13.99</span>
|
||||
</div>
|
||||
<p class="small text-muted mb-0">Cooked in Chettinadu style using Basmati rice</p>
|
||||
</div>
|
||||
<p class="small text-muted mb-0">Spicy and crispy chicken tossed in soy-chilli gravy.</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Item 2 -->
|
||||
<div class="menu-list-item d-flex align-items-center">
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/cat-biryani.png" class="rounded-circle me-3" style="width: 70px; height: 70px; object-fit: cover; border: 2px solid #ffb800;" alt=""/>
|
||||
<div class="flex-grow-1">
|
||||
<div class="d-flex align-items-baseline">
|
||||
<h5 class="fw-bold mb-0 text-dark" style="font-size: 16px;">CHICKEN FRIED RICE</h5>
|
||||
<span class="flex-grow-1 border-bottom mx-2" style="border-style: dotted !important; border-color: #ddd !important; border-width: 2px !important;"/>
|
||||
<span class="fw-bold text-dark" style="font-size: 16px;">$15.99</span>
|
||||
<!-- Item 2 -->
|
||||
<div class="menu-list-item d-flex align-items-center">
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/cat-curries.png" class="rounded-circle me-3" alt="Hakka Noodles"/>
|
||||
<div class="flex-grow-1">
|
||||
<div class="d-flex align-items-baseline">
|
||||
<h5 class="fw-bold mb-0 text-dark">HAKKA NOODLES (VEG)</h5>
|
||||
<span class="flex-grow-1 border-bottom mx-2"/>
|
||||
<span class="fw-bold price-text">$13.99</span>
|
||||
</div>
|
||||
<p class="small text-muted mb-0">Hakka Flavored Noodles</p>
|
||||
</div>
|
||||
<p class="small text-muted mb-0">Stir-fried rice tossed with eggs, chicken, and spring onions.</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Item 3 -->
|
||||
<div class="menu-list-item d-flex align-items-center">
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/cat-curries.png" class="rounded-circle me-3" style="width: 70px; height: 70px; object-fit: cover; border: 2px solid #ffb800;" alt=""/>
|
||||
<div class="flex-grow-1">
|
||||
<div class="d-flex align-items-baseline">
|
||||
<h5 class="fw-bold mb-0 text-dark" style="font-size: 16px;">CHICKEN NOODLES</h5>
|
||||
<span class="flex-grow-1 border-bottom mx-2" style="border-style: dotted !important; border-color: #ddd !important; border-width: 2px !important;"/>
|
||||
<span class="fw-bold text-dark" style="font-size: 16px;">$15.99</span>
|
||||
<!-- Item 3 -->
|
||||
<div class="menu-list-item d-flex align-items-center">
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/cat-biryani.png" class="rounded-circle me-3" alt="Thalapakattu Mutton Biryani"/>
|
||||
<div class="flex-grow-1">
|
||||
<div class="d-flex align-items-baseline">
|
||||
<h5 class="fw-bold mb-0 text-dark">THALAPAKATTU MUTTON BIRYANI</h5>
|
||||
<span class="flex-grow-1 border-bottom mx-2"/>
|
||||
<span class="fw-bold price-text">$16.99</span>
|
||||
</div>
|
||||
<p class="small text-muted mb-0">Authentic Thalapakattu style in seeraga samba rice</p>
|
||||
</div>
|
||||
<p class="small text-muted mb-0">Noodles tossed with chicken chunks and fresh stir-fry veggies.</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Item 4 -->
|
||||
<div class="menu-list-item d-flex align-items-center">
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/cat-desserts.png" class="rounded-circle me-3" style="width: 70px; height: 70px; object-fit: cover; border: 2px solid #ffb800;" alt=""/>
|
||||
<div class="flex-grow-1">
|
||||
<div class="d-flex align-items-baseline">
|
||||
<h5 class="fw-bold mb-0 text-dark" style="font-size: 16px;">EGG NOODLES</h5>
|
||||
<span class="flex-grow-1 border-bottom mx-2" style="border-style: dotted !important; border-color: #ddd !important; border-width: 2px !important;"/>
|
||||
<span class="fw-bold text-dark" style="font-size: 16px;">$14.99</span>
|
||||
<!-- Item 4 -->
|
||||
<div class="menu-list-item d-flex align-items-center">
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/cat-dosa.png" class="rounded-circle me-3" alt="Pizza Dosa"/>
|
||||
<div class="flex-grow-1">
|
||||
<div class="d-flex align-items-baseline">
|
||||
<h5 class="fw-bold mb-0 text-dark">PIZZA DOSA</h5>
|
||||
<span class="flex-grow-1 border-bottom mx-2"/>
|
||||
<span class="fw-bold price-text">$14.99</span>
|
||||
</div>
|
||||
<p class="small text-muted mb-0">Classic Dosa made to taste like pizza and favorite with kids and adults alike</p>
|
||||
</div>
|
||||
<p class="small text-muted mb-0">Stir-fried noodles cooked with eggs and standard spices.</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Item 5 -->
|
||||
<div class="menu-list-item d-flex align-items-center">
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/cat-beverages.png" class="rounded-circle me-3" style="width: 70px; height: 70px; object-fit: cover; border: 2px solid #ffb800;" alt=""/>
|
||||
<div class="flex-grow-1">
|
||||
<div class="d-flex align-items-baseline">
|
||||
<h5 class="fw-bold mb-0 text-dark" style="font-size: 16px;">VEG NOODLES</h5>
|
||||
<span class="flex-grow-1 border-bottom mx-2" style="border-style: dotted !important; border-color: #ddd !important; border-width: 2px !important;"/>
|
||||
<span class="fw-bold text-dark" style="font-size: 16px;">$13.99</span>
|
||||
<!-- Item 5 -->
|
||||
<div class="menu-list-item d-flex align-items-center">
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/cat-desserts.png" class="rounded-circle me-3" alt="Payasam"/>
|
||||
<div class="flex-grow-1">
|
||||
<div class="d-flex align-items-baseline">
|
||||
<h5 class="fw-bold mb-0 text-dark">PAYASAM</h5>
|
||||
<span class="flex-grow-1 border-bottom mx-2"/>
|
||||
<span class="fw-bold price-text">$3.99</span>
|
||||
</div>
|
||||
<p class="small text-muted mb-0">Traditional Tamilnadu style vermichilli payasam</p>
|
||||
</div>
|
||||
<p class="small text-muted mb-0">Classic stir-fried noodles cooked with cabbage, carrot, and onion.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- View All Button -->
|
||||
<div class="row mt-5">
|
||||
<div class="row">
|
||||
<div class="col-12 text-center">
|
||||
<a href="/shop" class="btn px-5 py-3 fw-bold text-uppercase" style="background-color: #ffb800; color: #04121D; border-radius: 4px; font-size: 13px;">VIEW ALL</a>
|
||||
<a href="/shop" class="btn btn-menu-view-all">VIEW FULL MENU <i class="fa fa-long-arrow-right ms-2"/></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Enjoy the Flavors Section -->
|
||||
<section class="s_enjoy_flavors_section o_colored_level pt96 pb96" style="background-color: #080808; background-image: url('/dine360_theme_shivasakthi/static/src/img/hero-bg.jpg'); background-size: cover; background-position: center; position: relative; overflow: hidden;">
|
||||
<div class="o_we_bg_filter bg-black-50" style="position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.55); z-index: 1;"/>
|
||||
<div class="container position-relative" style="z-index: 2;">
|
||||
<section class="s_enjoy_flavors_section o_colored_level" style="background-color: #111111; position: relative; overflow: hidden; min-height: 380px; display: flex; align-items: center;">
|
||||
|
||||
<!-- Container -->
|
||||
<div class="container position-relative" style="z-index: 2; padding: 60px 0;">
|
||||
<div class="row align-items-center">
|
||||
<!-- Left Text Side -->
|
||||
<div class="col-lg-6 text-white o_colored_level">
|
||||
<h6 class="mb-3" style="color: #ffb800; font-weight: 700; letter-spacing: 2px; text-transform: uppercase;">SPECIAL DEAL</h6>
|
||||
<h1 class="display-3 fw-bold mb-2 text-white" style="line-height: 1.1; letter-spacing: 1px;">ENJOY THE FLAVORS</h1>
|
||||
<h2 class="h3 fw-bold mb-5" style="color: #ffb800; text-transform: uppercase;">SOUTH INDIAN FOOD HERITAGE</h2>
|
||||
<div class="pt-2">
|
||||
<a href="/shop" class="btn px-5 py-3 fw-bold text-uppercase" style="background-color: #ffb800; color: #04121D; border-radius: 4px; font-size: 13px;">ORDER NOW</a>
|
||||
|
||||
<!-- LEFT: Text Content -->
|
||||
<div class="col-lg-5 col-md-6 text-white o_colored_level" style="padding-right: 40px;">
|
||||
<!-- "ENJOY THE" small brush title -->
|
||||
<!-- <div class="enjoy-title-enjoy">ENJOY THE</div> -->
|
||||
<!-- "FLAVORS" large brush image text -->
|
||||
<div class="enjoy-title-flavors">
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/offer-dosa-left.webp" alt="FLAVORS" class="enjoy-flavors-img"/>
|
||||
</div>
|
||||
<!-- Golden Subtitle -->
|
||||
<h3 class="enjoy-subtitle">SOUTH INDIAN AND NORTH<br/>INDIAN CUSINE</h3>
|
||||
<!-- Outline ORDER NOW Button -->
|
||||
<a href="/shop" class="enjoy-btn-outline text-uppercase fw-bold">ORDER NOW <i class="fa fa-arrow-right ms-2"/></a>
|
||||
</div>
|
||||
<!-- Right Image Side -->
|
||||
<div class="col-lg-6 text-center mt-5 mt-lg-0 o_colored_level">
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/offer-dosa-left.webp" class="img img-fluid mx-auto" alt="Dosa Platter Deal" style="max-height: 400px; filter: drop-shadow(0 20px 40px rgba(0, 0, 0, 0.6));"/>
|
||||
|
||||
<!-- RIGHT: Dosa Image with Floating Elements + Watermark -->
|
||||
<div class="col-lg-7 col-md-6 o_colored_level position-relative enjoy-right-col">
|
||||
|
||||
<!-- DOSADOS Watermark Text -->
|
||||
<div class="enjoy-watermark">DOSADOS</div>
|
||||
|
||||
<!-- Floating: Onion Ring (top-left of image area) -->
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/hero-onion-ring.png" class="enjoy-float enjoy-float-onion" alt=""/>
|
||||
|
||||
<!-- Floating: Green Chili (top-right) -->
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/hero-shape2.png" class="enjoy-float enjoy-float-chili" alt=""/>
|
||||
|
||||
<!-- Floating: Tomato Slice (bottom-right) -->
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/tomato.png" class="enjoy-float enjoy-float-tomato" alt=""/>
|
||||
|
||||
<!-- Steam Effect -->
|
||||
<div class="enjoy-steam">
|
||||
<div class="enjoy-steam-line s1"/>
|
||||
<div class="enjoy-steam-line s2"/>
|
||||
<div class="enjoy-steam-line s3"/>
|
||||
</div>
|
||||
|
||||
<!-- Main Dosa Tray Image -->
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/shiva-sakthi-web-banner.webp" class="enjoy-dosa-img img-fluid" alt="Masala Dosa Platter"/>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Testimonial Section -->
|
||||
<section class="s_testimonials_premium o_colored_level" data-snippet="s_testimonials_premium" data-name="Premium Testimonials" style="background-color: #0c0f12; padding: 100px 0;">
|
||||
<div class="container">
|
||||
<div class="row align-items-center g-5">
|
||||
<!-- Left Image Side -->
|
||||
<div class="col-lg-6 o_colored_level text-center">
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/home-testi.webp" class="img img-fluid rounded-circle border border-yellow" style="max-width: 480px; aspect-ratio: 1/1; object-fit: cover; border-width: 8px !important; border-color: #ffb800 !important; box-shadow: 0 20px 40px rgba(0,0,0,0.5);" alt="Testimonial food dish"/>
|
||||
<section class="s_testimonials_premium o_colored_level" style="padding: 0; overflow: hidden;">
|
||||
<div class="row g-0" style="min-height: 580px;">
|
||||
|
||||
<!-- LEFT: Dark Food Pan Image — full cover -->
|
||||
<div class="col-lg-6 col-md-5 testi-left-col">
|
||||
<div class="testi-left-img" style="background-image: url('/dine360_theme_shivasakthi/static/src/img/home-testi.webp');"/>
|
||||
</div>
|
||||
|
||||
<!-- RIGHT: Golden Yellow Background + Review Content -->
|
||||
<div class="col-lg-6 col-md-7 testi-right-col">
|
||||
|
||||
<!-- Tomato accent — bottom right -->
|
||||
<div class="testi-tomato-accent">
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/tomato.png" alt=""/>
|
||||
</div>
|
||||
|
||||
<!-- Right Content Side -->
|
||||
<div class="col-lg-6 o_colored_level">
|
||||
<div class="content-wrapper text-white ps-lg-4">
|
||||
<h6 class="d-flex align-items-center mb-3" style="color: #ffb800; font-weight: 700; letter-spacing: 2px; text-transform: uppercase;">
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/subtitle-icon.png" style="width: 25px; margin-right: 10px;" alt=""/>
|
||||
TESTIMONIALS
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/subtitle-icon.png" style="width: 25px; margin-left: 10px;" alt=""/>
|
||||
</h6>
|
||||
<h2 class="display-4 fw-bold text-white mb-4">What Our Clients Say</h2>
|
||||
|
||||
<!-- Google Reviews Branding -->
|
||||
<div class="google-reviews-info mb-5 d-flex align-items-center gap-3">
|
||||
<img src="https://www.vectorlogo.zone/logos/google/google-ar21.svg" class="google-reviews-logo" alt="Google" style="height: 35px;"/>
|
||||
<div class="stars" style="color: #ffb800; font-size: 16px;">
|
||||
<i class="fa fa-star"/><i class="fa fa-star"/><i class="fa fa-star"/><i class="fa fa-star"/><i class="fa fa-star"/>
|
||||
<span class="ms-2 text-white-50 small">(4.8 / 5.0)</span>
|
||||
<div class="testi-content-wrap">
|
||||
|
||||
<!-- Title -->
|
||||
<h2 class="testi-main-title">WHAT HAVE LOT'S OFF HAPPY CUSTOMER<br/>EXPLORE FEEDBACK</h2>
|
||||
|
||||
<!-- Stars -->
|
||||
<div class="testi-stars mb-3">
|
||||
<i class="fa fa-star"/>
|
||||
<i class="fa fa-star"/>
|
||||
<i class="fa fa-star"/>
|
||||
<i class="fa fa-star"/>
|
||||
<i class="fa fa-star"/>
|
||||
</div>
|
||||
|
||||
<!-- Review Carousel -->
|
||||
<div id="testiCarousel" class="carousel slide" data-bs-ride="carousel" data-bs-interval="5000">
|
||||
<div class="carousel-inner">
|
||||
|
||||
<div class="carousel-item active">
|
||||
<p class="testi-review-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 lot 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!</p>
|
||||
<p class="testi-author-name">Cam Larocque</p>
|
||||
</div>
|
||||
|
||||
<div class="carousel-item">
|
||||
<p class="testi-review-text">Authentic South Indian flavor right here in Mississauga! The biryani was fragrant and the dosa was perfectly crispy. Definitely our new favorite spot for Indian food. The service was warm and attentive throughout our visit.</p>
|
||||
<p class="testi-author-name">Arun Kumar</p>
|
||||
</div>
|
||||
|
||||
<div class="carousel-item">
|
||||
<p class="testi-review-text">Amazing hospitality and even better food. The Chicken Kothu is a must-try. The staff is very friendly and the atmosphere is vibrant and welcoming. Will definitely be coming back with the family!</p>
|
||||
<p class="testi-author-name">Sarah Thompson</p>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- Testimonial Slider -->
|
||||
<div id="testimonialCarousel" class="carousel slide testimonial-carousel" data-bs-ride="carousel">
|
||||
<div class="carousel-inner">
|
||||
<div class="carousel-item active">
|
||||
<p class="lead text-white-50" style="line-height: 1.8; font-style: italic;">"Authentic South Indian flavor right here in Mississauga! The biryani was fragrant and the dosa was perfectly crispy. Definitely our new favorite spot for Indian food."</p>
|
||||
<div class="author-info d-flex align-items-center mt-4">
|
||||
<div class="ms-0">
|
||||
<h6 class="text-white fw-bold mb-0" style="font-size: 18px;">Arun Kumar</h6>
|
||||
<small class="text-white-50">Local Guide</small>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="carousel-item">
|
||||
<p class="lead text-white-50" style="line-height: 1.8; font-style: italic;">"Amazing hospitality and even better food. The Chicken Kothu is a must-try. The staff is very friendly and the atmosphere is vibrant and welcoming."</p>
|
||||
<div class="author-info d-flex align-items-center mt-4">
|
||||
<div class="ms-0">
|
||||
<h6 class="text-white fw-bold mb-0" style="font-size: 18px;">Sarah Thompson</h6>
|
||||
<small class="text-white-50">Regular Customer</small>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Custom Controls -->
|
||||
<div class="testimonial-controls mt-5 d-flex gap-2">
|
||||
<button class="btn btn-outline-warning border-2 rounded-circle" type="button" data-bs-target="#testimonialCarousel" data-bs-slide="prev" style="width: 45px; height: 45px; display: flex; align-items: center; justify-content: center;">
|
||||
<i class="fa fa-arrow-left"/>
|
||||
</button>
|
||||
<button class="btn btn-outline-warning border-2 rounded-circle ms-2" type="button" data-bs-target="#testimonialCarousel" data-bs-slide="next" style="width: 45px; height: 45px; display: flex; align-items: center; justify-content: center;">
|
||||
<i class="fa fa-arrow-right"/>
|
||||
</button>
|
||||
</div>
|
||||
<!-- Prev / Next controls -->
|
||||
<div class="testi-nav-btns mt-4">
|
||||
<button class="testi-nav-btn" type="button" data-bs-target="#testiCarousel" data-bs-slide="prev">
|
||||
<i class="fa fa-chevron-left"/>
|
||||
</button>
|
||||
<button class="testi-nav-btn" type="button" data-bs-target="#testiCarousel" data-bs-slide="next">
|
||||
<i class="fa fa-chevron-right"/>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Premium Blog Section -->
|
||||
<section class="s_blog_premium o_colored_level pt80 pb80" data-snippet="s_blog_premium" data-name="Premium Blog">
|
||||
<t t-set="latest_blogs" t-value="website.get_recent_blogs(3)"/>
|
||||
<!-- Floating Accent -->
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/french-fries-accent.png" class="fries-accent d-none d-lg-block" alt=""/>
|
||||
|
||||
<section class="s_blog_premium o_colored_level" style="background-color: #ffffff; padding: 80px 0;">
|
||||
<div class="container">
|
||||
|
||||
<!-- Header -->
|
||||
<div class="row mb-5">
|
||||
<div class="col-12 text-center">
|
||||
<h6 class="d-flex align-items-center justify-content-center mb-3" style="color: #ffb800; font-weight: 700; letter-spacing: 2px; text-transform: uppercase;">
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/subtitle-icon.png" style="width: 25px; margin-right: 10px;" alt=""/>
|
||||
OUR LATEST FOOD NEWS
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/subtitle-icon.png" style="width: 25px; margin-left: 10px;" alt=""/>
|
||||
</h6>
|
||||
<h2 class="display-4 fw-bold" style="color: #04121D; text-transform: uppercase;">Latest News & Articles</h2>
|
||||
<p class="blog-subtitle-top">THE LATEST NEWS WHAT WE HAVE</p>
|
||||
<h2 class="blog-main-heading">OUR LATEST FOOD NEWS</h2>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row g-4 d-flex align-items-stretch">
|
||||
<t t-foreach="latest_blogs" t-as="blog">
|
||||
<div class="col-lg-4">
|
||||
<div class="blog-card">
|
||||
<div class="blog-img-wrapper">
|
||||
<img t-att-src="blog.get('image')" t-att-alt="blog.get('title')"/>
|
||||
<div class="date-badge">
|
||||
<span t-esc="blog.get('day')"/>
|
||||
<span t-esc="blog.get('month')"/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="blog-body">
|
||||
<span class="category-line" t-esc="'Category: ' + blog.get('category')"/>
|
||||
<h4><a t-attf-href="/blog/#{blog.get('slug')}" class="text-decoration-none" style="color: inherit;" t-esc="blog.get('title')"/></h4>
|
||||
<p class="blog-excerpt" t-esc="blog.get('excerpt')"/>
|
||||
<a t-attf-href="/blog/#{blog.get('slug')}" class="btn-link text-decoration-none fw-bold mt-2 d-inline-block" style="color: #ffb800; font-size: 14px;">Read More</a>
|
||||
</div>
|
||||
<!-- Blog Cards Row -->
|
||||
<div class="row g-4">
|
||||
|
||||
<!-- Card 1 -->
|
||||
<div class="col-lg-4 col-md-6">
|
||||
<div class="blog-news-card">
|
||||
<div class="blog-news-img-wrap">
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/blog-news-1.png" alt="The Flavors of North India" class="blog-news-img"/>
|
||||
</div>
|
||||
<div class="blog-news-body">
|
||||
<h3 class="blog-news-title">THE FLAVORS OF NORTH INDIA: MORE THAN JUST CURRIES</h3>
|
||||
<p class="blog-news-excerpt">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</p>
|
||||
<a href="/blog" class="blog-news-readmore">READ MORE <i class="fa fa-star ms-1"/></a>
|
||||
</div>
|
||||
</div>
|
||||
</t>
|
||||
</div>
|
||||
|
||||
<!-- Bottom Button -->
|
||||
<div class="row mt-5">
|
||||
<div class="col-12 text-center">
|
||||
<a href="/blog" class="know-more-btn">
|
||||
Know More <span><i class="fa fa-arrow-right"></i></span>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<!-- Card 2 -->
|
||||
<div class="col-lg-4 col-md-6">
|
||||
<div class="blog-news-card">
|
||||
<div class="blog-news-img-wrap">
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/blog-news-2.png" alt="The Secret to Perfect North Indian Curries" class="blog-news-img"/>
|
||||
</div>
|
||||
<div class="blog-news-body">
|
||||
<h3 class="blog-news-title">THE SECRET TO PERFECT NORTH INDIAN CURRIES</h3>
|
||||
<p class="blog-news-excerpt">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</p>
|
||||
<a href="/blog" class="blog-news-readmore">READ MORE <i class="fa fa-star ms-1"/></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Card 3 -->
|
||||
<div class="col-lg-4 col-md-6">
|
||||
<div class="blog-news-card">
|
||||
<div class="blog-news-img-wrap">
|
||||
<img src="/dine360_theme_shivasakthi/static/src/img/blog-news-3.png" alt="The Rich History of South Indian Cuisine" class="blog-news-img"/>
|
||||
</div>
|
||||
<div class="blog-news-body">
|
||||
<h3 class="blog-news-title">THE RICH HISTORY OF SOUTH INDIAN CUISINE</h3>
|
||||
<p class="blog-news-excerpt">A Journey Through Time: The Story of South Indian Cuisine</p>
|
||||
<a href="/blog" class="blog-news-readmore">READ MORE <i class="fa fa-star ms-1"/></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user