From ff0a15b94e8b4c4f5f27f69bf2b5a3584cc0d866 Mon Sep 17 00:00:00 2001
From: Raffael Sheikh <raffaelsheikh@MacBook-Pro-von-Raffael.local>
Date: Sun, 7 Jun 2026 11:50:54 +0200
Subject: [PATCH] UI: Touch-Sichtbarkeit der Hover-Aktionen

Edit/Delete/Start/Zeit-Buttons waren nur per group-hover sichtbar (opacity-0)
und damit auf Touch-Geraeten unerreichbar. Jetzt mobil dauerhaft sichtbar, ab
sm (Desktop) weiterhin Hover-Reveal.

- TimelineSection (Bearbeiten/Loeschen einer Zeit-Zeile)
- heute (Task starten/fortsetzen, Zeit nachtragen)
- reflexion (ToDo-Titel bearbeiten)

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
---
 apps/web/src/components/time/TimelineSection.tsx | 2 +-
 apps/web/src/routes/heute.tsx                    | 4 ++--
 apps/web/src/routes/reflexion.tsx                | 2 +-
 3 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/apps/web/src/components/time/TimelineSection.tsx b/apps/web/src/components/time/TimelineSection.tsx
index eeef946..7fc81a9 100644
--- a/apps/web/src/components/time/TimelineSection.tsx
+++ b/apps/web/src/components/time/TimelineSection.tsx
@@ -271,7 +271,7 @@ function TimelineRow({
         {formatDuration(duration)}
       </div>
       {!isRunning && (
-        <div className="flex shrink-0 gap-1 opacity-0 group-hover:opacity-100">
+        <div className="flex shrink-0 gap-1 opacity-100 sm:opacity-0 sm:group-hover:opacity-100">
           <button
             type="button"
             onClick={onEdit}
diff --git a/apps/web/src/routes/heute.tsx b/apps/web/src/routes/heute.tsx
index 3e6295f..2475f16 100644
--- a/apps/web/src/routes/heute.tsx
+++ b/apps/web/src/routes/heute.tsx
@@ -242,7 +242,7 @@ function TodoRow({
           className={
             isRunningHere
               ? 'inline-flex h-7 items-center gap-1 rounded-full bg-[var(--color-ampel-red-bg)] px-2 text-xs font-medium text-[var(--color-ampel-red-fg)]'
-              : 'inline-flex h-7 w-7 items-center justify-center rounded-full text-[var(--color-ink-muted)] opacity-0 hover:bg-black/5 hover:text-[var(--color-ink)] group-hover:opacity-100'
+              : 'inline-flex h-7 w-7 items-center justify-center rounded-full text-[var(--color-ink-muted)] opacity-100 hover:bg-black/5 hover:text-[var(--color-ink)] sm:opacity-0 sm:group-hover:opacity-100'
           }
         >
           {isRunningHere ? (
@@ -264,7 +264,7 @@ function TodoRow({
           onClick={() => setRetroOpen(true)}
           aria-label="Zeit nachtragen"
           title="Zeit nachtragen"
-          className="inline-flex h-7 w-7 items-center justify-center rounded-full text-[var(--color-ink-muted)] opacity-0 hover:bg-black/5 hover:text-[var(--color-ink)] group-hover:opacity-100"
+          className="inline-flex h-7 w-7 items-center justify-center rounded-full text-[var(--color-ink-muted)] opacity-100 hover:bg-black/5 hover:text-[var(--color-ink)] sm:opacity-0 sm:group-hover:opacity-100"
         >
           <Clock size={12} />
         </button>
diff --git a/apps/web/src/routes/reflexion.tsx b/apps/web/src/routes/reflexion.tsx
index c240b88..fd3a332 100644
--- a/apps/web/src/routes/reflexion.tsx
+++ b/apps/web/src/routes/reflexion.tsx
@@ -391,7 +391,7 @@ function EditableTodoTitle({ id, title }: { id: string; title: string }) {
       <span>{title}</span>
       <Pencil
         size={12}
-        className="text-[var(--color-ink-faint)] opacity-0 transition-opacity group-hover:opacity-100"
+        className="text-[var(--color-ink-faint)] opacity-100 transition-opacity sm:opacity-0 sm:group-hover:opacity-100"
       />
     </button>
   );