thalladaandClaude Fable 5.1
4995a8bd5d
Signed-in issue page with the Brief, downloads, index and colophon; article, World Briefing and Behind the paper pages under the login guard; the rating widget with its fetch enhancement; the admin-only POST /rate writing dashboard-attributed rating events; the HMAC confirmation page links to the site. Co-Authored-By: Claude Fable 5.1 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01NHyYupFdBiR4VfoUM7NjSM
60 lines
4.2 KiB
CSS
60 lines
4.2 KiB
CSS
:root { --bg:#fbfaf6; --fg:#171713; --muted:#68665f; --rule:#c9c5b9; --accent:#8b1e1e; --loved:#286a3b; --good:#34688a; --down:#943b35; color-scheme:light dark; }
|
|
@media (prefers-color-scheme:dark) { :root { --bg:#171714; --fg:#eeeae0; --muted:#aaa69b; --rule:#4c4a44; --accent:#ef8c82; --loved:#75c58a; --good:#75aed0; --down:#e5867d; } }
|
|
* { box-sizing:border-box; }
|
|
body { margin:0 auto; padding:0 1rem; background:var(--bg); color:var(--fg); font:1rem/1.55 Georgia,serif; }
|
|
a { color:var(--accent); }
|
|
.masthead { max-width:72ch; margin:1.5rem auto .4rem; border-block:3px double var(--fg); padding:.45rem 0; text-align:center; font-size:2rem; font-weight:700; }
|
|
.masthead a { color:inherit; text-decoration:none; }
|
|
.primary,.admin,footer { max-width:72ch; margin:.7rem auto; text-align:center; color:var(--muted); }
|
|
.admin { max-width:1200px; font-family:system-ui,sans-serif; }
|
|
.flash { max-width:72rem; margin:1rem auto; padding:.75rem 1rem; border:1px solid var(--rule); }
|
|
main { min-height:70vh; }
|
|
.reading { max-width:72ch; margin:2rem auto; }
|
|
.narrow { max-width:34rem; }
|
|
.dateline,.stats,.byline,.comments,.strap,.meta,.social,.index-meta { color:var(--muted); }
|
|
.issue section { border-top:1px solid var(--rule); margin-top:2rem; }
|
|
.issue article { border-bottom:1px solid var(--rule); padding:.4rem 0 .8rem; }
|
|
.issue .lead h3 { font-size:1.45rem; }
|
|
.comments a,.downloads a { margin-right:.8rem; }
|
|
.downloads { display:flex; flex-wrap:wrap; gap:.6rem; margin:1.5rem 0; }
|
|
.button { border:1px solid currentColor; padding:.45rem .7rem; text-decoration:none; }
|
|
.index-list { list-style:none; padding:0; }
|
|
.index-entry { border-bottom:1px solid var(--rule); padding:.5rem 0 1rem; }
|
|
.index-entry h3 { margin-bottom:.1rem; }
|
|
.index-entry p { margin:.35rem 0; }
|
|
.issue-chapters { border-block:1px solid var(--rule); margin:2rem 0; padding:1rem 0; text-align:center; font-size:1.15rem; }
|
|
.colophon { max-width:none; margin:2rem 0; text-align:left; }
|
|
.rule { border:0; border-top:1px solid var(--rule); margin:1.5rem 0; }
|
|
.article-header h1 a { color:inherit; }
|
|
.article-body img { display:block; max-width:100%; height:auto; margin:1rem auto; }
|
|
.article-body pre { max-width:100%; overflow-x:auto; }
|
|
.discussion { border-top:1px solid var(--rule); margin-top:2rem; padding-top:1rem; }
|
|
.discussion blockquote { border-left:2px solid var(--rule); margin-left:.5rem; padding-left:1rem; }
|
|
.discussion blockquote.reply { margin-left:1.5rem; }
|
|
.comment-meta { color:var(--muted); font-size:.9rem; }
|
|
.prev-next { display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin:1.5rem 0; }
|
|
.prev-next a:last-child { text-align:right; }
|
|
form { display:grid; gap:.8rem; margin:1.5rem 0; }
|
|
label { display:grid; gap:.25rem; }
|
|
input,textarea,button { font:inherit; padding:.45rem; }
|
|
.error { color:var(--down); }
|
|
.dashboard { max-width:1200px; margin:2rem auto; font-family:system-ui,sans-serif; }
|
|
.scroll-x { overflow-x:auto; }
|
|
table { width:100%; border-collapse:collapse; font:0.9rem/1.35 system-ui,sans-serif; }
|
|
th,td { border-bottom:1px solid var(--rule); padding:.35rem .5rem; text-align:left; }
|
|
thead { position:sticky; top:0; background:var(--bg); }
|
|
.badge { border:1px solid currentColor; border-radius:999px; padding:.1rem .45rem; }
|
|
.badge.selected,.badge.loved { color:var(--loved); } .badge.good,.badge.assessed,.badge.triaged { color:var(--good); } .badge.down,.badge.excluded { color:var(--down); }
|
|
.badge.shortlisted,.badge.admitted,.badge.eligible,.badge.cleared { color:var(--muted); }
|
|
.kv { display:grid; grid-template-columns:minmax(10rem,1fr) 3fr; } .kv dt { color:var(--muted); }
|
|
.funnel > * { background:var(--good); min-width:1px; margin:.2rem 0; }
|
|
.spark { max-width:100%; height:auto; }
|
|
.rating { display:flex; flex-wrap:wrap; align-items:center; gap:.3rem; }
|
|
.rating button { border:1px solid var(--rule); background:transparent; color:var(--fg); cursor:pointer; }
|
|
.rating button.active { background:var(--fg); color:var(--bg); border-color:var(--fg); }
|
|
.rating button.clear { border:0; color:var(--muted); padding-inline:.25rem; text-decoration:underline; }
|
|
.rating button.clear.active { background:transparent; color:var(--fg); font-weight:700; }
|
|
.rating-prompt { margin-right:.25rem; }
|
|
.rating-note { flex-basis:100%; }
|
|
@media (max-width:40rem) { .masthead { font-size:1.55rem; } .kv { display:block; } }
|