diff --git a/src/app/about-us/AboutContent.tsx b/src/app/about-us/AboutContent.tsx index 3b0ce20..f371dea 100644 --- a/src/app/about-us/AboutContent.tsx +++ b/src/app/about-us/AboutContent.tsx @@ -239,7 +239,10 @@ export default function AboutContent() { transition={{ duration: 0.5 }} >

"{testimonialData[currentTestimonial].text}"

-
+
+ {'★★★★★'} +
+ {/*
{testimonialData[currentTestimonial].name}

{testimonialData[currentTestimonial].role}

-
+
*/} - + {/* Slider dots */} @@ -272,15 +275,15 @@ export default function AboutContent() {
- - Review Us on Google - -
+ + Review Us on Google + + {/* FAQ Section - Image Left, FAQ Right */} diff --git a/src/app/about-us/about.module.css b/src/app/about-us/about.module.css index d0fbd65..314f10e 100644 --- a/src/app/about-us/about.module.css +++ b/src/app/about-us/about.module.css @@ -136,8 +136,8 @@ } .menuButton:hover { - background-color: #c49c5c; - color: #000; + background-color: #c49c5c; + color: #F5E6D3; } .smallHeading { @@ -237,8 +237,8 @@ } .sliderBtn:hover { - background-color: #c49c5c; - color: #000; + background-color: #c49c5c; + color: #F5E6D3; } @@ -343,8 +343,8 @@ } .button:hover { - background-color: var(--color-gold); - color: #d3cab3; + background-color: #c49c5c; + color: #F5E6D3; } /* Call to Action Section */ @@ -397,8 +397,8 @@ } .ctaButton:hover { - background-color: #c49c5c; - color: #000; + background-color: #c49c5c; + color: #F5E6D3; } @media (max-width: 1024px) { diff --git a/src/app/catering/CateringContent.tsx b/src/app/catering/CateringContent.tsx index 5698019..6ab418a 100644 --- a/src/app/catering/CateringContent.tsx +++ b/src/app/catering/CateringContent.tsx @@ -117,7 +117,7 @@ export default function CateringContent() { {/* Page Hero */}
-

Catering Services

+

Catering

Home / Catering

diff --git a/src/app/catering/catering.module.css b/src/app/catering/catering.module.css index b51f259..ae517e5 100644 --- a/src/app/catering/catering.module.css +++ b/src/app/catering/catering.module.css @@ -114,7 +114,7 @@ color: var(--color-paragraph); line-height: 1.8; font-family: var(--font-lato); - max-width: 800px; + /* max-width: 800px; */ margin: 0 auto; } @@ -147,7 +147,7 @@ color: var(--color-paragraph); line-height: 1.8; font-family: var(--font-lato); - max-width: 800px; + /* max-width: 800px; */ margin: 0 auto; } @@ -430,7 +430,7 @@ color: var(--color-paragraph); line-height: 1.8; font-family: var(--font-lato); - max-width: 800px; + /* max-width: 800px; */ margin: 0 auto; } @@ -656,7 +656,7 @@ color: var(--color-paragraph); line-height: 1.8; font-family: var(--font-lato); - max-width: 800px; + /* max-width: 800px; */ margin: 0 auto; } @@ -943,47 +943,67 @@ } .aboutImagesGrid { - display: grid; - grid-template-columns: 1fr 1fr; - grid-template-rows: 1fr 1fr; - gap: 20px; + position: relative; height: 600px; + display: block; + /* Changed from grid to allow absolute positioning of children */ } .aboutImageLarge { - grid-column: 1; - grid-row: 1 / 3; - position: relative; + position: absolute; + top: 50%; + left: 50%; + transform: translate(-50%, -50%); + width: 65%; + height: 75%; + z-index: 1; + border-radius: 20px; overflow: hidden; - box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1); + box-shadow: 0 20px 50px rgba(0, 0, 0, 0.2); } .aboutImageSmallTop { - grid-column: 2; - grid-row: 1; - position: relative; + position: absolute; + top: 0; + right: 0; + width: 45%; + height: 45%; + z-index: 2; + border-radius: 20px; overflow: hidden; - box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1); + box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15); + border: 5px solid #f5e6d3; + /* Match background color for separation */ } .aboutImageSmallBottom { - grid-column: 2; - grid-row: 2; - position: relative; + position: absolute; + bottom: 0; + left: 0; + width: 45%; + height: 45%; + z-index: 2; + border-radius: 20px; overflow: hidden; - box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1); + box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15); + border: 5px solid #f5e6d3; + /* Match background color for separation */ } .aboutImageLarge img, .aboutImageSmallTop img, .aboutImageSmallBottom img { - transition: transform 0.6s ease; + transition: transform 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94); +} + +.aboutImagesGrid:hover .aboutImageLarge img { + transform: translate(-0%, -0%) scale(1.05); + /* Maintain centering while scaling */ } -.aboutImagesGrid:hover .aboutImageLarge img, .aboutImagesGrid:hover .aboutImageSmallTop img, .aboutImagesGrid:hover .aboutImageSmallBottom img { - transform: scale(1.05); + transform: scale(1.1); } .aboutContent { @@ -1019,24 +1039,25 @@ } .lastButton { - display: inline-block; - margin-top: 30px; - padding: 15px 40px; - background-color: var(--color-button); - color: #fff; - text-decoration: none; + color: var(--color-paragraph); font-family: var(--font-lato); - font-weight: 600; text-transform: uppercase; letter-spacing: 1px; - transition: all 0.3s ease; - border-radius: 4px; + background: none; + border: 2px solid #b07c4b; + margin-top: 1rem; + padding: 15px 40px; + font-size: 1.1rem; + text-decoration: none; + transition: all .3s; + display: inline-block; } .lastButton:hover { - background-color: #5d4037; + background-color: #c49c5c; + color: #F5E6D3; transform: translateY(-2px); - box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2); + /* box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2); */ } @media (max-width: 991px) { @@ -1049,6 +1070,17 @@ height: 500px; } + .aboutImageLarge { + width: 70%; + height: 70%; + } + + .aboutImageSmallTop, + .aboutImageSmallBottom { + width: 40%; + height: 40%; + } + .aboutContent { padding: 20px 0; } @@ -1075,8 +1107,52 @@ @media (max-width: 480px) { .aboutImagesGrid { - height: 350px; - gap: 10px; + height: auto; + display: grid; + grid-template-columns: 1fr 1fr; + grid-template-rows: auto auto; + gap: 15px; + margin-bottom: 30px; + } + + .aboutImageLarge { + position: relative; + top: auto; + left: auto; + transform: none; + width: 100%; + height: 300px; + grid-column: 1 / -1; + grid-row: 1; + border-radius: 15px; + } + + .aboutImageSmallTop { + position: relative; + top: auto; + right: auto; + width: 100%; + height: 200px; + grid-column: 1; + grid-row: 2; + border-radius: 15px; + border: none; + } + + .aboutImageSmallBottom { + position: relative; + bottom: auto; + left: auto; + width: 100%; + height: 200px; + grid-column: 2; + grid-row: 2; + border-radius: 15px; + border: none; + } + + .aboutImagesGrid:hover .aboutImageLarge img { + transform: scale(1.05); } .aboutSpecialsItem { diff --git a/src/components/About/About.module.css b/src/components/About/About.module.css index 8ac7528..18b44c5 100644 --- a/src/components/About/About.module.css +++ b/src/components/About/About.module.css @@ -112,7 +112,7 @@ .button:hover { background-color: #c49c5c; - color: #000; + color: #F5E6D3; } @media (max-width: 1024px) { diff --git a/src/components/Blogs/Blogs.module.css b/src/components/Blogs/Blogs.module.css index 14a8b2c..1c6969b 100644 --- a/src/components/Blogs/Blogs.module.css +++ b/src/components/Blogs/Blogs.module.css @@ -151,7 +151,7 @@ .viewMoreButton:hover { background-color: #c49c5c; - color: #000; + color: #F5E6D3; } /* Responsive adjustments for different viewport sizes */ diff --git a/src/components/BookTable/BookTable.module.css b/src/components/BookTable/BookTable.module.css index c751ab2..563db9f 100644 --- a/src/components/BookTable/BookTable.module.css +++ b/src/components/BookTable/BookTable.module.css @@ -121,7 +121,7 @@ .submitButton:hover { background-color: #c49c5c; - color: #d3cab3; + color: #F5E6D3; } .successMessage { diff --git a/src/components/Gallery/Gallery.module.css b/src/components/Gallery/Gallery.module.css index 2812eff..393fd85 100644 --- a/src/components/Gallery/Gallery.module.css +++ b/src/components/Gallery/Gallery.module.css @@ -82,8 +82,8 @@ } .button:hover { - background-color: var(--color-gold); - color: #d3cab3; + background-color: #c49c5c; + color: #F5E6D3; } /* Lightbox */ diff --git a/src/components/PopularDishes/PopularDishes.module.css b/src/components/PopularDishes/PopularDishes.module.css index 16f276f..3a15a48 100644 --- a/src/components/PopularDishes/PopularDishes.module.css +++ b/src/components/PopularDishes/PopularDishes.module.css @@ -119,7 +119,7 @@ .viewMoreButton:hover { background-color: #c49c5c; - color: #000; + color: #F5E6D3; } @media (max-width: 768px) { diff --git a/src/components/Testimonials/Testimonials.module.css b/src/components/Testimonials/Testimonials.module.css index 71714c3..6ed2c39 100644 --- a/src/components/Testimonials/Testimonials.module.css +++ b/src/components/Testimonials/Testimonials.module.css @@ -113,7 +113,7 @@ font-family: var(--font-inter), sans-serif; /* Assuming Inter or similar */ font-size: 1.1rem; - color: var(--color-paragraph); + color: #f5e6d3; margin-bottom: 30px; font-weight: 500; } @@ -183,8 +183,8 @@ } .button:hover { - background-color: var(--color-gold); - color: #d3cab3; + background-color: #c49c5c; + color: #F5E6D3; } /* Responsive adjustments for different viewport sizes */ diff --git a/src/components/Testimonials/Testimonials.tsx b/src/components/Testimonials/Testimonials.tsx index bbdee1e..dd93ea2 100644 --- a/src/components/Testimonials/Testimonials.tsx +++ b/src/components/Testimonials/Testimonials.tsx @@ -3,51 +3,9 @@ import { useState, useEffect } from 'react' import Image from 'next/image' import styles from './Testimonials.module.css' +import { testimonialData } from '@/utils/constant' -const testimonials = [ - { - id: 1, - name: 'Anya Petrova', - image: '/images/avatar-anya.png', - text: '"An unforgettable journey of flavors and warmth. The ambiance is exquisite and the Turkish fusion dishes are simply divine."', - rating: 5 - }, - { - id: 2, - name: 'Tuest Khan', - image: '/images/avatar-tuest.png', - text: '"The best Turkish restaurant in town! Every dish is prepared with authentic spices and love. The staff made us feel like family."', - rating: 5 - }, - { - id: 3, - name: 'Tariq Ahmed', - image: '/images/avatar-tariq.png', - text: '"Exceptional quality and presentation. The kebabs were perfectly grilled and the baklava for dessert was heavenly!"', - rating: 5 - }, - { - id: 4, - name: 'Sarah Jenkins', - image: '/images/avatar-sarah.png', - text: '"Amazing service and beautiful atmosphere. The mixed grill platter is a must-try. Highly recommend for special occasions!"', - rating: 5 - }, - { - id: 5, - name: 'Michael Chen', - image: '/images/avatar-michael.png', - text: '"A hidden gem! The fusion of traditional Turkish flavors with modern techniques is incredible. Will definitely come back soon."', - rating: 5 - }, - { - id: 6, - name: 'Emily Davis', - image: '/images/avatar-emily.png', - text: '"The staff was so welcoming and the food was absolutely delicious. From appetizers to dessert, everything was perfect. 10/10 experience!"', - rating: 5 - } -] +const testimonials = testimonialData export default function Testimonials() { const [currentIndex, setCurrentIndex] = useState(0) @@ -108,9 +66,9 @@ export default function Testimonials() {

— {item.name}

-

{item.text}

-
- {'★'.repeat(item.rating)} +

"{item.text}"

+
+ {'★★★★★'}
))} @@ -120,7 +78,7 @@ export default function Testimonials() {