Commit e053e1cf74
e053e1cf740c85c24fefb0837d9a838bfa2cfe22
parent: 353f68a2e5
Verified · cmc ci/build: success ci/test: success
cmc <hello@cleberg.net> · 2026-09-18 06:42 UTC
web: the phone strip keeps one scrolling row above the pinned row
Ref #220
internal/web/static/style.css
+4 −3
| @@ -271,6 +271,7 @@ a.brand svg.mark { display: block; flex: none; } |
| 271 | 271 | a.brand span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } |
| 272 | 272 | |
| 273 | 273 | .railbody { flex: 1; overflow-y: auto; padding: 0 var(--sp-3); } |
| 274 | .railtop { display: block; } |
| 274 | 275 | /* search is reachable from every page, so it sits above the rail's links |
| 275 | 276 | rather than on one page of its own */ |
| 276 | 277 | form.railsearch { margin-bottom: var(--sp-3); } |
| @@ -1467,7 +1468,9 @@ svg.icon { vertical-align: -0.125em; } |
| 1467 | 1468 | overflow-x: auto; |
| 1468 | 1469 | } |
| 1469 | 1470 | a.brand { padding: var(--sp-2) var(--sp-3); } |
| 1470 | | .railbody { flex: 1; overflow: visible; padding: 0; display: flex; align-items: center; flex-wrap: wrap; } |
| 1471 | .railbody { flex: 1; overflow: visible; padding: 0; display: flex; flex-direction: column; } |
| 1472 | .railtop { display: flex; align-items: center; gap: var(--sp-2); overflow-x: auto; } |
| 1473 | .railtop > * { flex-shrink: 0; } |
| 1471 | 1474 | form.railsearch { margin: 0 var(--sp-2); } |
| 1472 | 1475 | form.railsearch input[type="search"] { min-width: 8rem; } |
| 1473 | 1476 | /* the strip hides the review queue, reachable from the dashboard, and |
| @@ -1475,8 +1478,6 @@ svg.icon { vertical-align: -0.125em; } |
| 1475 | 1478 | .railgroup { display: none; } |
| 1476 | 1479 | .railgroup.pinned { |
| 1477 | 1480 | display: block; |
| 1478 | | width: 100%; |
| 1479 | | order: 9; |
| 1480 | 1481 | border-top: 1px solid var(--shell-line); |
| 1481 | 1482 | padding: 0 var(--sp-2); |
| 1482 | 1483 | } |
internal/web/templates/layout.html
+2
| @@ -16,6 +16,7 @@ |
| 16 | 16 | <nav class="rail" aria-label="Site"> |
| 17 | 17 | <a class="brand" href="/">{{template "mark"}}<span>{{.Site}}</span></a> |
| 18 | 18 | <div class="railbody"> |
| 19 | <div class="railtop"> |
| 19 | 20 | <form method="get" action="/search" class="railsearch" role="search"> |
| 20 | 21 | <input type="search" name="q" aria-label="Search {{.Site}}" placeholder="Search"> |
| 21 | 22 | </form> |
| @@ -26,6 +27,7 @@ |
| 26 | 27 | <li><a {{if eq (str . "Tab") "bookmarks"}}aria-current="page" {{end}}href="/bookmarks">Bookmarks</a></li> |
| 27 | 28 | <li><a href="/new">New repository</a></li>{{end}} |
| 28 | 29 | </ul> |
| 30 | </div> |
| 29 | 31 | {{with .Rail.Pinned}} |
| 30 | 32 | <div class="railgroup pinned"> |
| 31 | 33 | <p class="raillabel" id="rail-pinned">Pinned</p> |