feat: upgrade empty states with welcome message and column placeholders

This commit is contained in:
Your Name
2026-02-15 20:33:16 +02:00
parent fffa565423
commit e4edc201b9
2 changed files with 18 additions and 7 deletions

View File

@@ -99,6 +99,11 @@ export function KanbanColumn({ column, onCardClick }: KanbanColumnProps) {
</li> </li>
); );
})} })}
{column.cardIds.length === 0 && (
<li className="flex min-h-[60px] items-center justify-center rounded-md border border-dashed border-pylon-text-secondary/20 text-xs text-pylon-text-secondary/50">
Drop or add a card
</li>
)}
</ul> </ul>
</ScrollArea> </ScrollArea>
</SortableContext> </SortableContext>

View File

@@ -24,14 +24,20 @@ export function BoardList() {
if (boards.length === 0) { if (boards.length === 0) {
return ( return (
<> <>
<div className="flex h-full flex-col items-center justify-center gap-4"> <div className="flex h-full flex-col items-center justify-center gap-6">
<p className="font-mono text-sm text-pylon-text-secondary"> <div className="text-center">
Create your first board <h2 className="font-heading text-2xl text-pylon-text">
Welcome to OpenPylon
</h2>
<p className="mt-2 max-w-sm text-sm text-pylon-text-secondary">
A local-first Kanban board that keeps your data on your machine.
Create your first board to get started.
</p> </p>
<div className="flex items-center gap-2"> </div>
<Button onClick={() => setDialogOpen(true)}> <div className="flex items-center gap-3">
<Button size="lg" onClick={() => setDialogOpen(true)}>
<Plus className="size-4" /> <Plus className="size-4" />
New Board Create Board
</Button> </Button>
<ImportExportButtons /> <ImportExportButtons />
</div> </div>