vibeasite-templates/template-project-management
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Seed: project-management template (23 files)

Browse Source
This commit is contained in:
jyswee
2026-07-23 23:01:05 +00:00
parent 5a0efda535
commit 285bddae37
1 changed files with 5 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/Projects.tsx
+5 -5
View File
@@ -113,7 +113,7 @@ export default function ProjectsPage() {
variant={view === "grid" ? "default" : "ghost"} variant={view === "grid" ? "default" : "ghost"}
size="sm" size="sm"
onClick={() => setView("grid")} onClick={() => setView("grid")}
className={`rounded-none \${view === "grid" ? "bg-violet-600 hover:bg-violet-700 text-white" : ""}`} className={`rounded-none ${view === "grid" ? "bg-violet-600 hover:bg-violet-700 text-white" : ""}`}
> >
<LayoutGrid className="h-4 w-4" /> <LayoutGrid className="h-4 w-4" />
</Button> </Button>
@@ -121,7 +121,7 @@ export default function ProjectsPage() {
variant={view === "list" ? "default" : "ghost"} variant={view === "list" ? "default" : "ghost"}
size="sm" size="sm"
onClick={() => setView("list")} onClick={() => setView("list")}
className={`rounded-none \${view === "list" ? "bg-violet-600 hover:bg-violet-700 text-white" : ""}`} className={`rounded-none ${view === "list" ? "bg-violet-600 hover:bg-violet-700 text-white" : ""}`}
> >
<List className="h-4 w-4" /> <List className="h-4 w-4" />
</Button> </Button>
@@ -133,7 +133,7 @@ export default function ProjectsPage() {
</div> </div>
{/* ── Project Grid ── */} {/* ── Project Grid ── */}
<div className={`grid gap-6 stagger \${view === "grid" ? "grid-cols-1 md:grid-cols-2 xl:grid-cols-3" : "grid-cols-1"}`}> <div className={`grid gap-6 stagger ${view === "grid" ? "grid-cols-1 md:grid-cols-2 xl:grid-cols-3" : "grid-cols-1"}`}>
{projects.map((project) => ( {projects.map((project) => (
<Card key={project.id} className="border-0 shadow-sm backdrop-blur-sm bg-card/80 border-border/50 hover:-translate-y-1 hover:shadow-lg transition-all duration-300 cursor-pointer group animate-fade-up"> <Card key={project.id} className="border-0 shadow-sm backdrop-blur-sm bg-card/80 border-border/50 hover:-translate-y-1 hover:shadow-lg transition-all duration-300 cursor-pointer group animate-fade-up">
<CardContent className="p-6"> <CardContent className="p-6">
@@ -144,7 +144,7 @@ export default function ProjectsPage() {
</div> </div>
<div> <div>
<h3 className="font-semibold text-slate-900 group-hover:text-violet-600 transition-colors">{project.title}</h3> <h3 className="font-semibold text-slate-900 group-hover:text-violet-600 transition-colors">{project.title}</h3>
<Badge className={`\${project.statusColor} text-xs font-medium border-0 mt-1`}>{project.status}</Badge> <Badge className={`${project.statusColor} text-xs font-medium border-0 mt-1`}>{project.status}</Badge>
</div> </div>
</div> </div>
<Button variant="ghost" size="sm" className="h-8 w-8 p-0 text-slate-400 opacity-0 group-hover:opacity-100 transition-opacity"> <Button variant="ghost" size="sm" className="h-8 w-8 p-0 text-slate-400 opacity-0 group-hover:opacity-100 transition-opacity">
@@ -168,7 +168,7 @@ export default function ProjectsPage() {
<div className="flex -space-x-2"> <div className="flex -space-x-2">
{project.team.map((member, i) => ( {project.team.map((member, i) => (
<Avatar key={i} className="h-7 w-7 border-2 border-white"> <Avatar key={i} className="h-7 w-7 border-2 border-white">
<AvatarFallback className={`text-[10px] text-white \${project.teamColors[i]}`}>{member}</AvatarFallback> <AvatarFallback className={`text-[10px] text-white ${project.teamColors[i]}`}>{member}</AvatarFallback>
</Avatar> </Avatar>
))} ))}
</div> </div>