Switch to version 1: modified src/app/styles/variables.css

Merge version_3 into main

src/app/page.tsx

@@ -2,15 +2,15 @@
 
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
-import ContactCTA from '@/components/sections/contact/ContactCTA';
+import ContactCenter from '@/components/sections/contact/ContactCenter';
 import FeatureBento from '@/components/sections/feature/FeatureBento';
-import FooterMedia from '@/components/sections/footer/FooterMedia';
+import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
 import HeroBillboardGallery from '@/components/sections/hero/HeroBillboardGallery';
 import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
-import MediaAbout from '@/components/sections/about/MediaAbout';
+import ProductCardOne from '@/components/sections/product/ProductCardOne';
+import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
 import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
-import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
-import { MessageCircle } from "lucide-react";
+import { ShoppingBag, Truck, Utensils } from "lucide-react";
 
 export default function LandingPage() {
   return (
@@ -27,121 +27,150 @@ export default function LandingPage() {
         headingFontWeight="bold"
     >
       <ReactLenis root>
-        <div id="nav" data-section="nav">
-          <NavbarStyleFullscreen
-            navItems={[
-              { name: "Home", id: "hero" },
-              { name: "Showcase", id: "gallery" },
-              { name: "Testimonials", id: "testimonials" },
-              { name: "Contact", id: "contact" },
-            ]}
-            brandName="Unique Food Choice"
-          />
-        </div>
+  <div id="nav" data-section="nav">
+      <NavbarStyleFullscreen
+      navItems={[
+        { name: "Home", id: "hero" },
+        { name: "About", id: "about" },
+        { name: "Menu", id: "menu" },
+        { name: "Contact", id: "contact" },
+      ]}
+      brandName="Unique Food Choice"
+    />
+  </div>
 
-        <div id="hero" data-section="hero">
-          <HeroBillboardGallery
-            background={{ variant: "sparkles-gradient" }}
-            title="Unique Food Choice"
-            description="Experience the authentic taste of Karachi at our premium dining destination. Where tradition meets modern flavor."
-            buttons={[{ text: "Order Now", href: "#gallery" }]}
-            mediaItems={[
-              { videoSrc: "https://www.w3schools.com/html/mov_bbb.mp4", videoAriaLabel: "Kitchen Showcase" },
-              { imageSrc: "http://img.b2bpic.net/free-photo/ribeye-steak-finely-cooked-cut-served-with-tartar-sauce_114579-2030.jpg?_wi=1", imageAlt: "Traditional Cuisine" },
-              { imageSrc: "http://img.b2bpic.net/free-photo/stick-kebab-finely-cooked-served-with-orange-sauce_114579-1722.jpg?_wi=1", imageAlt: "Delicious BBQ" }
-            ]}
-            mediaAnimation="blur-reveal"
-          />
-        </div>
-        
-        <div id="collections" data-section="collections">
-            <ProductCardTwo
-                title="Featured Collections"
-                description="Curated selections of our finest dishes."
-                gridVariant="three-columns-all-equal-width"
-                animationType="slide-up"
-                textboxLayout="default"
-                useInvertedBackground={false}
-                products={[
-                    { id: "1", brand: "BBQ", name: "Signature Tikka", price: "$15", rating: 5, reviewCount: "(120)", imageSrc: "http://img.b2bpic.net/free-photo/stick-kebab-finely-cooked-served-with-orange-sauce_114579-1722.jpg" },
-                    { id: "2", brand: "Main", name: "Special Karahi", price: "$25", rating: 4, reviewCount: "(85)", imageSrc: "http://img.b2bpic.net/free-photo/ribeye-steak-finely-cooked-cut-served-with-tartar-sauce_114579-2030.jpg?_wi=2" },
-                    { id: "3", brand: "Starters", name: "Crispy Fries", price: "$8", rating: 5, reviewCount: "(200)", imageSrc: "http://img.b2bpic.net/free-photo/green-salad-lettuce-corns-bell-peppers-parsley-side-view_140725-11265.jpg?_wi=1" }
-                ]}
-            />
-        </div>
+  <div id="hero" data-section="hero">
+      <HeroBillboardGallery
+      background={{
+        variant: "sparkles-gradient"}}
+      title="Unique Food Choice"
+      description="Experience the authentic taste of Karachi at our premium dining destination. Where tradition meets modern flavor."
+      buttons={[
+        { text: "Order Now", href: "#menu" },
+        { text: "View Menu", href: "#menu" },
+      ]}
+      mediaItems={[
+        { imageSrc: "http://img.b2bpic.net/free-photo/stick-kebab-finely-cooked-served-with-orange-sauce_114579-1722.jpg", imageAlt: "Delicious BBQ" },
+        { imageSrc: "http://img.b2bpic.net/free-photo/ribeye-steak-finely-cooked-cut-served-with-tartar-sauce_114579-2030.jpg", imageAlt: "Traditional Cuisine" },
+        { imageSrc: "http://img.b2bpic.net/free-photo/close-up-mix-nuts-figs-plate_23-2148352341.jpg", imageAlt: "Fast Food" },
+        { imageSrc: "http://img.b2bpic.net/free-photo/side-close-up-view-chicken-chicken-with-onion-herbs-lavash-bottle-oil-sauce-garlic-spices_140725-72569.jpg", imageAlt: "Delicious BBQ" },
+        { imageSrc: "http://img.b2bpic.net/free-photo/fried-meat-with-mushroom-sauce-plate_140725-4698.jpg", imageAlt: "Traditional Cuisine" },
+      ]}
+      mediaAnimation="blur-reveal"
+    />
+  </div>
 
-        <div id="about" data-section="about">
-          <MediaAbout
-            title="Our Brand Story"
-            description="At Unique Food Choice, we pride ourselves on serving high-quality Pakistani cuisine crafted from the finest ingredients. Our mission is to provide an unforgettable culinary experience."
-            imageSrc="http://img.b2bpic.net/free-photo/top-view-dining-tables-without-food_23-2150157778.jpg?_wi=1"
-            useInvertedBackground={false}
-          />
-        </div>
+  <div id="about" data-section="about">
+      <TestimonialAboutCard
+      useInvertedBackground={false}
+      tag="About Us"
+      title="Authentic Taste, Affordable Prices"
+      description="At Unique Food Choice, we pride ourselves on serving high-quality Pakistani cuisine crafted from the finest ingredients. Our mission is to provide an unforgettable culinary experience that combines traditional recipes with modern comfort, ensuring every guest feels at home."
+      subdescription="Located in the heart of Aziz Nagar, we strive to maintain the perfect balance of quality and value for our community."
+      imageSrc="http://img.b2bpic.net/free-photo/top-view-dining-tables-without-food_23-2150157778.jpg"
+      mediaAnimation="slide-up"
+      icon={Utensils}
+    />
+  </div>
 
-        <div id="testimonials" data-section="testimonials">
-          <TestimonialCardThirteen
-            animationType="slide-up"
-            textboxLayout="default"
-            useInvertedBackground={false}
-            testimonials={[
-              { id: "1", name: "Ahmed K.", handle: "@ahmed", testimonial: "Good food in economical prices.", rating: 5 },
-              { id: "2", name: "Sara M.", handle: "@sara", testimonial: "The best Balochi Tikka in town!", rating: 5 }
-            ]}
-            showRating={true}
-            title="Customer Testimonials"
-            description="See what our community has to say."
-          />
-        </div>
+  <div id="menu" data-section="menu">
+      <ProductCardOne
+      animationType="slide-up"
+      textboxLayout="split-description"
+      gridVariant="three-columns-all-equal-width"
+      useInvertedBackground={false}
+      products={[
+        { id: "1", name: "Balochi Tikka", price: "PKR 850", imageSrc: "http://img.b2bpic.net/free-photo/bottom-view-raw-chicken-skewers-with-spices-wooden-board-dark-table-free-space_140725-148195.jpg" },
+        { id: "2", name: "Mixed BBQ Platter", price: "PKR 1200", imageSrc: "http://img.b2bpic.net/free-photo/chicken-shish-kebab-with-vegetables-ketchup-mayonnaise-top-view_114579-10378.jpg" },
+        { id: "3", name: "Chicken Burger", price: "PKR 450", imageSrc: "http://img.b2bpic.net/free-photo/closeup-shot-delicious-cheeseburger-with-fresh-ingredients-attached-with-skewers-stick_181624-41852.jpg" },
+        { id: "4", name: "Special Curry", price: "PKR 700", imageSrc: "http://img.b2bpic.net/free-photo/plates-pilaf-grilled-vegetables-mashed-potatoes_141793-1102.jpg" },
+        { id: "5", name: "Family Deal", price: "PKR 2500", imageSrc: "http://img.b2bpic.net/free-photo/people-creating-food-content-upload-internet-food-lovers_23-2151461600.jpg" },
+        { id: "6", name: "Chef Special", price: "PKR 950", imageSrc: "http://img.b2bpic.net/free-photo/tuna-sushi_1203-8900.jpg" },
+      ]}
+      title="Popular Dishes"
+      description="Explore our menu featuring a variety of dishes prepared with love and authentic spices."
+    />
+  </div>
 
-        <div id="gallery" data-section="gallery">
-          <FeatureBento
-            animationType="slide-up"
-            textboxLayout="default"
-            useInvertedBackground={false}
-            features={[
-              { 
-                bentoComponent: "media-stack", 
-                title: "Our Kitchen", 
-                description: "See how we prepare your meals.", 
-                items: [
-                    { imageSrc: "http://img.b2bpic.net/free-photo/green-salad-lettuce-corns-bell-peppers-parsley-side-view_140725-11265.jpg?_wi=2" }, 
-                    { imageSrc: "http://img.b2bpic.net/free-photo/top-view-tasty-soup-with-different-seasonings-grey-floor-soup-meal-food-meat-seasoning-spicy_140725-80760.jpg" },
-                    { imageSrc: "http://img.b2bpic.net/free-photo/stick-kebab-finely-cooked-served-with-orange-sauce_114579-1722.jpg?_wi=2" }
-                ] 
-              }
-            ]}
-            title="Video Reels Showcase"
-            description="Highlights of our restaurant culinary art."
-          />
-        </div>
+  <div id="services" data-section="services">
+      <FeatureBento
+      animationType="slide-up"
+      textboxLayout="split"
+      useInvertedBackground={false}
+      features={[
+        { bentoComponent: "reveal-icon", icon: Utensils, title: "Dine-In", description: "Enjoy a warm and inviting atmosphere in our restaurant." },
+        { bentoComponent: "reveal-icon", icon: ShoppingBag, title: "Takeout", description: "Grab your favorites on the go with quick service." },
+        { bentoComponent: "reveal-icon", icon: Truck, title: "Delivery", description: "Get fresh hot meals delivered directly to your doorstep." },
+      ]}
+      title="Our Services"
+      description="We offer multiple ways to enjoy our food, tailored to your convenience."
+    />
+  </div>
 
-        <div id="contact" data-section="contact">
-          <ContactCTA
-            tag="Join Us"
-            title="Contact Information"
-            description="Visit us at 1k Stop, Block M, Aziz Nagar, Karachi. We are here to serve you the best."
-            buttons={[{ text: "Call Us Now", href: "tel:+923049529287" }]}
-            background={{ variant: "sparkles-gradient" }}
-            useInvertedBackground={false}
-          />
-        </div>
+  <div id="testimonials" data-section="testimonials">
+      <TestimonialCardThirteen
+      animationType="slide-up"
+      textboxLayout="default"
+      useInvertedBackground={false}
+      testimonials={[
+        { id: "1", name: "Ahmed K.", handle: "@ahmed", testimonial: "Good food in economical prices.", rating: 4, imageSrc: "http://img.b2bpic.net/free-photo/low-angle-friends-meeting-restaurant_23-2148395335.jpg" },
+        { id: "2", name: "Sara M.", handle: "@sara", testimonial: "Try balochi tikka. The taste is very different from others.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/friends-eating-barbecue-outdoors_23-2148733608.jpg" },
+        { id: "3", name: "Bilal Z.", handle: "@bilal", testimonial: "Pathetic staff service.", rating: 2, imageSrc: "http://img.b2bpic.net/free-photo/friends-eating-conversating-restaurant_23-2148006704.jpg" },
+        { id: "4", name: "Fatima A.", handle: "@fatima", testimonial: "The best place to have BBQ in town.", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-waitress_107420-12307.jpg" },
+        { id: "5", name: "John D.", handle: "@john", testimonial: "Fast delivery and great taste.", rating: 4, imageSrc: "http://img.b2bpic.net/free-photo/waitress-serving-cup-coffee-customer_1170-656.jpg" },
+      ]}
+      showRating={true}
+      title="What Our Guests Say"
+      description="Feedback from our valued customers."
+    />
+  </div>
 
-        <div id="footer" data-section="footer">
-          <FooterMedia
-            logoText="Unique Food Choice"
-            imageSrc="http://img.b2bpic.net/free-photo/top-view-dining-tables-without-food_23-2150157778.jpg?_wi=1"
-            columns={[
-              { title: "Menu", items: [{ label: "Tikka", href: "#" }, { label: "Karahi", href: "#" }] },
-              { title: "Socials", items: [{ label: "Instagram", href: "#" }, { label: "Facebook", href: "#" }] },
-              { title: "Company", items: [{ label: "About", href: "#" }, { label: "Contact", href: "#" }] }
-            ]}
-          />
-        </div>
-        
-        <a href="https://wa.me/923049529287" target="_blank" className="fixed bottom-6 right-6 z-50 bg-green-500 text-white p-4 rounded-full shadow-lg hover:scale-110 transition-transform">
-           <MessageCircle />
-        </a>
+  <div id="gallery" data-section="gallery">
+      <FeatureBento
+      animationType="slide-up"
+      textboxLayout="default"
+      useInvertedBackground={false}
+      features={[
+        {
+          bentoComponent: "media-stack",          title: "Cuisine",          description: "Freshly prepared delicacies.",          items: [
+            { imageSrc: "http://img.b2bpic.net/free-photo/green-salad-lettuce-corns-bell-peppers-parsley-side-view_140725-11265.jpg" },
+            { imageSrc: "http://img.b2bpic.net/free-photo/top-view-tasty-soup-with-different-seasonings-grey-floor-soup-meal-food-meat-seasoning-spicy_140725-80760.jpg" },
+            { imageSrc: "http://img.b2bpic.net/free-vector/barbecue-grill_24908-55711.jpg" },
+          ],
+        },
+        {
+          bentoComponent: "media-stack",          title: "Delights",          description: "Our signature dishes.",          items: [
+            { imageSrc: "http://img.b2bpic.net/free-photo/close-up-melted-cheese-burger_23-2149342862.jpg" },
+            { imageSrc: "http://img.b2bpic.net/free-photo/side-view-traditional-caucasian-food-kutab-wooden-cutting-board_140725-10322.jpg" },
+            { imageSrc: "http://img.b2bpic.net/free-photo/stir-fried-peas-frying-pan-black-cement-surface_1150-19786.jpg" },
+          ],
+        },
+      ]}
+      title="Food Gallery"
+      description="Visual highlights of our best dishes."
+    />
+  </div>
+
+  <div id="contact" data-section="contact">
+      <ContactCenter
+      useInvertedBackground={false}
+      background={{ variant: "plain" }}
+      tag="Visit Us"
+      title="Contact Us"
+      description="1k Stop, Near Gohar Pakwan, Block M Aziz Nagar, Karachi | +92 304 9529287"
+    />
+  </div>
+
+  <div id="footer" data-section="footer">
+      <FooterLogoEmphasis
+      columns={[
+        { items: [{ label: "Home", href: "#hero" }, { label: "Menu", href: "#menu" }, { label: "Contact", href: "#contact" }] },
+        { items: [{ label: "Instagram", href: "#" }, { label: "Facebook", href: "#" }, { label: "Twitter", href: "#" }] },
+        { items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms of Service", href: "#" }] },
+      ]}
+      logoText="Unique Food Choice"
+    />
+  </div>
       </ReactLenis>
     </ThemeProvider>
   );

src/app/styles/variables.css

@@ -10,15 +10,15 @@
   --accent: #ffffff;
   --background-accent: #ffffff; */
 
-  --background: #fcf6ec;
-  --card: #f3ede2;
-  --foreground: #2e2521;
-  --primary-cta: #2e2521;
+  --background: #080200;
+  --card: #1a0d0b;
+  --foreground: #ffe6d5;
+  --primary-cta: #ffaa70;
   --primary-cta-text: #080200;
-  --secondary-cta: #ffffff;
+  --secondary-cta: #170b07;
   --secondary-cta-text: #ffe6d5;
-  --accent: #b2a28b;
-  --background-accent: #b2a28b;
+  --accent: #7b5e4a;
+  --background-accent: #b8541e;
 
   /* text sizing - set by ThemeProvider */
   /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);