Spaces:
Build error
Build error
File size: 2,543 Bytes
1216e81 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 | import { GitBranch, Star, ExternalLink, Github } from 'lucide-react';
export default function ProjectCard({ project }) {
return (
<div className="brutal-card group">
{/* Header */}
<div className="flex items-start justify-between mb-4">
<div className="flex items-center gap-3">
<div className="w-12 h-12 bg-brutal-black flex items-center justify-center">
<GitBranch size={24} className="text-brutal-white" />
</div>
<div>
<h3 className="font-bold text-lg group-hover:text-brutal-accent transition-colors">
{project.name}
</h3>
<p className="font-mono text-xs text-brutal-gray">{project.author}</p>
</div>
</div>
{project.featured && (
<span className="font-mono text-xs bg-brutal-accent text-brutal-white px-2 py-1">
Featured
</span>
)}
</div>
{/* Description */}
<p className="text-sm mb-4">{project.description}</p>
{/* Tags */}
<div className="flex flex-wrap gap-2 mb-4">
{project.tags.map((tag) => (
<span
key={tag}
className="font-mono text-xs border-2 border-brutal-black px-2 py-1"
>
{tag}
</span>
))}
</div>
{/* Stats */}
<div className="flex items-center gap-4 mb-4 pt-4 border-t-2 border-brutal-black/10">
<div className="flex items-center gap-1">
<Star size={16} />
<span className="font-mono text-sm">{project.stars}</span>
</div>
<div className="flex items-center gap-1">
<GitBranch size={16} />
<span className="font-mono text-sm">{project.forks}</span>
</div>
<div className="flex items-center gap-1">
<span className="font-mono text-sm text-brutal-gray">{project.language}</span>
</div>
</div>
{/* Links */}
<div className="flex gap-2">
<a
href={project.repoUrl}
target="_blank"
rel="noopener noreferrer"
className="brutal-btn flex-1 flex items-center justify-center gap-2"
>
<Github size={16} />
<span>Repository</span>
</a>
<a
href={project.demoUrl}
target="_blank"
rel="noopener noreferrer"
className="brutal-btn flex items-center justify-center gap-2"
>
<ExternalLink size={16} />
</a>
</div>
</div>
);
} |