Print: personal sections back to a two-column newspaper flow
c4e5432dd34a025c82f35041f0b5245dad492a5e
humdrum-tiv <45084903+humdrum-tiv@users.noreply.github.com> · 2026-06-09 13:50
parent 3ce1939b
Print: personal sections back to a two-column newspaper flow Revert the middle bento grid to a classic two-column column-flow (.paper-grid → column-count: 2), matching the briefs spread. Weather stays the full-width double-wide hero up top; the Screamer News Briefs stay their own trailing full-page spread. Drop the now-unused per-section SECTION_SPAN bento weights and gridColumn styling. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
2 files changed
app/globals.css +3 −3
@@ -217,11 +217,11 @@ .paper-wx-seg-g { font-size: 20px; line-height: 1.3; margin: 3px 0; }
.paper-wx-seg-d { font-family: var(--font-display); font-weight: 700; font-size: 21px; line-height: 1; }
.paper-wx-seg-p { font-family: var(--font-mono); font-size: 9px; color: #555; margin-top: 3px; }
-/* ── Personal bento grid ── 6 cols, dynamic spans, dense flow ── */
-.paper-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 11px; grid-auto-flow: row dense; }
+/* ── Personal sections ── classic two-column newspaper flow ── */
+.paper-grid { column-count: 2; column-gap: 22px; }
.paper-card {
border: 1px solid #ddd; border-left: 4px solid #111; border-radius: 7px;
- padding: 9px 12px 10px; break-inside: avoid;
+ padding: 9px 12px 10px; margin-bottom: 11px; break-inside: avoid;
}
.paper-card > h2 {
font-family: var(--font-display); font-weight: 700; font-size: 16px;
app/print/page.tsx +5 −16
@@ -1,10 +1,10 @@
// /print — the newspaper edition. Server-rendered from current cached snapshots.
// Puppeteer loads this route to produce the PDF (see /api/edition).
//
-// Layout: masthead → full-width weather hero (with today's day-part strip) →
-// a dynamic bento grid of personal sections → a trailing full-page news spread
-// (the four Screamer briefs). Each kind has a small paper renderer below; add a
-// case to support a new kind.
+// Layout: masthead → full-width weather hero (double-wide, with today's day-part
+// strip) → personal sections in a classic two-column newspaper flow → a trailing
+// full-page news spread (the four Screamer briefs). Each kind has a small paper
+// renderer below; add a case to support a new kind.
import { gatherEdition, type EditionSection } from "@/lib/edition-data";
import type { SourceKind } from "@/lib/schemas/source";
@@ -48,16 +48,6 @@ sports: "Scores",
feeds: "RSS",
onthisday: "History",
obsidian: "Obsidian",
-};
-
-// Bento spans on a 6-column grid — content weight, not source order.
-const SECTION_SPAN: Partial<Record<SourceKind, number>> = {
- calendar: 2,
- sports: 2,
- feeds: 2,
- obsidian: 2,
- todos: 3,
- onthisday: 3,
};
function shortDate(iso: string) {
@@ -307,10 +297,9 @@ // A personal-section bento card on page one.
function PaperCard({ section }: { section: EditionSection }) {
const body = SectionBody({ kind: section.kind, payload: section.payload });
if (!body) return null;
- const span = SECTION_SPAN[section.kind] ?? 2;
const kick = SECTION_KICK[section.kind];
return (
- <section className="paper-card" style={{ gridColumn: `span ${span}` }}>
+ <section className="paper-card">
<h2>
{SECTION_TITLE[section.kind] ?? section.label}
{kick && <span className="kick">{kick}</span>}