gabriel/beetask
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix(kanban): replace hardcoded zinc dark borders with border-border-soft in A Fazer column and task cards

Browse source
This commit is contained in:
Gabriel Menezes 2026-10-12 13:57:42 -04:00
parent 0c57897e46
commit 00224cd650
2 changed files with 9 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
new-frontend/src/components/tasks/TaskCard.tsx
View file

@ -15,7 +15,7 @@ interface TaskCardProps {
const statusConfig: Record<TaskStatus, { label: string; badgeClass: string }> = { const statusConfig: Record<TaskStatus, { label: string; badgeClass: string }> = {
NOT_STARTED: { NOT_STARTED: {
label: 'Não Iniciado', label: 'Não Iniciado',
badgeClass: 'bg-zinc-800 text-zinc-300 border-zinc-700/60', badgeClass: 'bg-surface-sunken text-muted border-border-soft',
}, },
IN_PROGRESS: { IN_PROGRESS: {
label: 'Em Andamento', label: 'Em Andamento',
@ -191,7 +191,7 @@ export const TaskCard: React.FC<TaskCardProps> = ({
</div> </div>
) : ( ) : (
<div <div
className="w-6 h-6 rounded-full bg-zinc-800 border border-zinc-700 flex items-center justify-center text-[10px] text-muted" className="w-6 h-6 rounded-full bg-surface-raised border border-border-soft flex items-center justify-center text-[10px] text-muted"
title="Sem responsável" title="Sem responsável"
> >
<CircleDot className="w-3 h-3" /> <CircleDot className="w-3 h-3" />

14
new-frontend/src/components/tasks/TaskKanbanView.tsx
View file

@ -28,9 +28,9 @@ const COLUMNS: ColumnDef[] = [
status: 'NOT_STARTED', status: 'NOT_STARTED',
label: 'A Fazer', label: 'A Fazer',
icon: CircleDot, icon: CircleDot,
colorClass: 'text-zinc-400', colorClass: 'text-muted',
bgLightClass: 'bg-zinc-500/10', bgLightClass: 'bg-surface-sunken',
borderColor: 'border-zinc-800', borderColor: 'border-border-soft',
}, },
{ {
status: 'IN_PROGRESS', status: 'IN_PROGRESS',
@ -119,7 +119,7 @@ export const TaskKanbanView: React.FC<TaskKanbanViewProps> = ({
}`} }`}
> >
{/* Column Header */} {/* Column Header */}
<div className="flex items-center justify-between p-3.5 border-b border-border/80"> <div className="flex items-center justify-between p-3.5 border-b border-border-soft">
<div className="flex items-center gap-2"> <div className="flex items-center gap-2">
<div <div
className={`w-7 h-7 rounded-lg ${col.bgLightClass} flex items-center justify-center ${col.colorClass}`} className={`w-7 h-7 rounded-lg ${col.bgLightClass} flex items-center justify-center ${col.colorClass}`}
@ -129,7 +129,7 @@ export const TaskKanbanView: React.FC<TaskKanbanViewProps> = ({
<div> <div>
<h3 className="font-semibold text-xs tracking-tight text-foreground flex items-center gap-2"> <h3 className="font-semibold text-xs tracking-tight text-foreground flex items-center gap-2">
{col.label} {col.label}
<span className="px-1.5 py-0.5 rounded-full text-[10px] font-bold bg-surface-raised border border-border text-muted"> <span className="px-1.5 py-0.5 rounded-full text-[10px] font-bold bg-surface-raised border border-border-soft text-muted">
{columnTasks.length} {columnTasks.length}
</span> </span>
</h3> </h3>
@ -145,7 +145,7 @@ export const TaskKanbanView: React.FC<TaskKanbanViewProps> = ({
type="button" type="button"
onClick={() => onAddTaskToStatus(col.status)} onClick={() => onAddTaskToStatus(col.status)}
title={`Adicionar tarefa em ${col.label}`} title={`Adicionar tarefa em ${col.label}`}
className="w-7 h-7 rounded-lg border border-border bg-surface flex items-center justify-center text-muted hover:text-foreground hover:bg-surface-raised transition-colors" className="w-7 h-7 rounded-lg border border-border-soft bg-surface flex items-center justify-center text-muted hover:text-foreground hover:bg-surface-raised transition-colors"
> >
<Plus className="w-3.5 h-3.5" /> <Plus className="w-3.5 h-3.5" />
</button> </button>
@ -166,7 +166,7 @@ export const TaskKanbanView: React.FC<TaskKanbanViewProps> = ({
))} ))}
{columnTasks.length === 0 && ( {columnTasks.length === 0 && (
<div className="flex flex-col items-center justify-center py-12 px-4 text-center rounded-xl border border-dashed border-border/60"> <div className="flex flex-col items-center justify-center py-12 px-4 text-center rounded-xl border border-dashed border-border-soft">
<AlertCircle className="w-6 h-6 text-muted/60 mb-2" /> <AlertCircle className="w-6 h-6 text-muted/60 mb-2" />
<p className="text-xs text-muted">Nenhuma tarefa nesta coluna</p> <p className="text-xs text-muted">Nenhuma tarefa nesta coluna</p>
<button <button