mirror of
https://github.com/Patiun/com.gregkilmer.www.git
synced 2026-11-08 04:08:24 +00:00
Admin: write blog posts and manage images
A Posts page lists every post with Write a post: title, topic, kind, date, summary, a cover picked from the vault or uploaded, the pages it is about, the Markdown body with a rendered preview, and Save draft or Publish. An Images page uploads several images into an _attachments folder, shows which notes use each one, copies its embed line, and deletes unused ones. The content service gains the attachment list, upload and delete endpoints behind the editor and admin tokens. Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_012aSbo2D1qP8cMFQCykf7kx
This commit is contained in:
@@ -77,3 +77,36 @@ dl.fields dt { color: var(--muted); }
|
||||
dl.fields dd { margin: 0; word-break: break-word; }
|
||||
dl.fields pre { margin: 0; white-space: pre-wrap; }
|
||||
input.num { width: 90px; }
|
||||
|
||||
/* Posts and Images */
|
||||
.head-row { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; justify-content: space-between; }
|
||||
.button.primary { background: var(--teal); border-color: var(--teal); color: var(--midnight); font-weight: 600; }
|
||||
.hint { margin: 4px 0 0; font-size: 13px; color: var(--muted); }
|
||||
.post-grid { display: grid; gap: 16px; grid-template-columns: minmax(0, 1fr) 320px; align-items: start; }
|
||||
@media (max-width: 900px) { .post-grid { grid-template-columns: 1fr; } }
|
||||
.side .panel h2 { margin-top: 0; font-size: 1.05rem; }
|
||||
.side input[name="links"] { margin-bottom: 8px; }
|
||||
.body-text { font-family: ui-monospace, monospace; font-size: 14px; line-height: 1.55; resize: vertical; min-height: 360px; }
|
||||
.actions.stack { flex-direction: column; align-items: stretch; }
|
||||
.actions.stack button { justify-content: center; }
|
||||
.cover-preview { display: block; width: 100%; max-height: 180px; object-fit: cover; border-radius: 8px; margin-bottom: 6px; }
|
||||
.cover-preview.wide { max-height: 320px; }
|
||||
.post-preview h1 { margin-top: 4px; }
|
||||
details summary { cursor: pointer; color: var(--muted); margin-top: 10px; }
|
||||
.copy-row { display: flex; gap: 6px; align-items: center; }
|
||||
.copy-row input { font-family: ui-monospace, monospace; font-size: 12px; padding: 4px 8px; }
|
||||
.copy-row button { min-height: 30px; padding: 2px 12px; font-size: 13px; }
|
||||
.thumbs { list-style: none; padding: 0; margin: 0; display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); }
|
||||
.thumbs img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 8px; border: 1px solid var(--line); display: block; margin-bottom: 6px; }
|
||||
.folders { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 16px; }
|
||||
.folders a { padding: 4px 14px; border: 1px solid var(--line); border-radius: 999px; color: var(--text); text-decoration: none; font-size: 14px; }
|
||||
.folders a[aria-current] { border-color: var(--gold); color: var(--gold-bright); }
|
||||
.images { list-style: none; padding: 0; margin: 0; display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
|
||||
.images li { margin: 0; display: flex; flex-direction: column; gap: 10px; }
|
||||
.images img, .images .file { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 8px; display: block; background: var(--sky); }
|
||||
.images .file { display: flex; align-items: center; justify-content: center; color: var(--muted); text-transform: uppercase; }
|
||||
.images .meta { display: flex; flex-direction: column; gap: 6px; font-size: 14px; word-break: break-all; }
|
||||
.images .used { font-size: 13px; }
|
||||
form.inline { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; font-size: 13px; }
|
||||
form.inline button { min-height: 30px; padding: 2px 12px; font-size: 13px; }
|
||||
.preview img { max-height: 480px; object-fit: contain; }
|
||||
|
||||
Reference in New Issue
Block a user