Files
photog/templates/photo.html
T

56 lines
2.1 KiB
HTML
Raw Normal View History

2026-07-02 00:53:17 +02:00
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>{{.Photo.Caption}}</title>
<link rel="stylesheet" href="{{.FontsURL}}">
2026-07-02 00:53:17 +02:00
<link rel="stylesheet" href="/static/style.css">
<style>:root { --serif: '{{.SerifFamily}}', Georgia, serif; --mj: '{{.MlFamily}}', sans-serif; }</style>
2026-07-02 00:53:17 +02:00
<link rel="alternate" type="application/atom+xml" href="/feed.xml" title="Photo Feed">
{{if .Newer}}<link rel="prefetch" href="/photo/{{.Newer.Slug}}/">{{end}}
{{if .Older}}<link rel="prefetch" href="/photo/{{.Older.Slug}}/">{{end}}
2026-07-02 00:53:17 +02:00
</head>
<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}}
</nav>
2026-07-02 00:53:17 +02:00
<div class="dlayout">
<div class="dimg-wrap">
<a href="/{{.Photo.File}}" target="_blank" rel="noopener">
<img src="/{{.Photo.Medium}}" alt="{{.Photo.Caption}}">
</a>
2026-07-02 00:53:17 +02:00
</div>
<div class="dsidebar">
<div class="dauthor">
<div class="mini-avatar"><span>{{.Initial}}</span></div>
<span class="dauthor-name">{{.Author}}</span>
2026-07-02 00:53:17 +02:00
</div>
<p class="dcaption">{{.Photo.Caption}}</p>
<p class="ddate">{{.Photo.Date.Format "Jan 02, 2006"}}</p>
<p class="dfull"><a href="/{{.Photo.File}}" download>↓ Full size</a></p>
2026-07-02 00:53:17 +02:00
</div>
</div>
</div>
<footer class="site-footer">
© 2000{{.Year}} {{.Author}}. All rights reserved.
</footer>
<script>
(function () {
const newer = document.querySelector('[data-nav="newer"]');
const older = document.querySelector('[data-nav="older"]');
document.addEventListener('keydown', (e) => {
if (e.target.matches('input, textarea')) return;
if (e.key === 'ArrowLeft' && newer) location.href = newer.href;
if (e.key === 'ArrowRight' && older) location.href = older.href;
});
})();
</script>
2026-07-02 00:53:17 +02:00
</body>
</html>