web: restore text selection on desktop (only suppress it on touch)
Hold-to-react disabled text selection everywhere; on desktop, drag-to-select and a stationary hold-to-react don't conflict, so scope the selection/callout suppression to (pointer: coarse) — desktop can select/copy message text again.
Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
1 file changed,
+9
−5
web/static/style.css+9 −5
diff --git a/web/static/style.css b/web/static/style.css| index 289eabf..58004a8 100644 |
| --- a/web/static/style.css |
| +++ b/web/static/style.css |
| @@ -336,11 +336,15 @@ input:focus, textarea:focus { outline: 2px solid var(--accent); border-color: tr |
| /* reactions */ |
| .bubble-row { display: flex; align-items: center; gap: 6px; max-width: 100%; min-width: 0; } |
| .msg.me .bubble-row { flex-direction: row-reverse; } |
| -/* press-and-hold to react: suppress the iOS text-selection callout on messages */ |
| -.bubble-row { |
| - -webkit-touch-callout: none; |
| - -webkit-user-select: none; |
| - user-select: none; |
| +/* Desktop keeps normal text selection: drag-to-select cancels the hold-to-react |
| + timer, so the two don't clash. On touch, long-press IS the react gesture, so |
| + there we suppress the native selection/callout that would fight it. */ |
| +@media (pointer: coarse) { |
| + .bubble-row { |
| + -webkit-touch-callout: none; |
| + -webkit-user-select: none; |
| + user-select: none; |
| + } |
| } |
| .reactions { display: flex; flex-wrap: wrap; gap: 4px; margin: 3px 2px 0; } |
| .msg.me .reactions { justify-content: flex-end; } |