93 lines
4.2 KiB
TypeScript
93 lines
4.2 KiB
TypeScript
"use client";
|
|
|
|
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
|
|
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
|
|
import Link from "next/link";
|
|
import ProductCardTwo from '@/components/sections/product/ProductCardTwo'; // For portfolio display
|
|
|
|
interface FooterProps {
|
|
brandName?: string;
|
|
navItems: Array<{ name: string; href: string; }>;
|
|
}
|
|
|
|
const Footer: React.FC<FooterProps> = ({ brandName = "Nexsoft Australia", navItems }) => {
|
|
return (
|
|
<footer className="w-full py-8 bg-card text-foreground border-t border-accent mt-16">
|
|
<div className="mx-auto px-4 md:px-6 max-w-7xl flex flex-col md:flex-row justify-between items-center gap-4">
|
|
<div className="text-lg font-bold">
|
|
{brandName}
|
|
</div>
|
|
<nav className="flex flex-wrap justify-center gap-6">
|
|
{navItems.map((item) => (
|
|
<Link key={item.href} href={item.href} className="text-foreground hover:text-primary-cta">
|
|
{item.name}
|
|
</Link>
|
|
))}
|
|
</nav>
|
|
<div className="text-sm text-foreground/80">
|
|
© {new Date().getFullYear()} {brandName}. All rights reserved.
|
|
</div>
|
|
</div>
|
|
</footer>
|
|
);
|
|
};
|
|
|
|
export default function PortfolioPage() {
|
|
const navItems = [
|
|
{name: "Home", id: "home", href: "/"},
|
|
{name: "About us", id: "about", href: "/about"},
|
|
{name: "Products", id: "products", href: "/products"},
|
|
{name: "Achievements", id: "achievements", href: "/portfolio"},
|
|
{name: "News", id: "news", href: "/portfolio"},
|
|
{name: "Contact us", id: "contact", href: "/contact"}
|
|
];
|
|
|
|
const navbarProps = {
|
|
brandName: "Nexsoft Australia", navItems: navItems.map(item => ({ name: item.name, id: item.href })),
|
|
button: {text: "Get a Quote", href: "/contact"}
|
|
};
|
|
|
|
const 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"
|
|
defaultTextAnimation="background-highlight"
|
|
borderRadius="soft"
|
|
contentWidth="medium"
|
|
sizing="largeSmall"
|
|
background="blurBottom"
|
|
cardStyle="gradient-radial"
|
|
primaryButtonStyle="primary-glow"
|
|
secondaryButtonStyle="radial-glow"
|
|
headingFontWeight="normal"
|
|
>
|
|
<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} />
|
|
</div>
|
|
</main>
|
|
|
|
<Footer brandName="Nexsoft Australia" navItems={navItems} />
|
|
</ThemeProvider>
|
|
);
|
|
}
|