lorentz/seubert-claims
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

ui: increase spacing and font size in task header bar

Browse source
This commit is contained in:
lorentz 2026-04-09 00:58:47 +00:00
parent fd878f7701
commit 17f475cd9c
1 changed files with 15 additions and 15 deletions
Download patch file Download diff file Expand all files Collapse all files

30
ondeck/src/app/(dashboard)/tasks/page-client.tsx
View file

@ -790,7 +790,7 @@ export function TasksClient({ initialTasks, currentUserId, isPrivileged, users }
<Card>
{/* Sort / filter / status header */}
<div className="px-6 pt-5 pb-3">
<div className="flex items-center gap-2 flex-wrap rounded-md border border-border bg-muted/30 px-3 py-2 text-xs">
<div className="flex items-center gap-3 flex-wrap rounded-md border border-border bg-muted/30 px-4 py-2.5 text-sm">
{/* Sort buttons */}
{([
['client', 'Client'],
@ -801,7 +801,7 @@ export function TasksClient({ initialTasks, currentUserId, isPrivileged, users }
<button
key={key}
onClick={() => handleSort(key)}
className={`flex items-center gap-1 px-2.5 py-1 rounded transition-colors font-medium ${
className={`flex items-center gap-1.5 px-3 py-1.5 rounded transition-colors font-medium ${
sortKey === key
? 'bg-primary text-primary-foreground'
: 'text-muted-foreground hover:bg-muted hover:text-foreground'
@ -809,9 +809,9 @@ export function TasksClient({ initialTasks, currentUserId, isPrivileged, users }
>
{label}
{sortKey === key ? (
sortDir === 'asc' ? <ArrowUp className="h-3 w-3" /> : <ArrowDown className="h-3 w-3" />
sortDir === 'asc' ? <ArrowUp className="h-3.5 w-3.5" /> : <ArrowDown className="h-3.5 w-3.5" />
) : (
<ArrowUpDown className="h-3 w-3 opacity-40" />
<ArrowUpDown className="h-3.5 w-3.5 opacity-40" />
)}
</button>
))}
@ -821,8 +821,8 @@ export function TasksClient({ initialTasks, currentUserId, isPrivileged, users }
{/* Type filter */}
<Select value={typeFilter} onValueChange={(v) => setTypeFilter(v as any)}>
<SelectTrigger className="h-7 w-[100px] text-xs border-0 bg-transparent shadow-none px-2">
<Filter className="h-3 w-3 mr-1 opacity-60" />
<SelectTrigger className="h-8 w-[120px] text-sm border-border bg-background/50 px-3 gap-1.5">
<Filter className="h-3.5 w-3.5 opacity-60 shrink-0" />
<SelectValue />
</SelectTrigger>
<SelectContent>
@ -835,8 +835,8 @@ export function TasksClient({ initialTasks, currentUserId, isPrivileged, users }
{/* Priority filter */}
<Select value={priorityFilter} onValueChange={(v) => setPriorityFilter(v as any)}>
<SelectTrigger className="h-7 w-[110px] text-xs border-0 bg-transparent shadow-none px-2">
<Filter className="h-3 w-3 mr-1 opacity-60" />
<SelectTrigger className="h-8 w-[130px] text-sm border-border bg-background/50 px-3 gap-1.5">
<Filter className="h-3.5 w-3.5 opacity-60 shrink-0" />
<SelectValue />
</SelectTrigger>
<SelectContent>
@ -850,34 +850,34 @@ export function TasksClient({ initialTasks, currentUserId, isPrivileged, users }
{(typeFilter !== 'all' || priorityFilter !== 'all') && (
<button
onClick={() => { setTypeFilter('all'); setPriorityFilter('all') }}
className="flex items-center gap-1 px-2 py-1 rounded text-muted-foreground hover:text-foreground hover:bg-muted transition-colors"
className="flex items-center gap-1 px-2.5 py-1.5 rounded text-muted-foreground hover:text-foreground hover:bg-muted transition-colors"
>
<X className="h-3 w-3" /> Clear
<X className="h-3.5 w-3.5" /> Clear
</button>
)}
<span className="mx-1 h-4 w-px bg-border" />
<span className="mx-1 h-5 w-px bg-border" />
{/* Transfer button */}
{isPrivileged && visibleTasks.length > 0 && (
<Button
size="sm"
variant="outline"
className="gap-1.5 h-7 text-xs"
className="gap-1.5 h-8 text-sm"
onClick={() => setTransferOpen(true)}
>
<ArrowRightLeft className="h-3 w-3" />
<ArrowRightLeft className="h-3.5 w-3.5" />
Transfer{cardFilter ? ` ${visibleTasks.length}` : ''}
</Button>
)}
{/* Assigned / Completed / All */}
<div className="flex rounded-md border border-border overflow-hidden text-xs">
<div className="flex rounded-md border border-border overflow-hidden text-sm">
{(['assigned', 'completed', 'all'] as const).map((f) => (
<button
key={f}
onClick={() => setFilter(f)}
className={`px-2.5 py-1 capitalize transition-colors ${
className={`px-3 py-1.5 capitalize transition-colors ${
filter === f
? 'bg-primary text-primary-foreground'
: 'text-muted-foreground hover:bg-muted'