MediaWiki:Print.css: Difference between revisions

Jump to navigation Jump to search

MediaWiki:Print.css (view source)

Revision as of 13:37, 2 September 2025

2,338 bytes removed ,  2 September
no edit summary
No edit summary
No edit summary
Line 1: Line 1:
/* ===========================
/* ===========================
   Softwear — A4 Narrow Print
   Softwear — A4 Narrow Print (compact)
  One-column ~half-A4 width
  (compact typography)
   =========================== */
   =========================== */


Line 9: Line 7:
   font-family: 'HALColant-TextRegular';
   font-family: 'HALColant-TextRegular';
   src: url('/fonts/HALColant-TextRegular.woff2?v=20250820') format('woff2'),
   src: url('/fonts/HALColant-TextRegular.woff2?v=20250820') format('woff2'),
       url('/fonts/HALColant-TextRegular.woff?v=20250820') format('woff');
       url('/fonts/HALColant-TextRegular.woff?v=20250820') format('woff');
   font-weight: normal;
   font-weight: normal;
   font-style: normal;
   font-style: normal;
Line 20: Line 18:
/* 3 Base visibility & typography */
/* 3 Base visibility & typography */
.print-only { display: block !important; }
.print-only { display: block !important; }
html, body {
html, body {
   margin: 0;
   margin: 0;
Line 29: Line 26:
}
}


/* 4 Page & narrow column
/* 4 Page & narrow column — A4 portrait; 12mm outer margin; 93mm column */
      A4 portrait; 12mm outer margin.
      Content column = 93mm centered.
*/
@page { size: A4 portrait; margin: 12mm; }
@page { size: A4 portrait; margin: 12mm; }


.entry-wrapper.print-a4-narrow {
.entry-wrapper.print-a4-narrow {
   box-sizing: border-box;
   box-sizing: border-box;
   width: 93mm;                
   width: 93mm;
   margin: 0 auto;            
   margin: 0 auto;
   padding: 3mm;              
   padding: 3mm;
 
}
}


/* 5 Titles & people (COMPACT) */
/* 5 Titles & people (compact) */
.article-title {
.article-title {
   font-size: 16px;
   font-size: 16px;
Line 62: Line 55:
.article-people a { text-decoration: underline; color: #292828 !important; }
.article-people a { text-decoration: underline; color: #292828 !important; }


/* === Hairline rules via pseudo-element (Blink) === */
/* 6 Hairline rules via pseudo-element (Blink) */
.article-entry-number,
.article-entry-number,
.link-pdf,
.link-pdf,
Line 77: Line 70:
   border-bottom: none !important;
   border-bottom: none !important;
}
}
.article-entry-number::after,
.article-entry-number::after,
.link-pdf::after,
.link-pdf::after,
Line 97: Line 89:
}
}


.link-pdf a {
.link-pdf a { text-decoration: none !important; }
  text-decoration: none!important;
 
}
/* 7 Firefox fallback: use real thin borders instead of ::after hairlines */
/* === Firefox fallback: real thin border === */
@-moz-document url-prefix() {
@-moz-document url-prefix() {
   .article-entry-number::after,
   .article-entry-number::after,
Line 111: Line 102:
   .article-external-reference::after,
   .article-external-reference::after,
   .article-quote::after,
   .article-quote::after,
   .article-mod-line::after {
   .article-mod-line::after { content: none !important; }
    content: none !important;
  }


   .article-entry-number,
   .article-entry-number,
Line 124: Line 113:
   .article-external-reference,
   .article-external-reference,
   .article-quote,
   .article-quote,
   .article-mod-line {
   .article-mod-line { border-bottom: 0.5pt solid #292828 !important; }
    border-bottom: 0.5pt solid #292828 !important;
  }


   #article-content > :last-child { border-bottom: 0 !important; }
   #article-content > :last-child { border-bottom: 0 !important; }


  /* Add top spacer so first element isn't flush */
   .entry-wrapper.print-a4-narrow::before,
   .entry-wrapper.print-a4-narrow::before,
   .entry-wrapper.print-a5::before,
   .entry-wrapper.print-a5::before,
Line 136: Line 122:
     content: "";
     content: "";
     display: block;
     display: block;
     height: 6mm; /* match your @page top margin */
     height: 6mm; /* match @page top margin */
  }
 
  html, body {
    margin: 0 !important;
    padding: 0 !important;
   }
   }
  html, body { margin: 0 !important; padding: 0 !important; }
}
}


/* 8 Entry number row */
.article-entry-number { font-size: 12px; line-height: 16px; margin: 0; }


/* 7 Entry number row */
/* 9 Centered link row */
.article-entry-number {
  font-size: 12px;
  line-height: 16px;
  margin: 0;
}
 
/* 8 Centered link row ([PDF⤴] [WEB⤴]) */
.link-pdf {
.link-pdf {
   text-align: center;
   text-align: center;
Line 169: Line 146:
}
}


/* 9 Type line */
/* 10 Type line */
.article-type {
.article-type {
   font-size: 12px;
   font-size: 12px;
Line 179: Line 156:
.article-type a { text-decoration: none; color: #292828 !important; }
.article-type a { text-decoration: none; color: #292828 !important; }


/* 10 Metadata grid (COMPACT) */
/* 11 Metadata grid (compact) */
.article-metadata,
.article-metadata,
.article-metadata * {
.article-metadata * { margin: 0 !important; border: none; background: none; }
  margin: 0 !important;
  border: none;
  background: none;
}
.article-metadata {
.article-metadata {
   display: grid;
   display: grid;
Line 198: Line 171:
   letter-spacing: 0.3px;
   letter-spacing: 0.3px;
}
}
.article-metadata-value {
.article-metadata-value { font-size: 11px; text-transform: capitalize; }
  font-size: 11px;
.article-metadata-value a { color: #292828 !important; text-decoration: none; }
  text-transform: capitalize;
}
.article-metadata-value a {
  color: #292828 !important;
  text-decoration: none;
}


/* 11 Images (shorter to favor text) */
/* 12 Images (shorter to favor text) */
.article-metadata + .article-images { margin-top: 0 !important; padding-top: 0 !important; }
.article-metadata + .article-images { margin-top: 0 !important; padding-top: 0 !important; }
.article-images { margin: 0 !important; padding-top: 0 !important; }
.article-images { margin: 0 !important; padding-top: 0 !important; }
Line 220: Line 187:
.image-container img {
.image-container img {
   display: block;
   display: block;
   max-height: 60mm;   /* was 85mm */
   max-height: 60mm;
   height: auto;
   height: auto;
   width: auto;
   width: auto;
Line 233: Line 200:
   padding: 0 !important;
   padding: 0 !important;
   line-height: 1.1 !important;
   line-height: 1.1 !important;
   font-size: 8px;     /* smaller captions */
   font-size: 8px;
   color: #555;
   color: #555;
   text-align: left;
   text-align: left;
Line 240: Line 207:
.caption-image1:empty { display: none; }
.caption-image1:empty { display: none; }


/* 12 Labels & bodies (COMPACT) */
/* 13 Labels & bodies (compact) */
.article-label-description,
.article-label-description,
.article-label-reflection,
.article-label-reflection,
Line 253: Line 220:
   font-size: 10px;
   font-size: 10px;
   letter-spacing: 0.4px;
   letter-spacing: 0.4px;
  break-after: avoid; page-break-after: avoid;
}
}
.article-metadata + .article-label-description,
.article-metadata + .article-label-description,
Line 260: Line 226:
.article-reflection + .article-label-external-reference,
.article-reflection + .article-label-external-reference,
.article-external-reference + .article-label-quote,
.article-external-reference + .article-label-quote,
.article-quote + .article-label-modification-date {
.article-quote + .article-label-modification-date { margin-top: 6px !important; }
  margin-top: 6px !important;
 
}
.article-description,
.article-description,
.article-reflection,
.article-reflection,
Line 269: Line 234:
.article-mod-line {
.article-mod-line {
   text-indent: 20px;
   text-indent: 20px;
   line-height: 1.15;   /* tighter */
   line-height: 1.15;
   font-size: 11.5px;     /* down from 20px */
   font-size: 11.5px;
   letter-spacing: 0.4px;
   letter-spacing: 0.4px;
   margin-top: 0 !important;
   margin-top: 0 !important;
Line 276: Line 241:
}
}


/* 13 Quote (COMPACT) */
/* 14 Quote */
.article-quote {
.article-quote { font-size: 13px; line-height: 1.2; font-style: italic; }
  font-size: 13px;
  line-height: 1.2;
  font-style: italic;
}


/* 14 Mod line */
/* 15 Mod line */
.article-mod-line {
.article-mod-line {
   white-space: nowrap;
   white-space: nowrap;
Line 297: Line 258:
.article-modification-date { font-size: 11px; letter-spacing: 0.3px; }
.article-modification-date { font-size: 11px; letter-spacing: 0.3px; }


/* 15 Vector resets */
/* 16 Vector resets */
.vector-body p { margin: 0 !important; padding: 0 !important; }
.vector-body p { margin: 0 !important; padding: 0 !important; }


/* 16 Links */
/* 17 Links */
a[href]:after { content: none !important; }
a[href]:after { content: none !important; }
.article-external-reference a {
.article-external-reference a {
Line 307: Line 268:
   text-decoration: none;
   text-decoration: none;
   color: #292828 !important;
   color: #292828 !important;
   font-size: 11px;   /* smaller */
   font-size: 11px;
   line-height: 1.15;
   line-height: 1.15;
   letter-spacing: 0;
   letter-spacing: 0;
}
}


/* 17 Page control */
/* 18 Page control */
#article-content { orphans: 2; widows: 2; }
#article-content { orphans: 2; widows: 2; }


/* 18 Prevent bad splits */
/* 19 Avoid really bad splits for a few blocks */
#article-title,
#article-title,
.article-title-link,
.article-title-link,
Line 321: Line 282:
.article-images { break-inside: avoid; page-break-inside: avoid; }
.article-images { break-inside: avoid; page-break-inside: avoid; }


/* === Chrome/Blink-specific print overrides === */
/* 20 Print-only column enforcement and border logic */
@media print and (-webkit-min-device-pixel-ratio:0) {
  .article-label-description,
  .article-label-reflection,
  .article-label-external-reference,
  .article-label-quote,
  .article-label-modification-date {
    break-after: auto !important;
    page-break-after: auto !important;
  }
 
  .article-label-description + .article-description,
  .article-label-reflection + .article-reflection,
  .article-label-external-reference + .article-external-reference,
  .article-label-quote + .article-quote,
  .article-label-modification-date + .article-modification-date {
    break-before: auto !important;
    page-break-before: auto !important;
  }
 
  .article-description p,
  .article-reflection p,
  .article-external-reference p,
  .article-quote p {
    page-break-inside: avoid;
    break-inside: avoid;
  }
}
 
@media print {
@media print {
   /* WITH border (when <html> does NOT have .print-no-border) */
   /* Column width + centering */
  html:not(.print-no-border) .print-only .entry-wrapper,
  html:not(.print-no-border) .entry-wrapper.print-a4-narrow,
  html:not(.print-no-border) .entry-wrapper.print-a5 {
    border: 0.5pt solid #292828 !important; /* thinner than 1px; crisp in PDF */
    box-sizing: border-box !important;
    background-clip: padding-box;
    padding: 3mm;
  }
 
  /* NO border */
  html.print-no-border .print-only .entry-wrapper,
  html.print-no-border .entry-wrapper.print-a4-narrow,
  html.print-no-border .entry-wrapper.print-a5 {
    border: 0 !important;
    padding: 0 !important;
  }
}
 
/* === FORCE narrow column on print (robust) === */
@media print {
  /* 1 Make sure the column itself is 93mm and centered */
   .entry-wrapper.print-a4-narrow,
   .entry-wrapper.print-a4-narrow,
   .print-only.entry-wrapper,
   .print-only.entry-wrapper,
Line 382: Line 294:
     box-sizing: border-box !important;
     box-sizing: border-box !important;
   }
   }
  /* 2 If the wrapper class isn't present, fall back to constraining .print-only itself */
   .print-only {
   .print-only {
     width: 93mm !important;
     width: 93mm !important;
Line 391: Line 301:
     box-sizing: border-box !important;
     box-sizing: border-box !important;
   }
   }
 
   .print-only *, .entry-wrapper.print-a4-narrow * { max-width: 100% !important; }
  /* 3 Prevent descendants from stretching the width */
   .print-only *,
  .entry-wrapper.print-a4-narrow * {
    max-width: 100% !important;
  }
 
  /* Common stretchers — make them auto width within the column */
   .print-only .mw-body,
   .print-only .mw-body,
   .print-only .vector-body,
   .print-only .vector-body,
   .print-only .content,
   .print-only .content,
   .print-only .list-container,
   .print-only .list-container,
   .print-only table {
   .print-only table { width: auto !important; max-width: 100% !important; }
    width: auto !important;
   .print-only img { width: auto !important; max-width: 100% !important; height: auto !important; }
    max-width: 100% !important;
   }


   /* Images never force the layout wider */
   /* Border: default WITH; disable by adding .print-no-border on <html> in the iframe */
   .print-only img {
   html:not(.print-no-border) .print-only .entry-wrapper,
     width: auto !important;
  html:not(.print-no-border) .entry-wrapper.print-a4-narrow,
     max-width: 100% !important;
  html:not(.print-no-border) .entry-wrapper.print-a5 {
     height: auto !important;
     border: 0.5pt solid #292828 !important;
     box-sizing: border-box !important;
     background-clip: padding-box;
    padding: 3mm;
   }
   }
}
   html.print-no-border .print-only .entry-wrapper,
 
   html.print-no-border .entry-wrapper.print-a4-narrow,
/* === Keep every label/body pair together (all engines) === */
   html.print-no-border .entry-wrapper.print-a5 {
@media print {
     border: 0 !important;
  /* 1) prevent a break right after the label */
     padding: 0 !important;
   .article-label-description,
  .article-label-reflection,
   .article-label-external-reference,
  .article-label-quote,
   .article-label-modification-date {
     page-break-after: avoid !important;
     break-after: avoid !important;
  }
 
  /* 3) reduce “orphans” of the first line drifting to next page */
  .article-description p,
  .article-reflection p,
  .article-external-reference p,
  .article-quote p {
    orphans: 2;
    widows: 2;
    page-break-inside: avoid;
    break-inside: avoid;
   }
   }
}


/* === Allow body paragraphs to split so we don't leave big gaps === */
  /* Paragraph flow: allow splitting to prevent big gaps */
@media print {
   .article-description p,
   .article-description p,
   .article-reflection p,
   .article-reflection p,
   .article-external-reference p,
   .article-external-reference p,
   .article-quote p {
   .article-quote p {
    /* let paragraphs break across pages */
     page-break-inside: auto !important;
     page-break-inside: auto !important;
     break-inside: auto !important;
     break-inside: auto !important;
    /* keep things looking tidy without forcing a full-paragraph jump */
     orphans: 2 !important;
     orphans: 2 !important;
     widows: 2 !important;
     widows: 2 !important;
Line 456: Line 337:
}
}


/* Blink-specific safety (overrides any earlier "avoid" in your Blink block) */
/* 21 (Optional) If you ever want label+body to stick, uncomment below.
@media print and (-webkit-min-device-pixel-ratio:0) {
  It will reintroduce occasional gaps when there’s no room for a first line. */
   .article-description p,
/*
   .article-reflection p,
@media print {
   .article-external-reference p,
   .article-label-description,
   .article-quote p {
   .article-label-reflection,
     page-break-inside: auto !important;
   .article-label-external-reference,
     break-inside: auto !important;
   .article-label-quote,
    orphans: 2 !important;
  .article-label-modification-date {
    widows: 2 !important;
     page-break-after: avoid !important;
     break-after: avoid !important;
   }
   }
}
}
*/
Retrieved from "https://softwear.directory/log/Special:MobileDiff/5232"

Navigation menu