MediaWiki:Print.css

From softwear.directory
Revision as of 10:25, 20 August 2025 by Admin (talk | contribs)
Jump to navigation Jump to search

Note: After publishing, you may have to bypass your browser's cache to see the changes.

  • Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
  • Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
  • Internet Explorer / Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5
  • Opera: Press Ctrl-F5.
/* --- Load custom print font --- */
@font-face {
  font-family: 'HALColant-TextRegular';
  src: url('/fonts/HALColant-TextRegular.woff2?v=20250820') format('woff2'),
       url('/fonts/HALColant-TextRegular.woff?v=20250820')  format('woff');
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

* { -webkit-print-color-adjust: exact; print-color-adjust: exact; }

/* Global print baseline */
.print-only { display: block !important; }

/* Use the font everywhere in print */
html, body {
  margin: 0;
  padding: 0;
  font-family: 'HALColant-TextRegular', Georgia, "Times New Roman", serif;
  color: #111;
}

/* A5 page setup */
@page { 
    size: A5 portrait; 
    margin: 2.5mm; 
}  /* minimal outside margin for Chrome defaults */
.entry-wrapper.print-a5 { padding: 2.5mm; }   /* inner breathing room */

html, body { margin: 0; padding: 0;}

/* Main wrapper for the printable entry */
.entry-wrapper.print-a5 {
  width: 100%;
  box-sizing: border-box;
  /* remove forced page break to avoid a blank trailing page on single prints */
  /* page-break-after: always; */
}

/* Avoid splitting key sections across pages */
#article-title,
.article-title-link,
.article-images,
.article-metadata,
.article-description,
.article-reflection,
.article-external-reference,
.article-quote {
  page-break-inside: avoid;
  break-inside: avoid;
}

/* Typography & spacing for the print layout */
body { font-family: HALColant-TextRegular!important; color: #292828!important;}

.article-title { 
    font-size: 22px;
    line-height: 28px;
    letter-spacing: 1px;
    text-align: center;
    color: #292828!important;
    margin: 0;
}
.article-people { 
    font-size: 22px;
    line-height: 28px;
    letter-spacing: 1px;
    text-align: center;
    text-decoration: underline;
    color: #292828!important;
    margin: 0;
    padding-top: 14px;
}

.article-people a { 
    text-decoration: underline;
    color: #292828!important;
}

.article-entry-number {
    font-size: 16px;
    line-height: 23px;
    letter-spacing: 0;
    margin: 0;
    padding-bottom: 4px;
    border-bottom: none;

    background: url('data:image/svg+xml;utf8,\
    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 1" preserveAspectRatio="none">\
    <line x1="0" y1="0.5" x2="100" y2="0.5" stroke="%23000" stroke-width="0.4"/>\
    </svg>') no-repeat left bottom / 100% 0.5px;
}

.article-type { 
    font-size: 9pt; 
    margin: 0 0 2mm; 
}
.article-metadata {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 4mm;
  margin: 6mm 0;
}
.article-metadata-label { font-weight: bold; font-size: 8.5pt; margin: 0 0 1mm; }
.article-metadata-value { font-size: 9pt; margin: 0; }

.article-images .image-container { text-align: center; margin: 6mm 0; }
.article-images img { max-width: 100%; height: auto; }
.caption-image1 { font-size: 8pt; color: #555; margin-top: 2mm; }

.article-label-description,
.article-label-reflection,
.article-label-external-reference,
.article-label-quote,
.article-label-modification-date {
  font-weight: bold;
  margin: 4mm 0 1.5mm;
  font-size: 9pt;
}
.article-description,
.article-reflection,
.article-external-reference,
.article-quote,
.article-modification-date {
  font-size: 10pt;
  line-height: 1.35;
}

/* Don’t append raw URLs in print */
a[href]:after { content: none !important; }

/* Wrap long links gracefully */
.article-external-reference a {
  word-break: break-word;
  overflow-wrap: anywhere;
}