AeThex-Corporation/aethex-forge
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Refactor Projects page to use ShowcaseCard and enhance layout

Browse source 
cgen-6d27103e42424add958c1cd1c60cce67
This commit is contained in:
Builder.io 2025-10-19 02:35:52 +00:00
parent 274c21acd1
commit 57e08ae4bf
1 changed files with 4 additions and 36 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

40
client/pages/Projects.tsx
View file

@ -2,6 +2,7 @@ import Layout from "@/components/Layout";
import { Badge } from "@/components/ui/badge";
import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card";
import { Button } from "@/components/ui/button";
import ShowcaseCard from "@/components/showcase/ShowcaseCard";
import { SHOWCASE } from "@/data/showcase";
export default function Projects() {
@ -13,47 +14,14 @@ export default function Projects() {
<section className="container mx-auto max-w-6xl px-4">
<Badge variant="outline" className="border-aethex-400/50 text-aethex-300">Showcase</Badge>
<h1 className="mt-2 text-4xl font-extrabold text-gradient">Projects & Testimonials</h1>
<p className="text-muted-foreground max-w-2xl mt-1">Selected work, outcomes, and words from collaborators.</p>
<p className="text-muted-foreground max-w-2xl mt-1">Studio initiatives across AeThex Platform, Labs, and Studio.</p>
</section>
<section className="container mx-auto max-w-7xl px-4 mt-6">
{hasProjects ? (
<div className="grid gap-6 md:grid-cols-2 lg:grid-cols-3">
<div className="grid gap-6 md:grid-cols-2 xl:grid-cols-3">
{SHOWCASE.map((p) => (
<Card key={p.id} className="bg-card/60 border-border/40 backdrop-blur overflow-hidden group">
{p.image && (
<div className="relative h-40 w-full">
<img src={p.image} alt={p.title} className="h-full w-full object-cover" loading="lazy" />
</div>
)}
<CardHeader className="pb-2">
<CardTitle className="text-base">{p.title}</CardTitle>
<CardDescription>
{[p.role, p.timeframe].filter(Boolean).join(" • ")}
</CardDescription>
</CardHeader>
<CardContent className="space-y-3 pt-0 pb-4">
{p.description && (
<p className="text-sm text-muted-foreground">{p.description}</p>
)}
{p.tags && p.tags.length > 0 && (
<div className="flex flex-wrap gap-2">
{p.tags.map((t) => (
<Badge key={t} variant="outline" className="text-xs">{t}</Badge>
))}
</div>
)}
{p.links && p.links.length > 0 && (
<div className="flex flex-wrap gap-2">
{p.links.map((l) => (
<Button key={l.href} asChild size="sm" variant="outline">
<a href={l.href} target="_blank" rel="noreferrer noopener">{l.label}</a>
</Button>
))}
</div>
)}
</CardContent>
</Card>
<ShowcaseCard key={p.id} p={p} />
))}
</div>
) : (