4,427
edits
No edit summary Tag: Reverted |
No edit summary Tag: Manual revert |
||
Line 4: | Line 4: | ||
=========================== */ | =========================== */ | ||
/* 1) Font face (print-safe) */ | /* --- 1) Font face (print-safe) --- */ | ||
@font-face { | @font-face { | ||
font-family: 'HALColant-TextRegular'; | font-family: 'HALColant-TextRegular'; | ||
Line 14: | Line 14: | ||
} | } | ||
/* 2) Browser print color fidelity */ | /* --- 2) Browser print color fidelity --- */ | ||
* { -webkit-print-color-adjust: exact; print-color-adjust: exact; } | * { -webkit-print-color-adjust: exact; print-color-adjust: exact; } | ||
/* 3) Base print visibility & typography */ | /* --- 3) Base print visibility & typography --- */ | ||
.print-only { display: block !important; } | .print-only { display: block !important; } /* ensure print layout is visible */ | ||
html, body { | html, body { | ||
Line 26: | Line 26: | ||
color: #111; | color: #111; | ||
} | } | ||
/* Use your preferred ink color */ | |||
body { color: #292828 !important; } | body { color: #292828 !important; } | ||
/* 4) Page size and margins */ | /* --- 4) Page size and margins --- */ | ||
@page { | @page { | ||
size: A5 portrait; | size: A5 portrait; | ||
margin: 2.5mm; | margin: 2.5mm; /* outer paper margin */ | ||
} | } | ||
/* | /* Inner breathing room for the print block */ | ||
.entry-wrapper.print-a5 { | .entry-wrapper.print-a5 { | ||
width: 100%; | width: 100%; | ||
box-sizing: border-box; | box-sizing: border-box; | ||
padding: 2.5mm; | padding: 2.5mm; /* inner content padding */ | ||
} | } | ||
/* | /* --- 5) Titles & people --- */ | ||
.article-title { | .article-title { | ||
font-size: 22px; | font-size: 22px; | ||
Line 63: | Line 52: | ||
margin: 0; | margin: 0; | ||
} | } | ||
.article-people { | .article-people { | ||
font-size: 22px; | font-size: 22px; | ||
Line 73: | Line 63: | ||
padding-top: 15px; | padding-top: 15px; | ||
} | } | ||
/* | .article-people a { | ||
text-decoration: underline; | |||
color: #292828 !important; | |||
} | |||
/* --- 6) Hairline rule under entry number --- */ | |||
.article-entry-number { | .article-entry-number { | ||
font-size: 16px; | font-size: 16px; | ||
Line 83: | Line 77: | ||
padding-bottom: 4px; | padding-bottom: 4px; | ||
border-bottom: none; | border-bottom: none; | ||
/* draw a crisp hairline using a background gradient */ | |||
background-image: linear-gradient(#000, #000); | background-image: linear-gradient(#000, #000); | ||
background-repeat: no-repeat; | background-repeat: no-repeat; | ||
background-position: 0 100%; | background-position: 0 100%; | ||
background-size: 100% 0.5px; | background-size: 100% 0.5px; /* ~hairline */ | ||
} | } | ||
/* | /* --- 7) Link row ([PDF⤴] [WEB⤴]) centered with hairline --- */ | ||
.link-pdf { | .link-pdf { | ||
text-align: center; | text-align: center; | ||
Line 95: | Line 90: | ||
text-decoration: none; | text-decoration: none; | ||
margin: 4px 0 0 0; | margin: 4px 0 0 0; | ||
padding: 0; | padding: 0 0 0 0; | ||
border-bottom: none; | border-bottom: none; | ||
background-image: linear-gradient(#000, #000); | background-image: linear-gradient(#000, #000); | ||
Line 102: | Line 97: | ||
background-size: 100% 0.5px; | background-size: 100% 0.5px; | ||
} | } | ||
.link-pdf a, | .link-pdf a, | ||
.link-pdf p { | .link-pdf p { | ||
Line 111: | Line 107: | ||
} | } | ||
/* | /* --- 8) Type line with hairline --- */ | ||
.article-type { | .article-type { | ||
font-size: 16px; | font-size: 16px; | ||
Line 125: | Line 121: | ||
background-size: 100% 0.5px; | background-size: 100% 0.5px; | ||
} | } | ||
.article-type a { text-decoration: none; display: inline-block; color: #292828 !important; } | .article-type a { | ||
text-decoration: none; | |||
display: inline-block; | |||
color: #292828 !important; | |||
} | |||
/* | /* --- 9) Metadata grid (no margins/paddings; hairline under block) --- */ | ||
.article-metadata, | .article-metadata, | ||
.article-metadata * { | .article-metadata * { | ||
Line 134: | Line 134: | ||
background: none; | background: none; | ||
} | } | ||
.article-metadata { | .article-metadata { | ||
display: grid; | display: grid; | ||
Line 141: | Line 142: | ||
line-height: 1 !important; | line-height: 1 !important; | ||
border-bottom: none; | border-bottom: none; | ||
background-image: | background-image: linear-gradient(#000, #000); | ||
background-repeat: no-repeat; | |||
background-position: 0 100%; | |||
background-size: 100% 0.5px; | |||
} | } | ||
.article-metadata-label { | .article-metadata-label { | ||
font-size: 13px; | font-size: 13px; | ||
Line 151: | Line 154: | ||
letter-spacing: 0.3px; | letter-spacing: 0.3px; | ||
} | } | ||
.article-metadata-value { | .article-metadata-value { | ||
font-size: 15px; | font-size: 15px; | ||
text-transform: capitalize; | text-transform: capitalize; | ||
} | } | ||
.article-metadata-value a { color: #292828 !important; text-decoration: none; } | .article-metadata-value a { | ||
color: #292828 !important; | |||
text-decoration: none; | |||
} | |||
/* | /* Remove any accidental gap before images */ | ||
.article-metadata + .article-images { | |||
margin-top: 0 !important; | |||
padding-top: 0 !important; | |||
} | |||
/* --- 10) Images & caption (no gaps; hairline under block) --- */ | |||
.article-images { | .article-images { | ||
margin: 0 !important; | margin: 0 !important; | ||
padding: 0 !important; | padding: 0 !important; | ||
border-bottom: none; | border-bottom: none; | ||
background-image: | background-image: linear-gradient(#000, #000); | ||
background-repeat: no-repeat; | |||
background-position: 0 100%; | |||
background-size: 100% 0.5px; | |||
} | } | ||
.article-images .image-container { | .article-images .image-container { | ||
display: inline-flex; | display: inline-flex; | ||
flex-direction: column; | flex-direction: column; /* stack image then caption */ | ||
align-items: flex-start; | align-items: flex-start; /* left-align image & caption */ | ||
margin: 0 !important; | margin: 0 !important; | ||
padding: 0 !important; | padding: 0 !important; | ||
} | } | ||
.article-images .image-container img, | .article-images .image-container img, | ||
.image-container img { | .image-container img { | ||
display: block; | display: block; | ||
max-height: 85mm; | max-height: 85mm; /* cap instead of forcing height to reduce jumps */ | ||
height: auto; | height: auto; | ||
width: auto; | width: auto; | ||
Line 185: | Line 202: | ||
line-height: 0; | line-height: 0; | ||
} | } | ||
.caption-image1 { | .caption-image1 { | ||
margin: 0 !important; | margin: 0 !important; | ||
padding: 0 0 11px 0 !important; | padding: 0 0 11px 0 !important; /* small breathing room under caption */ | ||
line-height: 1 !important; | line-height: 1 !important; | ||
font-size: 9pt; | font-size: 9pt; | ||
Line 194: | Line 212: | ||
width: 100%; | width: 100%; | ||
} | } | ||
/* | /* Kill user-agent margins in Vector paragraphs that sneak in */ | ||
.vector-body p { margin: 0 !important; padding: 0 !important; } | .vector-body p { margin: 0 !important; padding: 0 !important; } | ||
/* | /* --- 11) Section labels & bodies --- */ | ||
.article-label-description, | .article-label-description, | ||
.article-label-reflection, | .article-label-reflection, | ||
Line 230: | Line 231: | ||
/* prevent a break RIGHT AFTER the label (no orphan label) */ | /* prevent a break RIGHT AFTER the label (no orphan label) */ | ||
break-after: avoid; page-break-after: avoid; | break-after: avoid; | ||
page-break-after: avoid; | |||
} | } | ||
.article-description, | .article-description, | ||
.article-reflection, | .article-reflection, | ||
Line 242: | Line 245: | ||
letter-spacing: 0.8px; | letter-spacing: 0.8px; | ||
margin-top: 0 !important; | margin-top: 0 !important; | ||
padding: 0 !important; | padding: 0 0 11px 0 !important; | ||
/* let long content flow normally; avoid hard blocking */ | /* let long content flow normally; avoid hard blocking */ | ||
page-break-inside: auto; break-inside: auto; | page-break-inside: auto; | ||
break-inside: auto; | |||
/* hairline | /* draw hairline below each section body */ | ||
background-image: | border-bottom: none; | ||
background-image: linear-gradient(#000, #000); | |||
background-repeat: no-repeat; | |||
background-position: 0 100%; | |||
background-size: 100% 0.5px; | |||
} | } | ||
/* | /* Don’t allow a break BEFORE the first block following each label */ | ||
.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: avoid; page-break-before: avoid; | break-before: avoid; | ||
page-break-before: avoid; | |||
} | } | ||
/* | /* Gentle control on widows/orphans globally */ | ||
#article-content { orphans: 2; widows: 2; } | #article-content { orphans: 2; widows: 2; } | ||
/* | /* --- 12) Link handling for print --- */ | ||
a[href]:after { content: none !important; } /* no raw URL echo */ | |||
.article-external-reference a { | |||
word-break: break-word; | |||
overflow-wrap: anywhere; | |||
text-decoration: none; | |||
color: #292828 !important; | |||
font-size: 17px; | |||
line-height: 1; | |||
letter-spacing: 0; | |||
} | |||
.article-quote { | .article-quote { | ||
font-size: 26px; | font-size: 26px; | ||
Line 270: | Line 289: | ||
letter-spacing: 1.2px; | letter-spacing: 1.2px; | ||
font-style: italic; | font-style: italic; | ||
margin-bottom: 7px!important; | |||
padding-bottom: 7px!important; | |||
} | |||
.article-mod-line{ | |||
margin-top:7px!important; | |||
padding-top: 7px!important; | |||
white-space:nowrap; | |||
color:grey; | |||
line-height:1; | |||
font-size:14px; | |||
letter-spacing:0.5px; | |||
margin:0; padding:0; | |||
text-indent:35px; | |||
} | } | ||
.article-mod-line { | .article-mod-line > span{ | ||
display:inline; | |||
margin:0; padding:0; | |||
} | } | ||
.article-mod-line > span + span{ margin-left:6px; } | |||
.article-mod-line > span + span { margin-left: 6px | |||
.article-modification-date { | |||
font-size:15px; | |||
.article- | letter-spacing:0.5px; | ||
margin:0; padding:0; | |||
} | } | ||
/* | /* wrappers: no internal spacing, only add gap if a wrapper actually exists */ | ||
.print-sec { margin: 0; padding: 0; } | |||
. | .print-sec + .print-sec { margin-top: 6mm; } /* tune spacing */ | ||
. | |||
. | /* make sure the label/content inside a wrapper don’t add surprise margins */ | ||
. | .print-sec > * { margin: 0; padding: 0; } | ||
. | |||
/* optional: draw your “hairline” only on wrappers that exist */ | |||
background- | .print-sec { | ||
border-bottom: none; | |||
padding-bottom: | background-image: linear-gradient(#000, #000); | ||
background-repeat: no-repeat; | |||
background-position: 0 100%; | |||
background-size: 100% 0.5px; | |||
padding-bottom: 7px; /* room for the hairline; adjust if you like */ | |||
} | } | ||
/* avoid extra gap above the first .print-sec after metadata/images */ | |||
.article-metadata + .print-sec, | |||
.article-images + .print-sec { margin-top: 4mm; } | |||
/* hide empty caption if no text sneaks in */ | |||
.caption-image1:empty { display: none; } |