feat(enhanced-kanban): enhance task card styling for improved UI
- Added a light border, box shadow, and background color to the EnhancedKanbanTaskCard for a more visually appealing design. - Refactored the rendering of TaskCard components in KanbanGroup to eliminate unnecessary React.Fragment wrappers, improving code clarity.
This commit is contained in:
@@ -122,7 +122,6 @@ const KanbanGroup: React.FC<KanbanGroupProps> = memo(({
|
||||
)}
|
||||
|
||||
{group.tasks.map((task, idx) => (
|
||||
<React.Fragment key={task.id}>
|
||||
<TaskCard
|
||||
task={task}
|
||||
onTaskDragStart={onTaskDragStart}
|
||||
@@ -132,7 +131,6 @@ const KanbanGroup: React.FC<KanbanGroupProps> = memo(({
|
||||
isDropIndicator={hoveredGroupId === group.id && hoveredTaskIdx === idx}
|
||||
idx={idx}
|
||||
/>
|
||||
</React.Fragment>
|
||||
))}
|
||||
{(isOwnerOrAdmin || isProjectManager) && !showNewCardTop && !showNewCardBottom && group.tasks.length > 0 && (
|
||||
<Button
|
||||
|
||||
@@ -13,6 +13,12 @@
|
||||
position: relative;
|
||||
}
|
||||
|
||||
html.light .enhanced-kanban-task-card {
|
||||
border: 1.5px solid #e1e4e8 !important; /* Asana-like light border */
|
||||
box-shadow: 0 1px 4px 0 rgba(60, 64, 67, 0.08), 0 0.5px 1.5px 0 rgba(60, 64, 67, 0.03);
|
||||
background: #fff !important;
|
||||
}
|
||||
|
||||
.enhanced-kanban-task-card:hover {
|
||||
box-shadow: 0 2px 6px var(--ant-color-shadow);
|
||||
transform: translateY(-1px);
|
||||
|
||||
Reference in New Issue
Block a user