/* ** Print / Save-as-PDF layout for book and chapter pages. ** ** The "Download PDF" button calls window.print(). Every current browser ** offers "Save as PDF" as a print destination - desktop, iOS and Android ** alike - so the PDF a visitor ends up with is whatever these rules ** produce. There is no server-side renderer and no library: the browser ** does the typesetting, which is why this works on the 64,000-word books ** as happily as on the 400-word ones. ** ** Loaded with media="print", so it costs nothing on screen. ** ** Everything keys off .print-root, the class book.php and ** book_chapter.php put on the wrapper holding the text. A page without ** that class matches almost nothing here and prints exactly as it did ** before. ** ** Load it after book-content.css. */ /* Page box ** ----------------------------------------------------------------- ** At the top level of the file rather than nested inside the @media ** print block below. The already carries media="print", so ** everything here is print-only anyway, and a nested @page is the ** form browsers have been least consistent about honouring. ** ** The horizontal margin is deliberately 0. The print dialog's own ** "Margins" control overrides the side margins named here - which is ** why the first version of this file printed edge to edge - so the ** side margin is set as padding on .print-root instead. Padding is ** content, and no print dialog reaches into it. ** ** The vertical margin stays here, where all it has to do is leave ** room for the browser's own header and footer. Those (URL, date, ** page number) appear unless the visitor unticks them in the dialog, ** which is not reachable from CSS either. */ @page { margin: 16mm 0; } @media print { /* Structural reset ** ----------------------------------------------------------------- ** The page is built from Bootstrap sections, containers, rows, ** columns and cards, all carrying screen padding and a grid that ** means nothing on paper. Flatten the lot to plain blocks so the ** text runs the full width of the page box. */ .print-root section, .print-root .container, .print-root .row, .print-root [class*="col-"], .print-root .card, .print-root .card-body { display: block !important; float: none !important; width: auto !important; max-width: none !important; margin: 0 !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; } /* What is not the book ** ----------------------------------------------------------------- ** .print-root sits between the chrome that precedes it - the sticky ** navbar clone theme.js injects into , and the skip link - and ** everything that follows it: the quote of the day and the counter ** cards from footer-scripts.php, the footer, the scroll-progress ** ring. The two in front are named individually; the rest is "every ** sibling after it", so anything appended to the page later stays ** out of the PDF by default instead of by being remembered here. ** ** Inside the wrapper, the header carries the menu and the search ** panel, and the buttons, breadcrumb and meta icons are all screen ** furniture. .btn-expand is spared - on the few books that use ** chapters those links are the table of contents, which is worth ** keeping. ** ** Nothing here overlaps the reset above - no button, header, ** breadcrumb or icon is a section, container, row, column or card - ** so the two blocks cannot fight over an element. */ .navbar-clone, .skip-link, .print-root ~ *, .print-root > header, .print-root .offcanvas, .print-root nav[aria-label="breadcrumb"], .print-root .btn:not(.btn-expand), .print-root .post-meta i, .print-root .btn-expand i { display: none !important; } /* Colour ** ----------------------------------------------------------------- ** Browsers drop background colours when printing but keep text ** colour. A visitor printing with the dark theme on would therefore ** get #c3cad6 body text on white paper - technically visible, in ** practice not. Force black on white whatever the theme is doing. ** ** The dark rules are injected by the script at the top of head.php ** as [data-bs-theme="dark"] p { color: ... !important }, specificity ** (0,1,1), and its link rule is (0,2,1). Prefixing with :root makes ** these (0,3,0) and (0,3,1), so they win on specificity and do not ** depend on which stylesheet the browser saw last. */ .print-root, .print-root * { background: transparent !important; background-image: none !important; box-shadow: none !important; text-shadow: none !important; color: #000 !important; } :root[data-bs-theme="dark"] .print-root, :root[data-bs-theme="dark"] .print-root *, :root[data-bs-theme="dark"] .print-root a, :root[data-bs-theme="dark"] .print-root a * { background: transparent !important; background-image: none !important; box-shadow: none !important; color: #000 !important; } /* Body text ** ----------------------------------------------------------------- ** A serif face at 11pt suits these texts and reads better on paper ** than the screen sans. is set, so hyphens:auto ** has a dictionary to work with and justification does not open ** rivers down the column. */ /* The side margins of the printed page. See the @page note at the top ** of the file for why they are padding here and not a page margin. ** Horizontal padding on a box that spans several pages is applied to ** every one of them, which is exactly what a page margin needs to do; ** vertical padding would only land on the first and last page, so the ** top and bottom margins are left to @page. */ .print-root { padding: 0 15mm !important; font-family: Georgia, "Times New Roman", Times, serif; font-size: 11pt; line-height: 1.5; } .print-root p { margin: 0 0 0.7em 0; text-align: justify; hyphens: auto; orphans: 3; widows: 3; } /* Keep a heading with the text it introduces rather than stranded at ** the foot of a page. Both spellings: the unprefixed properties are ** the current ones, page-break-* the pair Safari still wants. */ .print-root h1, .print-root h2, .print-root h3, .print-root h4, .print-root h5, .print-root h6 { font-family: Georgia, "Times New Roman", Times, serif; line-height: 1.25; margin: 1.2em 0 0.4em 0; break-after: avoid; page-break-after: avoid; break-inside: avoid; page-break-inside: avoid; } .print-root h2 { font-size: 15pt; } .print-root h3 { font-size: 13pt; } .print-root h4, .print-root h5, .print-root h6 { font-size: 12pt; } /* Links stay legible and stay links - a PDF saved from the print ** dialog keeps them clickable - but lose the theme's blue. */ .print-root a { text-decoration: underline; } /* Title block ** ----------------------------------------------------------------- ** The hero section becomes the head of the document: title, author, ** translator, year and the source URL, ruled off from the text. ** Specificity here is (0,2,2), above the (0,1,1) reset above, so the ** border and spacing survive it. */ .print-root main > section:first-child { text-align: center; margin: 0 0 1.6rem 0 !important; padding: 0 0 0.9rem 0 !important; border-bottom: 1px solid #000 !important; break-after: avoid; page-break-after: avoid; } /* .h1: headings inside the stored book text are

in the database but ** are rendered as

(content_headings() in functions.php), ** so they keep printing at the size they always had. (0,2,0) beats the ** (0,1,1) of .print-root h2 above. */ .print-root h1, .print-root .h1, .print-root .display-1 { font-size: 20pt; margin: 0 0 0.5rem 0; } /* A chapter page carries its book/author/year as a plain

rather ** than a post-meta list, and the justify rule below would otherwise ** pull it out of the centred title block. (0,2,3) against that ** rule's (0,1,1). */ .print-root main > section:first-child p { text-align: center; hyphens: none; } /* post-meta is a