From c10998ccf2976ee72b408ee8d8843420222ea100 Mon Sep 17 00:00:00 2001 From: Adam Soltys Date: Mon, 28 Sep 2026 09:41:03 -0700 Subject: The new-posts pill sits at the bottom; the sound button leaves once the sound is on; the list action moves under the profile row. MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit The pill was at the top of the window, a stretch for a thumb. An unmuted video kept a Mute button the player's own controls already provide, and in a quoted note the box could be rebuilt muted; unmuting now pins the box and removes the button. The ☰ on the profile's action row wrapped onto a line of its own; it is now "Add to a list" beside "Their timeline". Co-Authored-By: Claude Fable 5.1 Claude-Session: https://claude.ai/code/session_01VhUKyXKtsJ67QAFfb7QR9D --- src/style.css | 9 ++++----- 1 file changed, 4 insertions(+), 5 deletions(-) (limited to 'src/style.css') diff --git a/src/style.css b/src/style.css index 66d3a82..2facddc 100644 --- a/src/style.css +++ b/src/style.css @@ -766,10 +766,9 @@ html.no-scroll { overflow: hidden; scrollbar-gutter: auto; } when tapped. Fixed, not sticky: the feed is the page scroller, and a sticky element inside the card would scroll away with the card. */ .feed-new-pill { - /* The header scrolls away with the page, so this rides at the very top of - the window — floating over a post for the moment it is there beats - sitting in the middle of one. */ - position: fixed; top: calc(env(safe-area-inset-top, 0px) + 10px); + /* Rides at the bottom of the window, where a thumb already is; the tap + takes the reader up to the new posts. */ + position: fixed; bottom: calc(env(safe-area-inset-bottom, 0px) + 18px); left: 50%; transform: translateX(-50%); z-index: 30; width: auto; padding: 7px 16px; border-radius: 999px; background: var(--accent); color: var(--accent-fg); border: none; @@ -789,7 +788,7 @@ html.no-scroll { overflow: hidden; scrollbar-gutter: auto; } to { transform: scale(1); opacity: 1; } } @keyframes pill-in { - from { opacity: 0; transform: translate(-50%, -8px); } + from { opacity: 0; transform: translate(-50%, 8px); } to { opacity: 1; transform: translate(-50%, 0); } } -- cgit v1.2.3