diff --git a/generator.go b/generator.go index 42c09aa..f347a97 100644 --- a/generator.go +++ b/generator.go @@ -108,8 +108,15 @@ func (g *Generator) Build() error { if err := g.renderIndexPages(photos); err != nil { return err } - for _, p := range photos { - if err := g.renderPhotoPage(p); err != nil { + for i := range photos { + var newer, older *Photo + if i > 0 { + newer = &photos[i-1] + } + if i+1 < len(photos) { + older = &photos[i+1] + } + if err := g.renderPhotoPage(photos[i], newer, older); err != nil { return err } } @@ -358,13 +365,15 @@ func (g *Generator) renderIndexPages(photos []Photo) error { } // renderPhotoPage writes public/photo//index.html. -func (g *Generator) renderPhotoPage(p Photo) error { +func (g *Generator) renderPhotoPage(p Photo, newer, older *Photo) error { dir := filepath.Join(g.outputDir, "photo", p.Slug) if err := os.MkdirAll(dir, 0755); err != nil { return err } return g.render("photo.html", filepath.Join(dir, "index.html"), map[string]any{ "Photo": p, + "Newer": newer, + "Older": older, "BaseURL": g.baseURL, "Year": time.Now().Year(), "Author": g.author, diff --git a/static/style.css b/static/style.css index e0a91a3..b416670 100644 --- a/static/style.css +++ b/static/style.css @@ -195,17 +195,34 @@ body { padding: 16px 20px; } -.back-btn { - display: inline-block; - font-size: 15px; - color: var(--fg3); - text-decoration: none; +.photo-nav { + display: flex; + justify-content: space-between; + align-items: center; padding: 8px 0; margin-bottom: 16px; - font-family: var(--serif); + font-family: monospace; + font-size: 13px; + letter-spacing: 0.04em; } -.back-btn:hover { +.photo-nav a { + color: var(--aqua); + 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); } diff --git a/templates/photo.html b/templates/photo.html index 1acd76c..4310ad9 100644 --- a/templates/photo.html +++ b/templates/photo.html @@ -8,10 +8,16 @@ + {{if .Newer}}{{end}} + {{if .Older}}{{end}}
- ← Back +