From 74a542675545be1966505c7c8d2b8dc11f4f1519 Mon Sep 17 00:00:00 2001 From: agent-company Date: Fri, 27 Mar 2026 02:07:01 +0000 Subject: [PATCH] feat: add pull-to-refresh button to top bar for all list views Add a sticky top bar with a refresh button that uses HTMX to re-fetch the current view content without a full page reload. Works on dashboard, issues, and pulls views via the shared layout template. Closes leeworks-agents/gitea-mobile#51 Co-Authored-By: Claude Opus 4.6 (1M context) --- internal/handlers/handlers.go | 4 +++ internal/templates/layout.html | 4 +++ static/style.css | 45 +++++++++++++++++++++++++++++++++- 3 files changed, 52 insertions(+), 1 deletion(-) diff --git a/internal/handlers/handlers.go b/internal/handlers/handlers.go index b592438..364df0f 100644 --- a/internal/handlers/handlers.go +++ b/internal/handlers/handlers.go @@ -115,6 +115,10 @@ var basePage = template.Must(template.New("base").Parse(` +
+ Gitea Mobile + +
{{.Content}}
diff --git a/internal/templates/layout.html b/internal/templates/layout.html index a951bd0..b7a1c00 100644 --- a/internal/templates/layout.html +++ b/internal/templates/layout.html @@ -13,6 +13,10 @@ +
+ Gitea Mobile + +
{{template "content" .}}
diff --git a/static/style.css b/static/style.css index e867918..d4bea3d 100644 --- a/static/style.css +++ b/static/style.css @@ -47,10 +47,53 @@ body { -moz-osx-font-smoothing: grayscale; } +/* Top bar */ +.top-bar { + position: sticky; + top: 0; + z-index: 100; + display: flex; + align-items: center; + justify-content: space-between; + padding: var(--spacing-sm) var(--spacing-lg); + padding-top: max(var(--spacing-sm), env(safe-area-inset-top)); + background: var(--bg-secondary); + border-bottom: 1px solid var(--border); +} + +.top-bar-title { + font-size: var(--font-base); + font-weight: 600; + color: var(--text-primary); +} + +.refresh-btn { + background: none; + border: none; + color: var(--text-secondary); + font-size: 1.4rem; + padding: var(--spacing-xs) var(--spacing-sm); + cursor: pointer; + -webkit-tap-highlight-color: transparent; + line-height: 1; + border-radius: var(--radius-sm); + transition: color 0.15s ease, background 0.15s ease; +} + +.refresh-btn:active { + color: var(--accent-blue); + background: var(--bg-tertiary); +} + +.refresh-btn.htmx-request { + animation: spin 0.6s linear infinite; + pointer-events: none; +} + /* Content area */ .content { padding: var(--spacing-lg); - padding-top: max(var(--spacing-lg), env(safe-area-inset-top)); + padding-top: var(--spacing-lg); max-width: 640px; margin: 0 auto; }