MediaWiki:Print.css

From softwear.directory
Revision as of 14:26, 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: 24px;
    letter-spacing: 0.8px;
    text-align: center;
    color: #292828!important;
    margin: 0;
}
.article-people { 
    font-size: 22px;
    line-height: 28px;
    letter-spacing: 0.8px;
    text-align: center;
    text-decoration: underline;
    color: #292828!important;
    margin: 0;
    padding-top: 15px;
}

.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-image: linear-gradient(#000, #000);
    background-repeat: no-repeat;
    background-position: 0 100%;
    background-size: 100% 0.5px;   
}

.link-pdf {
    text-align: center;
    color: #292828!important;
    text-decoration: none;

    margin-top: 4px;
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;

    background-image: linear-gradient(#000, #000);
    background-repeat: no-repeat;
    background-position: 0 100%;
    background-size: 100% 0.5px;   
}
.link-pdf a, .link-pdf p {
    text-decoration: none;
    display: inline-block;  
    color: #292828!important;
    margin-top: 0!important;
}

.article-type { 
    font-size: 16px;
    line-height: 23px;
    letter-spacing: 0;
    margin-top: 4px!important;
    padding-bottom: 3px!important;
    text-decoration: none;
    color: #292828!important;

    border-bottom: none;
    background-image: linear-gradient(#000, #000);
    background-repeat: no-repeat;
    background-position: 0 100%;
    background-size: 100% 0.5px;   
}

.article-type a {
    text-decoration: none;
    display: inline-block;  
    color: #292828!important;
}
.article-metadata {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2mm;
    margin: 0!important;
    padding: 0!important;

    border-bottom: none;
    background-image: linear-gradient(#000, #000);
    background-repeat: no-repeat;
    background-position: 0 100%;
    background-size: 100% 0.5px;   
}
.article-metadata-column {
    margin: 0!important;
    padding: 0!important;
}

.article-metadata-column > .article-metadata-label {
    margin-top: 0!important;
    padding-top: 0!important;
    color: red;
}

.article-metadata-column > .article-metadata-value {
    color: green;
    margin-top: 0!important;
    padding-top: 0!important;
}

.article-metadata-value a {
    color: green;
    text-decoration: none;
    margin-top: 0!important;
    padding-top: 0!important;
}

.article-metadata-label { 
    text-transform: uppercase;
    font-size: 14px;
    line-height: 18px;
    letter-spacing: 0.2px;
    margin-top: 0!important;
    margin-bottom: 0!important;
    padding-top: 0important;
    padding-bottom: 0!important;
}
.article-metadata-value { 
    text-transform: capitalize;
    font-size: 14px;
    line-height: 16px;
    letter-spacing: 0.4px; 
    margin-top: 0!important;
    padding-top: 0!important;
}

.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;
}