Update src/app/page.tsx

Merge version_1 into main

src/app/page.tsx

@@ -8,6 +8,7 @@ import HeroSplitTestimonial from '@/components/sections/hero/HeroSplitTestimonia
 import MediaAbout from '@/components/sections/about/MediaAbout';
 import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
 import ProductCardFour from '@/components/sections/product/ProductCardFour';
+import ProductCardOne from '@/components/sections/product/ProductCardOne';
 import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
 
 export default function LandingPage() {
@@ -29,21 +30,15 @@ export default function LandingPage() {
       <NavbarStyleCentered
       navItems={[
         {
-          name: "Home",
-          id: "home",
-        },
+          name: "Home",          id: "home"},
         {
-          name: "About",
-          id: "about",
-        },
+          name: "About",          id: "about"},
         {
-          name: "Products",
-          id: "products",
-        },
+          name: "Products",          id: "products"},
         {
-          name: "Contact",
-          id: "contact",
-        },
+          name: "Grid",          id: "grid"},
+        {
+          name: "Contact",          id: "contact"},
       ]}
       brandName="Standard Building Materials"
     />
@@ -52,99 +47,56 @@ export default function LandingPage() {
   <div id="home" data-section="home">
       <HeroSplitTestimonial
       background={{
-        variant: "radial-gradient",
-      }}
+        variant: "radial-gradient"}}
       title="Your Trusted Partner in Building Materials"
       description="Supplying high-quality materials for Baniyas' construction projects, from foundation to finish. Reliable service for all your building needs."
       testimonials={[
         {
-          name: "Ahmed Ibrahim",
-          handle: "@ahmed_cons",
-          testimonial: "Excellent service and high-quality materials. Always on time.",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/smiley-architect-wearing-his-safety-equipment_23-2148242918.jpg",
-        },
+          name: "Ahmed Ibrahim",          handle: "@ahmed_cons",          testimonial: "Excellent service and high-quality materials. Always on time.",          rating: 5,
+          imageSrc: "http://img.b2bpic.net/free-photo/smiley-architect-wearing-his-safety-equipment_23-2148242918.jpg"},
         {
-          name: "Sarah Miller",
-          handle: "@sarah_build",
-          testimonial: "My go-to supplier for all construction site requirements.",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-construction-engineer-looking-camera_23-2148233714.jpg",
-        },
+          name: "Sarah Miller",          handle: "@sarah_build",          testimonial: "My go-to supplier for all construction site requirements.",          rating: 5,
+          imageSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-construction-engineer-looking-camera_23-2148233714.jpg"},
         {
-          name: "Khalid Rashid",
-          handle: "@khalid_eng",
-          testimonial: "Reliable delivery and competitive pricing in Baniyas.",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/young-business-woman-wearing-hard-hat-building-object_1303-27938.jpg",
-        },
+          name: "Khalid Rashid",          handle: "@khalid_eng",          testimonial: "Reliable delivery and competitive pricing in Baniyas.",          rating: 5,
+          imageSrc: "http://img.b2bpic.net/free-photo/young-business-woman-wearing-hard-hat-building-object_1303-27938.jpg"},
         {
-          name: "Fatima Al-Sayed",
-          handle: "@fatima_arch",
-          testimonial: "Professional team and great range of products available.",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/closeup-focus-shot-handsome-adult-man-sitting-pier_181624-30113.jpg",
-        },
+          name: "Fatima Al-Sayed",          handle: "@fatima_arch",          testimonial: "Professional team and great range of products available.",          rating: 5,
+          imageSrc: "http://img.b2bpic.net/free-photo/closeup-focus-shot-handsome-adult-man-sitting-pier_181624-30113.jpg"},
         {
-          name: "Omar Hassan",
-          handle: "@omar_cons",
-          testimonial: "The standard of their cement and steel is unmatched.",
-          rating: 5,
-          imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-posing-with-helmet_23-2148921381.jpg",
-        },
+          name: "Omar Hassan",          handle: "@omar_cons",          testimonial: "The standard of their cement and steel is unmatched.",          rating: 5,
+          imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-posing-with-helmet_23-2148921381.jpg"},
       ]}
       buttons={[
         {
-          text: "View Products",
-          href: "#products",
-        },
+          text: "View Products",          href: "#products"},
       ]}
       imageSrc="http://img.b2bpic.net/free-photo/wood-pallet-cargo-freight-industry-load-logistic_53876-139691.jpg?_wi=1"
       mediaAnimation="slide-up"
       avatars={[
         {
-          src: "http://img.b2bpic.net/free-photo/smiley-architect-wearing-his-safety-equipment_23-2148242918.jpg",
-          alt: "Ahmed",
-        },
+          src: "http://img.b2bpic.net/free-photo/smiley-architect-wearing-his-safety-equipment_23-2148242918.jpg",          alt: "Ahmed"},
         {
-          src: "http://img.b2bpic.net/free-photo/close-up-portrait-construction-engineer-looking-camera_23-2148233714.jpg",
-          alt: "Sarah",
-        },
+          src: "http://img.b2bpic.net/free-photo/close-up-portrait-construction-engineer-looking-camera_23-2148233714.jpg",          alt: "Sarah"},
         {
-          src: "http://img.b2bpic.net/free-photo/young-business-woman-wearing-hard-hat-building-object_1303-27938.jpg",
-          alt: "Khalid",
-        },
+          src: "http://img.b2bpic.net/free-photo/young-business-woman-wearing-hard-hat-building-object_1303-27938.jpg",          alt: "Khalid"},
         {
-          src: "http://img.b2bpic.net/free-photo/closeup-focus-shot-handsome-adult-man-sitting-pier_181624-30113.jpg",
-          alt: "Fatima",
-        },
+          src: "http://img.b2bpic.net/free-photo/closeup-focus-shot-handsome-adult-man-sitting-pier_181624-30113.jpg",          alt: "Fatima"},
         {
-          src: "http://img.b2bpic.net/free-photo/medium-shot-man-posing-with-helmet_23-2148921381.jpg",
-          alt: "Omar",
-        },
+          src: "http://img.b2bpic.net/free-photo/medium-shot-man-posing-with-helmet_23-2148921381.jpg",          alt: "Omar"},
       ]}
       avatarText="Trusted by 500+ local contractors"
       marqueeItems={[
         {
-          type: "text",
-          text: "Premium Steel",
-        },
+          type: "text",          text: "Premium Steel"},
         {
-          type: "text",
-          text: "High-Grade Cement",
-        },
+          type: "text",          text: "High-Grade Cement"},
         {
-          type: "text",
-          text: "Industrial Bricks",
-        },
+          type: "text",          text: "Industrial Bricks"},
         {
-          type: "text",
-          text: "Construction Sand",
-        },
+          type: "text",          text: "Construction Sand"},
         {
-          type: "text",
-          text: "Building Aggregates",
-        },
+          type: "text",          text: "Building Aggregates"},
       ]}
     />
   </div>
@@ -167,113 +119,41 @@ export default function LandingPage() {
       useInvertedBackground={true}
       products={[
         {
-          id: "p1",
-          name: "Reinforcement Steel",
-          price: "Available on Request",
-          variant: "High Grade Steel",
-          imageSrc: "http://img.b2bpic.net/free-photo/waibaidu-bridge-shanghai_1359-928.jpg?_wi=1",
-        },
+          id: "p1",          name: "Reinforcement Steel",          price: "Available on Request",          variant: "High Grade Steel",          imageSrc: "http://img.b2bpic.net/free-photo/waibaidu-bridge-shanghai_1359-928.jpg?_wi=1"},
         {
-          id: "p2",
-          name: "Portland Cement",
-          price: "Bulk Pricing",
-          variant: "Standard/Sulphate",
-          imageSrc: "http://img.b2bpic.net/free-photo/stacks-timber-planks-building-construction-generated-by-ai_188544-26233.jpg?_wi=1",
-        },
+          id: "p2",          name: "Portland Cement",          price: "Bulk Pricing",          variant: "Standard/Sulphate",          imageSrc: "http://img.b2bpic.net/free-photo/stacks-timber-planks-building-construction-generated-by-ai_188544-26233.jpg?_wi=1"},
         {
-          id: "p3",
-          name: "Construction Bricks",
-          price: "Unit Pricing",
-          variant: "Red/Lightweight",
-          imageSrc: "http://img.b2bpic.net/free-photo/photo-wall-texture-pattern_58702-14992.jpg?_wi=1",
-        },
+          id: "p3",          name: "Construction Bricks",          price: "Unit Pricing",          variant: "Red/Lightweight",          imageSrc: "http://img.b2bpic.net/free-photo/photo-wall-texture-pattern_58702-14992.jpg?_wi=1"},
         {
-          id: "p4",
-          name: "Foundation Stones",
-          price: "Per Ton",
-          variant: "Crushed/Clean",
-          imageSrc: "http://img.b2bpic.net/free-photo/wide-angle-shot-gray-concrete-walkway-cloudy-sky_181624-16507.jpg",
-        },
-        {
-          id: "p5",
-          name: "Industrial Plywood",
-          price: "Per Sheet",
-          variant: "Water Resistant",
-          imageSrc: "http://img.b2bpic.net/free-photo/man-working-mdf-boards-warehouse_23-2149384858.jpg",
-        },
-        {
-          id: "p6",
-          name: "Construction Sand",
-          price: "Per Load",
-          variant: "Washed Sand",
-          imageSrc: "http://img.b2bpic.net/free-photo/photo-stone-texture-pattern_58702-14036.jpg",
-        },
+          id: "p4",          name: "Foundation Stones",          price: "Per Ton",          variant: "Crushed/Clean",          imageSrc: "http://img.b2bpic.net/free-photo/wide-angle-shot-gray-concrete-walkway-cloudy-sky_181624-16507.jpg"},
       ]}
       title="Our Product Range"
       description="Comprehensive range of building materials for all your requirements."
     />
   </div>
 
+  <div id="grid" data-section="grid">
+    <ProductCardOne
+      title="Expanded Materials Grid"
+      description="Discover our full range of industrial construction components."
+      gridVariant="bento-grid"
+      animationType="slide-up"
+      textboxLayout="default"
+      useInvertedBackground={false}
+      products={[
+        { id: "g1", name: "Industrial Plywood", price: "$50", imageSrc: "http://img.b2bpic.net/free-photo/man-working-mdf-boards-warehouse_23-2149384858.jpg" },
+        { id: "g2", name: "Construction Sand", price: "$20", imageSrc: "http://img.b2bpic.net/free-photo/photo-stone-texture-pattern_58702-14036.jpg" },
+      ]}
+    />
+  </div>
+
   <div id="testimonial" data-section="testimonial">
       <TestimonialCardFive
       textboxLayout="split"
       useInvertedBackground={false}
       testimonials={[
         {
-          id: "t1",
-          name: "Ahmed Ibrahim",
-          date: "Jan 2025",
-          title: "Lead Engineer",
-          quote: "Reliability defines Standard Building Materials.",
-          tag: "Industrial",
-          avatarSrc: "http://img.b2bpic.net/free-photo/smiley-architect-wearing-his-safety-equipment_23-2148242918.jpg",
-          imageSrc: "http://img.b2bpic.net/free-photo/wood-pallet-cargo-freight-industry-load-logistic_53876-139691.jpg?_wi=2",
-          imageAlt: "construction building materials supply warehouse",
-        },
-        {
-          id: "t2",
-          name: "Sarah Miller",
-          date: "Dec 2024",
-          title: "Site Manager",
-          quote: "Best products, best service in town.",
-          tag: "Project",
-          avatarSrc: "http://img.b2bpic.net/free-photo/close-up-portrait-construction-engineer-looking-camera_23-2148233714.jpg",
-          imageSrc: "http://img.b2bpic.net/free-photo/architect-colleagues-discussing-design-white-foam-building-model-modern-architectural-office-team-two-professional-architects-working-blueprints-desk_482257-37823.jpg?_wi=2",
-          imageAlt: "professional construction materials office team",
-        },
-        {
-          id: "t3",
-          name: "Khalid Rashid",
-          date: "Nov 2024",
-          title: "Developer",
-          quote: "Highly recommended for all Baniyas projects.",
-          tag: "Development",
-          avatarSrc: "http://img.b2bpic.net/free-photo/young-business-woman-wearing-hard-hat-building-object_1303-27938.jpg",
-          imageSrc: "http://img.b2bpic.net/free-photo/waibaidu-bridge-shanghai_1359-928.jpg?_wi=2",
-          imageAlt: "construction steel reinforcement bars stack",
-        },
-        {
-          id: "t4",
-          name: "Fatima Al-Sayed",
-          date: "Oct 2024",
-          title: "Architect",
-          quote: "Professional team with great product knowledge.",
-          tag: "Architectural",
-          avatarSrc: "http://img.b2bpic.net/free-photo/closeup-focus-shot-handsome-adult-man-sitting-pier_181624-30113.jpg",
-          imageSrc: "http://img.b2bpic.net/free-photo/stacks-timber-planks-building-construction-generated-by-ai_188544-26233.jpg?_wi=2",
-          imageAlt: "cement bags construction material supply",
-        },
-        {
-          id: "t5",
-          name: "Omar Hassan",
-          date: "Sep 2024",
-          title: "Contractor",
-          quote: "The gold standard for local builders.",
-          tag: "Construction",
-          avatarSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-posing-with-helmet_23-2148921381.jpg",
-          imageSrc: "http://img.b2bpic.net/free-photo/photo-wall-texture-pattern_58702-14992.jpg?_wi=2",
-          imageAlt: "clay bricks for building construction",
-        },
+          id: "t1",          name: "Ahmed Ibrahim",          date: "Jan 2025",          title: "Lead Engineer",          quote: "Reliability defines Standard Building Materials.",          tag: "Industrial",          avatarSrc: "http://img.b2bpic.net/free-photo/smiley-architect-wearing-his-safety-equipment_23-2148242918.jpg",          imageSrc: "http://img.b2bpic.net/free-photo/wood-pallet-cargo-freight-industry-load-logistic_53876-139691.jpg?_wi=2",          imageAlt: "construction building materials supply warehouse"},
       ]}
       title="Trusted by Construction Professionals"
       description="We value our clients and their commitment to excellence in every project."
@@ -284,16 +164,13 @@ export default function LandingPage() {
       <ContactCTA
       useInvertedBackground={true}
       background={{
-        variant: "plain",
-      }}
+        variant: "plain"}}
       tag="Contact Us"
       title="Ready to Start Your Project?"
       description="Contact us today to discuss your material requirements. We look forward to partnering with you."
       buttons={[
         {
-          text: "Call Now",
-          href: "tel:+971500000000",
-        },
+          text: "Call Now",          href: "tel:+971500000000"},
       ]}
     />
   </div>
@@ -302,33 +179,10 @@ export default function LandingPage() {
       <FooterBase
       columns={[
         {
-          title: "Company",
-          items: [
-            {
-              label: "About Us",
-              href: "#about",
-            },
-            {
-              label: "Products",
-              href: "#products",
-            },
-            {
-              label: "Contact",
-              href: "#contact",
-            },
-          ],
-        },
-        {
-          title: "Resources",
-          items: [
-            {
-              label: "Privacy Policy",
-              href: "#",
-            },
-            {
-              label: "Terms of Service",
-              href: "#",
-            },
+          title: "Company",          items: [
+            { label: "About Us", href: "#about" },
+            { label: "Products", href: "#products" },
+            { label: "Contact", href: "#contact" },
           ],
         },
       ]}