foxandClaude Fable 5.1
3f719359de
/manage lists every photo; /manage/edit/{slug} rewrites the photo's
.toml sidecar (caption, date), /manage/delete/{slug} asks for
confirmation and then removes the image, its sidecar and everything
generated from them. Builds now drop day pages of days without photos
and pager pages past the last one, so a delete or a date change leaves
nothing behind.
The pages are off by default: the routes are only registered with
-manage, so an install that does not opt in has no such code path and
answers 404. NixOS gets services.photogallery.manage.enable, which
also adds the nginx location only when on. Like /upload, the pages
carry no auth of their own and are not linked from the public site.
Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com>
118 lines
3.1 KiB
HTML
118 lines
3.1 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<meta name="robots" content="noindex">
|
|
<title>Manage — Photo Gallery</title>
|
|
<link rel="stylesheet" href="{{.FontsURL}}">
|
|
<link rel="stylesheet" href="/static/style.css">
|
|
<style>
|
|
:root { --serif: '{{.SerifFamily}}', Georgia, serif; --mj: '{{.MlFamily}}', sans-serif; }
|
|
.manage-page {
|
|
max-width: 720px;
|
|
margin: 0 auto;
|
|
padding: 32px 20px;
|
|
}
|
|
.manage-page .back-btn {
|
|
color: var(--fg3);
|
|
text-decoration: none;
|
|
font-size: 15px;
|
|
}
|
|
.manage-page .back-btn:hover { color: var(--fg); }
|
|
.manage-page h2 {
|
|
font-family: var(--serif);
|
|
font-size: 22px;
|
|
font-weight: 600;
|
|
color: var(--fg);
|
|
margin: 16px 0 6px;
|
|
}
|
|
.manage-count {
|
|
font-size: 12px;
|
|
color: var(--fg4);
|
|
font-family: monospace;
|
|
letter-spacing: 0.04em;
|
|
margin-bottom: 24px;
|
|
}
|
|
.saved {
|
|
margin-bottom: 20px;
|
|
font-size: 13px;
|
|
font-family: monospace;
|
|
padding: 10px 12px;
|
|
background: #1d2e1d;
|
|
color: #b8bb26;
|
|
border: 1px solid #344d28;
|
|
}
|
|
.mlist { list-style: none; }
|
|
.mrow {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 16px;
|
|
padding: 12px 0;
|
|
border-top: 1px solid var(--line);
|
|
}
|
|
.mrow img {
|
|
width: 72px;
|
|
height: 72px;
|
|
object-fit: cover;
|
|
background: var(--bg0);
|
|
flex: none;
|
|
}
|
|
.minfo { flex: 1; min-width: 0; }
|
|
.mcaption {
|
|
font-size: 17px;
|
|
color: var(--fg);
|
|
overflow-wrap: anywhere;
|
|
}
|
|
.mdate {
|
|
font-size: 12px;
|
|
color: var(--fg4);
|
|
font-family: monospace;
|
|
margin-top: 4px;
|
|
}
|
|
.mactions {
|
|
flex: none;
|
|
display: flex;
|
|
gap: 14px;
|
|
font-size: 15px;
|
|
}
|
|
.mactions a { color: var(--fg3); text-decoration: none; }
|
|
.mactions a:hover { color: var(--fg); }
|
|
.mactions .medit { color: var(--aqua); }
|
|
.mactions .mdelete { color: #fb4934; }
|
|
.mempty { color: var(--fg4); font-size: 15px; }
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div class="manage-page">
|
|
<a href="/" class="back-btn">← Gallery</a>
|
|
<h2>Manage photos</h2>
|
|
<p class="manage-count">{{len .Photos}} {{if eq (len .Photos) 1}}photo{{else}}photos{{end}}</p>
|
|
|
|
{{if .Saved}}<p class="saved">✓ saved “{{.Saved}}”</p>{{end}}
|
|
{{if .Deleted}}<p class="saved">✓ deleted “{{.Deleted}}”</p>{{end}}
|
|
|
|
{{if .Photos}}
|
|
<ul class="mlist">
|
|
{{range .Photos}}
|
|
<li class="mrow">
|
|
<img src="/{{.Thumb}}" alt="" loading="lazy">
|
|
<div class="minfo">
|
|
<p class="mcaption">{{.Caption}}</p>
|
|
<p class="mdate">{{.Date.Format "2006-01-02"}}</p>
|
|
</div>
|
|
<div class="mactions">
|
|
<a href="/photo/{{.Slug}}/">View</a>
|
|
<a href="/manage/edit/{{.Slug}}" class="medit">Edit</a>
|
|
<a href="/manage/delete/{{.Slug}}" class="mdelete">Delete</a>
|
|
</div>
|
|
</li>
|
|
{{end}}
|
|
</ul>
|
|
{{else}}
|
|
<p class="mempty">No photos yet.</p>
|
|
{{end}}
|
|
</div>
|
|
</body>
|
|
</html>
|