From 2151b67836d209645b85bb64d56a96bfbf2859cd Mon Sep 17 00:00:00 2001 From: Ben Sima Date: Mon, 1 Dec 2025 15:41:19 -0500 Subject: Add autoscroll toggle button for timeline MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Adds a toggle button next to the LIVE indicator that controls whether the timeline auto-scrolls to new events. Default is ON. - renderAutoscrollToggle button with ⬇ icon - toggleAutoscroll() JS function tracks state - htmx:afterSettle checks autoscrollEnabled before scrolling - Blue styling to differentiate from green LIVE button Task-Id: t-222 --- Omni/Jr/Web/Style.hs | 17 +++++++++++++++++ 1 file changed, 17 insertions(+) (limited to 'Omni/Jr/Web') diff --git a/Omni/Jr/Web/Style.hs b/Omni/Jr/Web/Style.hs index cf32570..bbf828b 100644 --- a/Omni/Jr/Web/Style.hs +++ b/Omni/Jr/Web/Style.hs @@ -1597,6 +1597,23 @@ unifiedTimelineStyles = do backgroundColor "#f3f4f6" border (px 1) solid "#d1d5db" Stylesheet.key "animation" ("none" :: Text) + ".timeline-autoscroll-toggle" ? do + fontSize (px 10) + fontWeight bold + color "#3b82f6" + backgroundColor "#dbeafe" + padding (px 2) (px 6) (px 2) (px 6) + borderRadius (px 10) (px 10) (px 10) (px 10) + marginLeft (px 4) + border (px 1) solid "#93c5fd" + cursor pointer + Stylesheet.key "transition" ("all 0.2s ease" :: Text) + ".timeline-autoscroll-toggle:hover" ? do + Stylesheet.key "box-shadow" ("0 0 6px rgba(59,130,246,0.3)" :: Text) + ".timeline-autoscroll-toggle.timeline-autoscroll-disabled" ? do + color "#6b7280" + backgroundColor "#f3f4f6" + border (px 1) solid "#d1d5db" ".timeline-live" ? do fontSize (px 10) fontWeight bold -- cgit v1.2.3