feat: enhance KanbanColumn and TaskCard styles for better responsiveness
- Updated KanbanColumn to adjust width for medium screens, improving layout flexibility. - Modified TaskCard title font size for better readability and increased line clamp for title overflow. - Adjusted margin for task tags based on task status, enhancing visual clarity.
This commit is contained in:
@@ -67,7 +67,7 @@ export function KanbanColumn({ id, title, color, tasks, onCreateTask, onDeleteTa
|
|||||||
const badgeVariant = color === 'green' ? 'success' : color === 'blue' ? 'primary' : color === 'red' ? 'danger' : 'default';
|
const badgeVariant = color === 'green' ? 'success' : color === 'blue' ? 'primary' : color === 'red' ? 'danger' : 'default';
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="flex-shrink-0 w-80 h-full">
|
<div className="flex-shrink-0 w-80 md:w-1/4 md:flex-1 h-full">
|
||||||
<Card
|
<Card
|
||||||
ref={setNodeRef}
|
ref={setNodeRef}
|
||||||
variant="elevated"
|
variant="elevated"
|
||||||
|
|||||||
@@ -128,7 +128,7 @@ export function TaskCard({ task, onDelete, onEdit, onUpdateTitle, compactView =
|
|||||||
/>
|
/>
|
||||||
) : (
|
) : (
|
||||||
<h4
|
<h4
|
||||||
className="font-mono text-sm font-medium text-slate-100 leading-tight line-clamp-1 flex-1 cursor-pointer hover:text-cyan-300 transition-colors"
|
className="font-mono text-xs font-medium text-slate-100 leading-tight line-clamp-2 flex-1 cursor-pointer hover:text-cyan-300 transition-colors"
|
||||||
onClick={handleTitleClick}
|
onClick={handleTitleClick}
|
||||||
title={onUpdateTitle ? "Cliquer pour éditer" : undefined}
|
title={onUpdateTitle ? "Cliquer pour éditer" : undefined}
|
||||||
>
|
>
|
||||||
@@ -254,7 +254,11 @@ export function TaskCard({ task, onDelete, onEdit, onUpdateTitle, compactView =
|
|||||||
|
|
||||||
{/* Tags avec couleurs */}
|
{/* Tags avec couleurs */}
|
||||||
{task.tags && task.tags.length > 0 && (
|
{task.tags && task.tags.length > 0 && (
|
||||||
<div className="mb-3">
|
<div className={
|
||||||
|
(task.dueDate || (task.source && task.source !== 'manual') || task.completedAt)
|
||||||
|
? "mb-3"
|
||||||
|
: "mb-0"
|
||||||
|
}>
|
||||||
<TagDisplay
|
<TagDisplay
|
||||||
tags={task.tags}
|
tags={task.tags}
|
||||||
availableTags={availableTags}
|
availableTags={availableTags}
|
||||||
|
|||||||
Reference in New Issue
Block a user