style: update TaskCard for visual feedback on task status

- Added opacity adjustment for completed tasks in TaskCard to enhance visual distinction.
- Improved hover effects and interaction feedback for better user experience.
This commit is contained in:
Julien Froidefond
2025-09-16 09:50:20 +02:00
parent 883ba67599
commit d6a19544d2

View File

@@ -114,6 +114,8 @@ export function TaskCard({ task, onDelete, onEdit, onUpdateTitle, compactView =
style={style} style={style}
className={`p-2 hover:border-[var(--primary)]/30 hover:shadow-lg hover:shadow-[var(--primary)]/10 transition-all duration-300 cursor-pointer group ${ className={`p-2 hover:border-[var(--primary)]/30 hover:shadow-lg hover:shadow-[var(--primary)]/10 transition-all duration-300 cursor-pointer group ${
isDragging ? 'opacity-50 rotate-3 scale-105' : '' isDragging ? 'opacity-50 rotate-3 scale-105' : ''
} ${
task.status === 'done' ? 'opacity-60' : ''
}`} }`}
{...attributes} {...attributes}
{...(isEditingTitle ? {} : listeners)} {...(isEditingTitle ? {} : listeners)}
@@ -196,6 +198,8 @@ export function TaskCard({ task, onDelete, onEdit, onUpdateTitle, compactView =
style={style} style={style}
className={`p-3 hover:border-[var(--primary)]/30 hover:shadow-lg hover:shadow-[var(--primary)]/10 transition-all duration-300 cursor-pointer group ${ className={`p-3 hover:border-[var(--primary)]/30 hover:shadow-lg hover:shadow-[var(--primary)]/10 transition-all duration-300 cursor-pointer group ${
isDragging ? 'opacity-50 rotate-3 scale-105' : '' isDragging ? 'opacity-50 rotate-3 scale-105' : ''
} ${
task.status === 'done' ? 'opacity-60' : ''
}`} }`}
{...attributes} {...attributes}
{...(isEditingTitle ? {} : listeners)} {...(isEditingTitle ? {} : listeners)}