julienfroidefond/towercontrol
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(FoldersSidebar): reorganize button and notes count display for improved layout and accessibility

Browse Source
This commit is contained in:
Julien Froidefond
2026-01-12 10:59:06 +01:00
parent 75d31e86ac
commit 1ea76fed64
1 changed files with 22 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

43
src/components/notes/FoldersSidebar.tsx
View File

@@ -145,27 +145,28 @@ function FolderItem({
})()}
<span className="flex-1 text-sm truncate">{folder.name}</span>
{folder.notesCount !== undefined && folder.notesCount > 0 && (
<span className="text-xs text-[var(--muted-foreground)]">
{folder.notesCount}
</span>
)}
<div className="opacity-0 group-hover:opacity-100 transition-opacity flex items-center gap-1">
<button
onClick={handleEdit}
className="p-1 hover:bg-[var(--primary)]/10 text-[var(--muted-foreground)] hover:text-[var(--primary)] rounded transition-colors"
title="Renommer"
>
<Edit2 className="w-3 h-3" />
</button>
<button
onClick={handleDelete}
className="p-1 hover:bg-[var(--destructive)]/10 text-[var(--muted-foreground)] hover:text-[var(--destructive)] rounded transition-colors"
title="Supprimer"
>
<Trash2 className="w-3 h-3" />
</button>
<div className="flex items-center justify-end gap-2 min-w-[2rem]">
<div className="opacity-0 group-hover:opacity-100 transition-opacity flex items-center gap-1">
<button
onClick={handleEdit}
className="p-1 hover:bg-[var(--primary)]/10 text-[var(--muted-foreground)] hover:text-[var(--primary)] rounded transition-colors"
title="Renommer"
>
<Edit2 className="w-3 h-3" />
</button>
<button
onClick={handleDelete}
className="p-1 hover:bg-[var(--destructive)]/10 text-[var(--muted-foreground)] hover:text-[var(--destructive)] rounded transition-colors"
title="Supprimer"
>
<Trash2 className="w-3 h-3" />
</button>
</div>
{folder.notesCount !== undefined && folder.notesCount > 0 && (
<span className="text-xs text-[var(--muted-foreground)]">
{folder.notesCount}
</span>
)}
</div>
</div>