fix: card-level buttons use ghost/outline instead of solid primary

Repeated per-card action buttons (Start Session, Resume, Save, Insert,
Start batch) now use cyan outline style to reduce visual noise.
Page-level and modal primary actions remain solid cyan.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
2026-03-22 22:22:52 +00:00
parent 8fd4207ee6
commit ae25c564b6
6 changed files with 10 additions and 10 deletions

View File

@@ -52,7 +52,7 @@ export function OpenSessions({ sessions }: OpenSessionsProps) {
<Link <Link
to={getTreeNavigatePath(session.treeId, session.treeType)} to={getTreeNavigatePath(session.treeId, session.treeType)}
state={{ sessionId: session.id }} state={{ sessionId: session.id }}
className="shrink-0 rounded-lg bg-primary px-3 py-1 text-[0.6875rem] font-medium text-white hover:brightness-110 transition-opacity" className="shrink-0 rounded-lg border border-primary/40 px-3 py-1 text-[0.6875rem] font-medium text-primary hover:bg-primary/10 hover:border-primary/60 transition-colors"
> >
Resume Resume
</Link> </Link>

View File

@@ -163,8 +163,8 @@ export function TreeGridView({
type="button" type="button"
onClick={() => onStartSession(tree.id, tree.tree_type)} onClick={() => onStartSession(tree.id, tree.tree_type)}
className={cn( className={cn(
'rounded-md bg-primary px-3 py-2 text-sm font-medium text-white', 'rounded-md border border-primary/40 px-3 py-2 text-sm font-medium text-primary',
'hover:brightness-110' 'hover:bg-primary/10 hover:border-primary/60 transition-colors'
)} )}
> >
Start Session Start Session

View File

@@ -166,8 +166,8 @@ export function TreeListView({
type="button" type="button"
onClick={() => onStartSession(tree.id, tree.tree_type)} onClick={() => onStartSession(tree.id, tree.tree_type)}
className={cn( className={cn(
'rounded-md bg-primary px-3 py-1.5 text-sm font-medium text-white', 'rounded-md border border-primary/40 px-3 py-1.5 text-sm font-medium text-primary',
'hover:brightness-110 whitespace-nowrap' 'hover:bg-primary/10 hover:border-primary/60 transition-colors whitespace-nowrap'
)} )}
> >
Start Start

View File

@@ -270,8 +270,8 @@ export function TreeTableView({
type="button" type="button"
onClick={() => onStartSession(tree.id, tree.tree_type)} onClick={() => onStartSession(tree.id, tree.tree_type)}
className={cn( className={cn(
'rounded-md bg-primary px-3 py-1.5 text-xs font-medium text-white', 'rounded-md border border-primary/40 px-3 py-1.5 text-xs font-medium text-primary',
'hover:brightness-110 whitespace-nowrap' 'hover:bg-primary/10 hover:border-primary/60 transition-colors whitespace-nowrap'
)} )}
> >
Start Start

View File

@@ -132,7 +132,7 @@ export function BatchStatusCard({ session, targetLabel, treeId, batchId }: Batch
{isNotStarted && ( {isNotStarted && (
<button <button
onClick={handleStart} onClick={handleStart}
className="flex items-center gap-1.5 rounded-lg bg-primary px-3 py-1.5 text-[0.8125rem] font-medium text-white hover:brightness-110 transition-opacity" className="flex items-center gap-1.5 rounded-lg border border-primary/40 px-3 py-1.5 text-[0.8125rem] font-medium text-primary hover:bg-primary/10 hover:border-primary/60 transition-colors"
> >
<Play className="h-3.5 w-3.5" /> <Play className="h-3.5 w-3.5" />
Start Start

View File

@@ -188,7 +188,7 @@ export function StepCard({ step, onPreview, onInsert, onEdit, onDelete, onSave,
</button> </button>
<button <button
onClick={() => onSave?.(step)} onClick={() => onSave?.(step)}
className="flex flex-1 items-center justify-center gap-2 rounded-md bg-primary text-white px-3 py-2 text-sm font-medium hover:brightness-110 transition-colors" className="flex flex-1 items-center justify-center gap-2 rounded-md border border-primary/40 text-primary px-3 py-2 text-sm font-medium hover:bg-primary/10 hover:border-primary/60 transition-colors"
> >
<Bookmark className="h-4 w-4" /> <Bookmark className="h-4 w-4" />
Save Save
@@ -207,7 +207,7 @@ export function StepCard({ step, onPreview, onInsert, onEdit, onDelete, onSave,
</button> </button>
<button <button
onClick={() => onInsert?.(step)} onClick={() => onInsert?.(step)}
className="flex flex-1 items-center justify-center gap-2 rounded-md bg-primary text-white px-3 py-2 text-sm font-medium hover:brightness-110 transition-colors" className="flex flex-1 items-center justify-center gap-2 rounded-md border border-primary/40 text-primary px-3 py-2 text-sm font-medium hover:bg-primary/10 hover:border-primary/60 transition-colors"
> >
<Plus className="h-4 w-4" /> <Plus className="h-4 w-4" />
Insert Insert