chat: merge caret + title into one back trigger
Caret and "chat" label were two hit targets with two hover states and
tooltips. Collapse them into a single <button id="chat-header-nav">
with one tooltip ("back to conversations") — the caret becomes a
visibility-only hint inside the button, shown when there's somewhere
to go back to, hidden on the list itself. The .navigable class
controls whether the button reads as interactive, so clicking the
label while already on the list is a cursor-default no-op.
Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
1 parent
d2f7b98e6c
commit
0022f64c50
6 files changed
+52
-20
No files matched your search
@@ -3,8 +3,14 @@
|
||||
<div id="chat-flyout" class="hidden">
|
||||
<div id="chat-flyout-header">
|
||||
<i class="ph ph-chats-circle text-t-accent text-sm"></i>
|
||||
<span id="chat-flyout-title" class="font-pixel text-[10px] text-t-bright cursor-pointer hover:text-t-accent transition-colors" title="back to conversations">chat</span>
|
||||
<button id="chat-header-back" class="hidden text-t-muted hover:text-t-accent transition-colors" data-tip="back to list"><i class="ph ph-caret-left text-sm"></i></button>
|
||||
<!-- Caret + "chat" label are a single trigger with one tooltip.
|
||||
The caret shows only when there's somewhere to go back to
|
||||
(thread / pick / room-info); on the list itself the click
|
||||
is a no-op and the button styles itself as inert. -->
|
||||
<button id="chat-header-nav" type="button" class="chat-header-nav" data-tip="back to conversations">
|
||||
<i id="chat-header-back-caret" class="ph ph-caret-left text-sm hidden"></i>
|
||||
<span id="chat-flyout-title" class="font-pixel text-[10px]">chat</span>
|
||||
</button>
|
||||
<span class="flex-1"></span>
|
||||
<button id="chat-thread-disposable" class="hidden text-t-muted hover:text-t-accent transition-colors" data-tip="disposable: messages drop after delivery"><i class="ph ph-fire text-sm"></i></button>
|
||||
<button id="chat-thread-info" class="hidden text-t-muted hover:text-t-accent transition-colors" data-tip="room info"><i class="ph ph-info text-sm"></i></button>
|
||||
|
||||
Reference in new issue
Block a user