From dc8f4b841ff57f4ef74597c2f80b6f90b352db13 Mon Sep 17 00:00:00 2001 From: Adam Soltys Date: Mon, 3 Aug 2026 21:04:09 -0700 Subject: Messages in the header, and a room you can tell is alive MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The header carries a message button again, left of the wallet selector, with a red dot when a conversation is waiting. Unread is a per-thread watermark on the newest message from someone else, kept in the rumor's own created_at so it means the same thing on every device it syncs to. Rooms subscribe at startup now, or the dot could not speak for a community nobody was listening to. Communities no longer buzz a phone by default: push registration only carries the stream keys of communities you have opted in, per community, from a bell in the room header. DMs and payments are unchanged. Presence and typing ride the channel stream as 21059 wraps, so who is around stays inside the community's encryption rather than becoming a public status. Measured against relay.coinos.io and nos.lol, neither actually drops NIP-01 ephemeral kinds, so beats carry a NIP-40 expiration and relay.coinos.io sweeps kind 21059 hourly — and presence is dated by the beat, never by arrival, or a replayed beat would light up the whole member list. The member list follows Telegram: online, then last seen in minutes and hours, then a vague 'recently' rather than advertising how long someone has been gone. Co-Authored-By: Claude Opus 5 Claude-Session: https://claude.ai/code/session_01Wvj4aoeMZwA7VUGdJP9Swi --- src/style.css | 26 ++++++++++++++++++++++++++ 1 file changed, 26 insertions(+) (limited to 'src/style.css') diff --git a/src/style.css b/src/style.css index 7c3113e..b90be07 100644 --- a/src/style.css +++ b/src/style.css @@ -395,6 +395,32 @@ hr.divider { margin: 16px 0; } .chat-avatar.fallback { position: relative; overflow: hidden; } .chat-avatar.fallback .punk { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; } .header-avatar { padding: 0; border: none; background: none; cursor: pointer; display: flex; } +.chat-typing { display: flex; align-items: center; gap: 7px; padding: 2px 4px 6px; min-height: 20px; } +.typing-dots { display: inline-flex; gap: 3px; align-items: center; } +.typing-dots i { width: 4px; height: 4px; border-radius: 50%; background: var(--muted); animation: typing-bounce 1.2s infinite ease-in-out; } +.typing-dots i:nth-child(2) { animation-delay: .15s; } +.typing-dots i:nth-child(3) { animation-delay: .3s; } +@keyframes typing-bounce { 0%, 60%, 100% { opacity: .3; transform: translateY(0); } 30% { opacity: 1; transform: translateY(-3px); } } +.chat-members { max-height: 260px; overflow-y: auto; border-bottom: 1px solid var(--line); } +.ava-wrap { position: relative; display: inline-flex; flex-shrink: 0; } +.ava-wrap.online::after { + content: ''; position: absolute; right: -1px; bottom: -1px; width: 10px; height: 10px; + border-radius: 50%; background: #3fbf5f; box-shadow: 0 0 0 2px var(--paper); +} +.small.is-online { color: #3fbf5f; } +.online-count { color: #3fbf5f; } +.iconbtn.bell.on { color: var(--ink); } +.header-msgs { position: relative; padding: 4px; border: none; background: none; cursor: pointer; display: flex; color: var(--muted); } +.header-msgs:hover { color: var(--ink); } +.header-msgs .hm-ico { display: flex; transition: transform .15s ease; } +.header-msgs:hover .hm-ico { transform: scale(1.08); } +.header-msgs.unread { color: var(--ink); } +.header-msgs.unread::after { + content: ''; position: absolute; top: 2px; right: 2px; width: 9px; height: 9px; + border-radius: 50%; background: var(--red); + box-shadow: 0 0 0 2px var(--bg); animation: dot-pop .3s ease-out; +} +@keyframes dot-pop { from { transform: scale(0); } to { transform: scale(1); } } .chat-avatar.header-ava { width: 30px; height: 30px; font-size: 11px; } .npub-box { display: flex; align-items: center; gap: 8px; } .copy-ico { flex-shrink: 0; background: none; border: none; padding: 2px; color: var(--muted); cursor: pointer; display: flex; } -- cgit v1.2.3