635372d7a2
Decap looks like a different product because it cannot be made to look like this one: its maintainer's answer is override the CSS and accept that class names move between releases, or fork it and carry that forever. Neither is worth building on, so editing moves into the app that already has the site's design and this project's tests. Posts are files in git, so the editor is a form that commits a file through Gitea's contents API. No working copy, no queue, no new state, and no way for the pipeline to tell which editor wrote the file — which is what makes running both at once safe. Decap keeps working; nothing here removes it, and the fallback if something is missing is switching tabs. Filenames and frontmatter are not this module's to invent. They are the contract scripts/translate.py reads: `<basename>.es.md` is what split_lang() parses, the date prefix is what keeps two posts with one title off a single URL, and the absence of `translated_from` is what marks a file as something a person wrote. Several tests import translate.py and run its own parser over what the editor produced, because a file it cannot parse publishes in Spanish and is never translated, with nothing reported anywhere. Commits carry the writer's own Gitea account rather than a bot's, so history says who wrote each post and Gitea's permissions apply unchanged. That needs their access token, which lives in the database and never in a cookie: Flask signs cookies but does not encrypt them, and a token is enough to commit as its owner. Gitea expires tokens after about an hour, so they refresh ahead of expiry and retry once on rejection — without that, saving would start failing partway through an afternoon for no reason the writer could see. Publishing is admin-only. Posting to the internal board and publishing to the public site are different permissions, and the second is the larger grant. Listing caches frontmatter against the git blob sha, because the contents API returns names without bodies: that turns one request per post on every page load into one request in total, and needs no invalidation, since a sha changes only when the file does. Verified: 97 checks. The filename translate.py parses, an authored source that is_generated() rejects, the freeze toggle round-tripping, a stale sha refused with the other edit intact, six filename shapes that must 404 including a generated sibling, plain members refused, an SVG rejected as an image, uploads not colliding, the cache reading each file once and refreshing when it changes, and a preview that renders markdown, escapes script tags and publishes nothing. Smoke-tested live: routes register and gate correctly. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01NizVpJ2dwzCbjCrTLCjeHn
309 lines
8.2 KiB
CSS
309 lines
8.2 KiB
CSS
/* =========================================================
|
|
Members area — stylesheet.
|
|
|
|
The :root block below is copied from
|
|
themes/vienalatina/assets/css/main.css, which already duplicates it for the
|
|
same reason: each stylesheet stands on its own. The two files are served by
|
|
different things — Hugo fingerprints one, Flask serves the other — so
|
|
sharing a file would couple the app's deploy to the site's build for no gain.
|
|
If the brand colours change, change them in both.
|
|
========================================================= */
|
|
|
|
:root {
|
|
color-scheme: light;
|
|
|
|
--brand: #c0391c;
|
|
--brand-dark: #9a2a0f;
|
|
--brand-soft: #fbe2db;
|
|
--brand-softer: #fdf1ed;
|
|
|
|
--bg: #f8f3ef;
|
|
--surface: #ffffff;
|
|
--surface-soft: #f2ebe6;
|
|
--border: #c2a89f;
|
|
--border-light: #e0cec8;
|
|
|
|
--text: #1a0d09;
|
|
--muted: #5c3d37;
|
|
--subtle: #9a7870;
|
|
|
|
--danger: #a11b1b;
|
|
|
|
--shadow: 0 2px 16px rgba(60, 20, 10, 0.09);
|
|
--shadow-sm: 0 1px 6px rgba(60, 20, 10, 0.06);
|
|
--radius-xl: 18px;
|
|
--radius-lg: 12px;
|
|
--radius-md: 8px;
|
|
--radius-sm: 5px;
|
|
}
|
|
|
|
* { box-sizing: border-box; }
|
|
|
|
body {
|
|
margin: 0;
|
|
min-height: 100vh;
|
|
font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
|
|
"Helvetica Neue", Arial, sans-serif;
|
|
color: var(--text);
|
|
background: var(--bg);
|
|
-webkit-font-smoothing: antialiased;
|
|
}
|
|
|
|
h1, h2, h3 { font-weight: 700; letter-spacing: -0.01em; }
|
|
a { color: var(--brand-dark); }
|
|
button, input, select, textarea { font: inherit; }
|
|
|
|
/* --- chrome ---------------------------------------------------------- */
|
|
|
|
.site-bar {
|
|
background: var(--surface);
|
|
border-bottom: 1px solid var(--border-light);
|
|
}
|
|
|
|
.site-bar__inner {
|
|
max-width: 860px;
|
|
margin: 0 auto;
|
|
padding: 1rem 16px;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
gap: 1rem;
|
|
}
|
|
|
|
.site-bar__brand { text-decoration: none; }
|
|
.site-bar__brand-text { color: var(--brand); font-weight: 700; font-size: 1.25rem; }
|
|
|
|
.site-bar__account { display: flex; align-items: center; gap: 0.75rem; }
|
|
.site-bar__account form { margin: 0; }
|
|
.who { color: var(--muted); font-size: 0.9rem; }
|
|
|
|
.site-bar__pages { border-top: 1px solid var(--border-light); background: var(--surface); }
|
|
.page-nav {
|
|
max-width: 860px;
|
|
margin: 0 auto;
|
|
padding: 0.6rem 16px;
|
|
list-style: none;
|
|
display: flex;
|
|
gap: 1.5rem;
|
|
}
|
|
.page-nav a { color: var(--muted); text-decoration: none; }
|
|
.page-nav a:hover { color: var(--brand); }
|
|
|
|
.page-shell { max-width: 860px; margin: 0 auto; padding: 2rem 16px 4rem; }
|
|
|
|
.site-foot {
|
|
margin-top: 3rem;
|
|
padding-top: 1.5rem;
|
|
border-top: 1px solid var(--border-light);
|
|
text-align: center;
|
|
font-size: 0.9rem;
|
|
color: var(--subtle);
|
|
}
|
|
.site-foot a { color: var(--subtle); }
|
|
.site-foot__legal { margin-top: 0.5rem; }
|
|
|
|
/* --- cards ----------------------------------------------------------- */
|
|
|
|
.feed-head {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
gap: 1rem;
|
|
margin-bottom: 1.5rem;
|
|
}
|
|
.feed-head h1 { margin: 0; }
|
|
|
|
.card {
|
|
background: var(--surface);
|
|
border-radius: var(--radius-xl);
|
|
box-shadow: var(--shadow-sm);
|
|
padding: 1.5rem;
|
|
margin-bottom: 1.25rem;
|
|
}
|
|
.card--center { text-align: center; }
|
|
.card--comment { background: var(--surface); border-left: 3px solid var(--border-light); }
|
|
|
|
.card__meta {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
align-items: center;
|
|
gap: 0.5rem;
|
|
font-size: 0.85rem;
|
|
color: var(--subtle);
|
|
}
|
|
.card__title { margin: 0.4rem 0 0.6rem; font-size: 1.35rem; }
|
|
.card__title a { color: var(--text); text-decoration: none; }
|
|
.card__title a:hover { color: var(--brand); }
|
|
.card__excerpt { margin: 0; color: var(--muted); }
|
|
.card__foot { margin: 0.8rem 0 0; font-size: 0.85rem; color: var(--subtle); }
|
|
|
|
.section-head { margin: 2rem 0 1rem; font-size: 1.05rem; color: var(--muted); }
|
|
|
|
.tag {
|
|
background: var(--brand-soft);
|
|
color: var(--brand-dark);
|
|
border-radius: 999px;
|
|
padding: 0.15rem 0.6rem;
|
|
font-size: 0.72rem;
|
|
text-transform: uppercase;
|
|
letter-spacing: 0.04em;
|
|
}
|
|
.tag--quiet { background: var(--surface-soft); color: var(--muted); }
|
|
|
|
/* --- prose ----------------------------------------------------------- */
|
|
|
|
.prose { line-height: 1.65; }
|
|
.prose :first-child { margin-top: 0; }
|
|
.prose :last-child { margin-bottom: 0; }
|
|
.prose img { max-width: 100%; height: auto; border-radius: var(--radius-md); }
|
|
.prose pre {
|
|
background: var(--surface-soft);
|
|
padding: 0.9rem;
|
|
border-radius: var(--radius-md);
|
|
overflow-x: auto;
|
|
}
|
|
.prose code { background: var(--surface-soft); padding: 0.1rem 0.3rem; border-radius: var(--radius-sm); }
|
|
.prose pre code { background: none; padding: 0; }
|
|
.prose blockquote {
|
|
margin: 1rem 0;
|
|
padding-left: 1rem;
|
|
border-left: 3px solid var(--border-light);
|
|
color: var(--muted);
|
|
}
|
|
|
|
/* --- forms and buttons ------------------------------------------------ */
|
|
|
|
label { display: block; margin: 1rem 0 0.35rem; font-weight: 600; font-size: 0.9rem; }
|
|
label.check { display: flex; align-items: center; gap: 0.5rem; font-weight: 400; }
|
|
label.check input { margin: 0; }
|
|
|
|
input[type="text"], input[type="email"], input[type="date"],
|
|
input:not([type]), select, textarea {
|
|
width: 100%;
|
|
padding: 0.6rem 0.75rem;
|
|
border: 1px solid var(--border-light);
|
|
border-radius: var(--radius-md);
|
|
background: var(--bg);
|
|
color: var(--text);
|
|
}
|
|
input[type="checkbox"] { width: auto; }
|
|
textarea { resize: vertical; line-height: 1.55; }
|
|
|
|
:focus-visible { outline: 2px solid var(--brand); outline-offset: 2px; }
|
|
|
|
.btn {
|
|
display: inline-block;
|
|
background: var(--brand);
|
|
color: #fff;
|
|
border: 0;
|
|
border-radius: 999px;
|
|
padding: 0.6rem 1.4rem;
|
|
font-weight: 600;
|
|
text-decoration: none;
|
|
cursor: pointer;
|
|
}
|
|
.btn:hover { background: var(--brand-dark); }
|
|
|
|
.linkish {
|
|
background: none;
|
|
border: 0;
|
|
padding: 0;
|
|
color: var(--brand-dark);
|
|
text-decoration: underline;
|
|
cursor: pointer;
|
|
font-size: 0.9rem;
|
|
}
|
|
.linkish--danger { color: var(--danger); }
|
|
|
|
.actions {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
align-items: center;
|
|
gap: 1rem;
|
|
margin-top: 1.25rem;
|
|
}
|
|
.actions form { margin: 0; }
|
|
.actions--row { margin-top: 0; gap: 0.75rem; }
|
|
|
|
.pager { display: flex; justify-content: space-between; margin-top: 2rem; }
|
|
|
|
/* --- tables, flashes, odds and ends ----------------------------------- */
|
|
|
|
.table {
|
|
width: 100%;
|
|
border-collapse: collapse;
|
|
background: var(--surface);
|
|
border-radius: var(--radius-lg);
|
|
overflow: hidden;
|
|
box-shadow: var(--shadow-sm);
|
|
}
|
|
.table th, .table td {
|
|
text-align: left;
|
|
padding: 0.75rem 1rem;
|
|
border-bottom: 1px solid var(--border-light);
|
|
font-size: 0.92rem;
|
|
vertical-align: top;
|
|
}
|
|
.table th { background: var(--surface-soft); font-size: 0.8rem; text-transform: uppercase; letter-spacing: 0.04em; color: var(--muted); }
|
|
.table tr:last-child td { border-bottom: 0; }
|
|
.row--off { opacity: 0.55; }
|
|
|
|
.flash {
|
|
padding: 0.85rem 1.1rem;
|
|
border-radius: var(--radius-md);
|
|
margin-bottom: 1.25rem;
|
|
}
|
|
.flash--ok { background: var(--brand-softer); color: var(--brand-dark); }
|
|
.flash--error { background: #fdecea; color: var(--danger); }
|
|
|
|
.muted { color: var(--muted); }
|
|
.small { font-size: 0.85rem; }
|
|
.mono { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
|
|
|
|
.password {
|
|
font-size: 1.3rem;
|
|
letter-spacing: 0.06em;
|
|
background: var(--surface-soft);
|
|
padding: 1rem;
|
|
border-radius: var(--radius-md);
|
|
user-select: all;
|
|
word-break: break-all;
|
|
}
|
|
|
|
@media (max-width: 640px) {
|
|
.feed-head { flex-direction: column; align-items: flex-start; }
|
|
.table { display: block; overflow-x: auto; }
|
|
}
|
|
|
|
/* --- editor ----------------------------------------------------------- */
|
|
|
|
.tabs {
|
|
display: flex;
|
|
gap: 0.5rem;
|
|
margin-bottom: 1.25rem;
|
|
}
|
|
.tab {
|
|
padding: 0.4rem 1rem;
|
|
border-radius: 999px;
|
|
text-decoration: none;
|
|
color: var(--muted);
|
|
background: var(--surface-soft);
|
|
font-size: 0.9rem;
|
|
}
|
|
.tab--on { background: var(--brand-soft); color: var(--brand-dark); font-weight: 600; }
|
|
|
|
.fieldset {
|
|
border: 1px solid var(--border-light);
|
|
border-radius: var(--radius-md);
|
|
padding: 0.85rem 1rem 1rem;
|
|
margin: 1rem 0 0;
|
|
}
|
|
.fieldset legend { padding: 0 0.4rem; font-weight: 600; font-size: 0.9rem; }
|
|
.fieldset .check { margin: 0.35rem 0; }
|
|
|
|
input[type="file"] {
|
|
width: 100%;
|
|
padding: 0.5rem 0;
|
|
font-size: 0.9rem;
|
|
}
|