puttaalu/photog
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Split the photo nav so Back sits alone on the left

Browse Source 
Move the Newer and Older links to a right-aligned group joined by a
slash so they stop crowding the Back link, and drop the aqua accent so
every link in the row shares the muted serif tone.
This commit is contained in:
puttaalu
2026-07-03 23:11:11 +02:00
parent 3639bd5577
commit 70d115e11c
2 changed files with 13 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files
static/style.css
+8 -16
View File
@@ -198,34 +198,26 @@ body {
.photo-nav {
display: flex;
justify-content: space-between;
align-items: center;
align-items: baseline;
padding: 8px 0;
margin-bottom: 16px;
font-family: monospace;
font-size: 13px;
letter-spacing: 0.04em;
font-family: var(--serif);
font-size: 15px;
}
.photo-nav a {
color: var(--aqua);
color: var(--fg3);
text-decoration: none;
}
.photo-nav a:hover {
color: var(--fg2);
}
.photo-nav .back-btn {
font-family: var(--serif);
font-size: 15px;
color: var(--fg3);
letter-spacing: 0;
}
.photo-nav .back-btn:hover {
color: var(--fg);
}
.photo-nav-neighbours {
color: var(--fg3);
}
.dlayout {
display: flex;
align-items: stretch;
templates/photo.html
+5 -2
View File
@@ -14,9 +14,12 @@
<body>
<div class="photo-page">
<nav class="photo-nav">
{{if .Newer}}<a href="/photo/{{.Newer.Slug}}/" data-nav="newer">← Newer</a>{{else}}<span></span>{{end}}
<a href="/" class="back-btn">← Back</a>
{{if .Older}}<a href="/photo/{{.Older.Slug}}/" data-nav="older">Older →</a>{{else}}<span></span>{{end}}
<span class="photo-nav-neighbours">
{{if .Newer}}<a href="/photo/{{.Newer.Slug}}/" data-nav="newer">← Newer</a>{{end}}
{{if and .Newer .Older}} / {{end}}
{{if .Older}}<a href="/photo/{{.Older.Slug}}/" data-nav="older">Older →</a>{{end}}
</span>
</nav>
<div class="dlayout">
<div class="dimg-wrap">