MediaWiki:Print.css: Difference between revisions

Revision as of 18:54, 19 June 2025

/* MediaWiki:Print.css */

@media print {
    /* --- General Print Cleanup --- */
    /* Remove navigation, sidebars, and other elements not needed for print */
    #mw-navigation, #mw-panel, #p-cactions, #p-personal, #p-views,
    #p-navigation, #p-search, #siteSub, #footer, #catlinks,
    .noprint, .editsection, .mw-indicators, .printfooter,
    #privacy, #about, #disclaimer, #toc {
        display: none !important;
    }

    /* Adjust page margins for better print layout */
    body {
        margin: 1.5cm; /* Roughly 0.6 inches on all sides */
        font-family: sans-serif; /* Use a common sans-serif font for readability if 'Century Schoolbook' isn't available */
        font-size: 10pt; /* A good default base font size for print, adjust as needed */
        line-height: 1.4; /* Standard line height for readability */
    }

    /* --- Header Sizing --- */
    /* Main page title (h1) */
    h1#firstHeading, #content h1 {
        font-size: 20pt !important; /* Larger for main title */
        margin-top: 1.5em !important;
        margin-bottom: 0.8em !important;
        line-height: 1.2em !important;
        text-align: center; /* Center the main title if desired */
    }

    /* Section headings from `== Heading ==` (render as h2) */
    h2 {
        font-size: 16pt !important; /* Smaller than h1, but still prominent */
        margin-top: 1.5em !important;
        margin-bottom: 0.7em !important;
        line-height: 1.3em !important;
        text-align: center; /* Center these main section headings */
        page-break-after: avoid; /* Keep heading with content below it */
    }

    /* Subsection headings from `=== Subheading ===` (render as h3) */
    h3 {
        font-size: 14pt !important; /* Good size for subheadings */
        margin-top: 1.2em !important;
        margin-bottom: 0.6em !important;
        line-height: 1.3em !important;
        page-break-after: avoid;
    }

    /* Smaller headings (h4, h5, h6) if used, make them just slightly bigger than body text */
    h4, h5, h6 {
        font-size: 12pt !important; /* Only slightly larger than body for sub-sub-headings */
        margin-top: 1em !important;
        margin-bottom: 0.5em !important;
        line-height: 1.3em !important;
        page-break-after: avoid;
    }

    /* Specific styling for the 'The Setting and Scene' block which has its own div */
    .mw-parser-output div[style*="text-align: center;"] h2 {
        font-size: 18pt !important; /* Adjust if you want this specific h2 to be different */
        /* You can add more specific rules here if needed for this centered block */
    }

    /* --- Text & Paragraph Styling --- */
    p, ul, ol, dl, pre, blockquote, table {
        font-size: 10pt !important; /* Ensure body text is standard base size */
        line-height: 1.5 !important; /* Improve readability with line spacing */
        margin-top: 0.5em !important;
        margin-bottom: 0.5em !important;
    }
    
    li { /* Ensure list items also inherit size */
        font-size: 10pt !important;
    }

    /* --- Image & Thumbnail Styling (from previous attempt, adjusted for better default) --- */
    img {
        max-width: 100% !important; /* Prevents images from overflowing page */
        height: auto !important; /* Maintains aspect ratio */
        display: block; /* Ensures they act as blocks */
        margin: 0.8em auto; /* Center images */
    }

    .thumb {
        float: none !important; /* Remove float by default for simpler print layout */
        margin: 1em auto !important; /* Center the thumbnail container */
        max-width: 250px !important; /* Adjust this to control thumbnail width, e.g., 200px, 150px */
        border: 1px solid #ccc; /* Add a subtle border */
        padding: 4px; /* Add some padding inside the border */
        background-color: #f9f9f9; /* Light background for the thumbnail box */
        box-sizing: border-box; /* Include padding and border in element's total width/height */
        page-break-inside: avoid; /* Prevent thumbnails from breaking across pages */
    }

    .thumbinner {
        padding: 3px !important;
        border: none !important;
        background-color: transparent !important;
    }

    .thumbimage {
        max-width: 100% !important; /* Image within thumbnail must respect container */
        height: auto !important;
        display: block;
        border: none !important; /* Remove individual image border if parent .thumb has one */
    }

    .thumbcaption {
        font-size: 9pt !important; /* Smaller font for caption */
        line-height: 1.3em !important;
        padding: 3px 0 !important;
        text-align: left !important;
        overflow: hidden !important;
    }

    /* --- Column Layout Adjustments --- */
    .module, .div-col {
        column-count: 1 !important; /* Force single column for print readability */
        column-width: auto !important;
        column-rule: none !important; /* Remove column lines */
    }
    .div-col li, .div-col dd, .div-col p {
        break-inside: avoid; /* Keep content from splitting across column/page breaks */
    }
}