fix(tasks): keep the task detail header tidy on phones
The origin badge overlapped the watch button; on phones it is left out of the header (the details stand at the bottom), as is the squeezed title. The watch button gets the height of its neighbours. Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This commit is contained in:
1 parent
e60e825b3c
commit
bd58b37156
1 file changed
+7
-3
@@ -236,7 +236,8 @@ const TaskDetailModalContent: React.FC<TaskDetailModalProps & { task: Thought }>
|
|||||||
>
|
>
|
||||||
<Check className="w-3.5 h-3.5 stroke-[3]" />
|
<Check className="w-3.5 h-3.5 stroke-[3]" />
|
||||||
</button>
|
</button>
|
||||||
<span className="text-xs font-semibold text-main truncate">
|
{/* Phones: squeezed to a single letter next to the buttons, so left out */}
|
||||||
|
<span className="hidden sm:inline text-xs font-semibold text-main truncate">
|
||||||
{readOnly ? 'Aufgabe ansehen' : task.isCompleted ? 'Erledigte Aufgabe' : 'Aufgabe bearbeiten'}
|
{readOnly ? 'Aufgabe ansehen' : task.isCompleted ? 'Erledigte Aufgabe' : 'Aufgabe bearbeiten'}
|
||||||
</span>
|
</span>
|
||||||
{readOnly && (
|
{readOnly && (
|
||||||
@@ -245,7 +246,10 @@ const TaskDetailModalContent: React.FC<TaskDetailModalProps & { task: Thought }>
|
|||||||
<span>Nur Lesen</span>
|
<span>Nur Lesen</span>
|
||||||
</span>
|
</span>
|
||||||
)}
|
)}
|
||||||
<OriginBadge origin={task.origin} createdAt={task.createdAt} />
|
{/* Phones: no room next to the buttons; the details stand at the bottom anyway */}
|
||||||
|
<span className="hidden sm:inline-flex min-w-0">
|
||||||
|
<OriginBadge origin={task.origin} createdAt={task.createdAt} />
|
||||||
|
</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div className="flex items-center gap-1.5">
|
<div className="flex items-center gap-1.5">
|
||||||
@@ -254,7 +258,7 @@ const TaskDetailModalContent: React.FC<TaskDetailModalProps & { task: Thought }>
|
|||||||
onClick={handleToggleWatch}
|
onClick={handleToggleWatch}
|
||||||
disabled={watchBusy}
|
disabled={watchBusy}
|
||||||
title={isWatching ? 'Nicht mehr beobachten' : 'Beobachten'}
|
title={isWatching ? 'Nicht mehr beobachten' : 'Beobachten'}
|
||||||
className={`btn-action min-h-[44px] sm:min-h-0 h-11 sm:h-7 px-2.5 sm:px-2 text-xs flex items-center gap-1.5 ${
|
className={`btn-action min-h-[38px] sm:min-h-0 h-9 sm:h-7 px-2.5 sm:px-2 text-xs flex items-center gap-1.5 ${
|
||||||
isWatching ? 'border-accent text-accent' : ''
|
isWatching ? 'border-accent text-accent' : ''
|
||||||
}`}
|
}`}
|
||||||
>
|
>
|
||||||
|
|||||||
Reference in new issue
Block a user