From 87421ba2c182910efba963087efb1a40b9340f1d Mon Sep 17 00:00:00 2001
From: bender <kudin.dima@gmail.com>
Date: Thu, 26 Mar 2026 12:50:36 +0000
Subject: [PATCH] Update src/app/portfolio/page.tsx

---
 src/app/portfolio/page.tsx | 54 ++++++++++++++++++++++----------------
 1 file changed, 31 insertions(+), 23 deletions(-)

diff --git a/src/app/portfolio/page.tsx b/src/app/portfolio/page.tsx
index 1286f6e..4b09207 100644
--- a/src/app/portfolio/page.tsx
+++ b/src/app/portfolio/page.tsx
@@ -3,7 +3,6 @@
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
 import Link from "next/link";
-import ProductCardTwo, { ProductCardTwoProps } from '@/components/sections/product/ProductCardTwo'; // For portfolio display
 
 interface FooterProps {
   brandName?: string;
@@ -43,21 +42,10 @@ export default function PortfolioPage() {
   ];
 
   const navbarProps = {
-    brandName: "Nexsoft Australia",    navItems: navItems.map(item => ({ name: item.name, id: item.href })),
+    brandName: "Nexsoft Australia",    navItems: navItems,
     button: {text: "Get a Quote", href: "/contact"}
   };
 
-  const productCardTwoProps: ProductCardTwoProps = {
-    title: "Our Portfolio",    description: "Discover the projects we've brought to life.",    gridVariant: "bento-grid", // This is valid for ProductCardTwo
-    animationType: "slide-up",    textboxLayout: "default",    useInvertedBackground: false,
-    products: [
-        { id: "1", brand: "Client Project", name: "Project Alpha", price: "Case Study", rating: 5, reviewCount: "0", imageSrc: "https://r2.webild.io/p/4e2bb7a8-1a5c-4235-9008-012903330663_img_1.webp", imageAlt: "Project Alpha screenshot" },
-        { id: "2", brand: "Client Project", name: "Project Beta", price: "Case Study", rating: 5, reviewCount: "0", imageSrc: "https://r2.webild.io/p/4e2bb7a8-1a5c-4235-9008-012903330663_img_2.webp", imageAlt: "Project Beta screenshot" },
-        { id: "3", brand: "Client Project", name: "Project Gamma", price: "Case Study", rating: 5, reviewCount: "0", imageSrc: "https://r2.webild.io/p/4e2bb7a8-1a5c-4235-9008-012903330663_img_3.webp", imageAlt: "Project Gamma screenshot" },
-        { id: "4", brand: "Client Project", name: "Project Delta", price: "Case Study", rating: 5, reviewCount: "0", imageSrc: "https://r2.webild.io/p/4e2bb7a8-1a5c-4235-9008-012903330663_img_4.webp", imageAlt: "Project Delta screenshot" }
-    ]
-  };
-
   return (
     <ThemeProvider
       defaultButtonVariant="hover-magnetic"
@@ -74,18 +62,38 @@ export default function PortfolioPage() {
       <div id="nav" data-section="nav">
         <NavbarLayoutFloatingOverlay {...navbarProps} />
       </div>
-
-      <main>
-        <div id="portfolio-hero" data-section="portfolio-hero" className="py-20 md:py-32 text-center">
-          <h1 className="text-4xl md:text-6xl font-bold text-foreground">Our Portfolio</h1>
-          <p className="mt-4 text-xl text-foreground/80 max-w-2xl mx-auto">Explore our diverse range of successful projects and client collaborations.</p>
-        </div>
-
-        <div id="product-card-two" data-section="product-card-two">
-          <ProductCardTwo {...productCardTwoProps} />
+      <main className="min-h-[calc(100vh-16rem)] flex flex-col items-center justify-center p-8 bg-background">
+        <h1 className="text-4xl md:text-6xl font-bold text-center mb-8 text-foreground">Our Portfolio</h1>
+        <p className="text-lg text-center max-w-3xl text-foreground/80">
+          Explore a selection of our recent projects and client success stories.
+        </p>
+        <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-8 mt-12 w-full max-w-6xl">
+          <div className="bg-card p-6 rounded-lg shadow-lg border border-accent">
+            <h3 className="text-xl font-semibold mb-2 text-foreground">Project Alpha</h3>
+            <p className="text-foreground/80">A cutting-edge web application for data visualization.</p>
+          </div>
+          <div className="bg-card p-6 rounded-lg shadow-lg border border-accent">
+            <h3 className="text-xl font-semibold mb-2 text-foreground">Project Beta</h3>
+            <p className="text-foreground/80">Mobile app development for a leading e-commerce brand.</p>
+          </div>
+          <div className="bg-card p-6 rounded-lg shadow-lg border border-accent">
+            <h3 className="text-xl font-semibold mb-2 text-foreground">Project Gamma</h3>
+            <p className="text-foreground/80">Enterprise-level CRM system integration and customization.</p>
+          </div>
+          <div className="bg-card p-6 rounded-lg shadow-lg border border-accent">
+            <h3 className="text-xl font-semibold mb-2 text-foreground">Project Delta</h3>
+            <p className="text-foreground/80">Cloud infrastructure migration and optimization.</p>
+          </div>
+          <div className="bg-card p-6 rounded-lg shadow-lg border border-accent">
+            <h3 className="text-xl font-semibold mb-2 text-foreground">Project Epsilon</h3>
+            <p className="text-foreground/80">AI-powered analytics platform development.</p>
+          </div>
+          <div className="bg-card p-6 rounded-lg shadow-lg border border-accent">
+            <h3 className="text-xl font-semibold mb-2 text-foreground">Project Zeta</h3>
+            <p className="text-foreground/80">Custom blockchain solution for secure transactions.</p>
+          </div>
         </div>
       </main>
-
       <Footer brandName="Nexsoft Australia" navItems={navItems} />
     </ThemeProvider>
   );