thejayman77/upbeatBytes
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Article page: add a Back button in the top bar

Browse Source 
The server-rendered /a/ summary page had no in-page way back — the only option
was the browser's back button, which feels unfinished. Add a "← Back" control on
the right of the top bar (desktop + mobile). It uses history.back() when the
reader came from within the site, and falls back to the home page for visitors
who arrived via a shared link (no useful history).

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
jay
2026-06-06 21:52:43 -04:00
parent c25e14ed6a
commit 67d6b82ed3
1 changed files with 15 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files
goodnews/share.py
+15 -2
View File
@@ -114,8 +114,13 @@ def render_share_page(article: dict, base_url: str, summary: str | None = None)
font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
line-height:1.6; }}
.bar {{ background:var(--surface); border-bottom:1px solid var(--line); }}
.bar .inner {{ max-width:680px; margin:0 auto; padding:12px 20px; }}
.bar .inner {{ max-width:680px; margin:0 auto; padding:12px 20px;
display:flex; align-items:center; justify-content:space-between; gap:12px; }}
.bar img {{ height:40px; display:block; }}
.back {{ background:none; border:1px solid var(--line); color:var(--accent-deep);
border-radius:999px; padding:7px 16px; font-size:.88rem; font-family:inherit;
cursor:pointer; line-height:1; white-space:nowrap; }}
.back:hover {{ border-color:var(--accent); }}
.wrap {{ max-width:680px; margin:0 auto; padding:24px 20px 60px; }}
.card {{ background:var(--surface); border:1px solid var(--line); border-radius:16px;
overflow:hidden; box-shadow:0 10px 30px rgba(40,38,28,.06); }}
@@ -143,7 +148,7 @@ def render_share_page(article: dict, base_url: str, summary: str | None = None)
</style>
</head>
<body>
<div class="bar"><div class="inner"><a href="/"><img src="/logo.svg" alt="Upbeat Bytes"></a></div></div>
<div class="bar"><div class="inner"><a href="/"><img src="/logo.svg" alt="Upbeat Bytes"></a><button class="back" type="button" data-back aria-label="Go back">← Back</button></div></div>
<main class="wrap">
<article class="card">
{media}
@@ -181,6 +186,14 @@ def render_share_page(article: dict, base_url: str, summary: str | None = None)
else if(navigator.clipboard){{ navigator.clipboard.writeText(url).then(function(){{ s.textContent='Copied!'; setTimeout(function(){{s.textContent='Copy link';}},1500); }}); }}
}});
}})();
</script>
<script>
(function(){{
var b=document.querySelector('[data-back]'); if(!b) return;
b.addEventListener('click',function(){{
if(document.referrer && history.length>1){{ history.back(); }} else {{ location.href='/'; }}
}});
}})();
</script>
{poll}
</body>