foxandClaude Fable 5.1
ab0bd5b65a
/manage/delete/{slug} asks for confirmation, 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.
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>
|