xref: /template/ad-hominem/css/print.less (revision f4bf03fc197812866e92fb080d6180bfa0853131) 
1/**
2 * This contains the print layouts and styles
3 * @author Sascha Leib <sascha@leib.be>
4 */
5
6@page { margin: 2cm 4cm 3cm 2.5cm; }
7
8.noprint,
9.wrap_noprint {
10	display: none !important;
11}
12.nobreak,
13.wrap_nobreak {
14	white-space:	nowrap !important;
15}
16.printonly,
17.print-only,
18.wrap_print-only {
19	display: initial;
20}
21
22html, body, * {
23	font-family: @ini_print_default_fonts;
24	margin: 0;
25	padding: 0;
26	background-color: transparent;
27}
28
29body {
30	font-size: 12pt;
31	box-decoration-break: clone;
32}
33
34/* hide unneded page elements */
35#globalTools, #phSearch, #phTools, #phTools,
36#sidebar, #toc, #navYouAreHere,
37#footer-layout .ftSection {
38	display: none;
39}
40#header-layout {
41	display: table-header-group;
42	padding-bottom: .25em;
43	margin-bottom: 1em;
44}
45#header-layout > header {
46	display: block;
47	padding-bottom: .25em;
48	border-bottom: #000 solid .5pt;
49	margin-bottom: 1em;
50}
51#siteLogo {
52	display: grid;
53	grid-template-columns: min-content max-content auto;
54	align-items: center;
55}
56#siteLogo .logo {
57	grid-row: 1;
58}
59#siteLogo .logo img {
60	width: 12pt;
61	height: auto;
62}
63#siteLogo .title {
64	font-size: 10pt;
65	line-height: 1.2em;
66	font-weight: bold;
67}
68#siteLogo .title a:link,
69#siteLogo .title a:visited {
70	font-family: @ini_print_title_fonts;
71	color: @ini_print_title_color;
72	text-decoration: none;
73}
74#siteLogo .claim {
75	grid-row: 1; grid-column: 3;
76	align-self: center;
77	max-width: 100%;
78	font-size: 10pt;
79	line-height: 1.2em;
80}
81
82#header-layout #phInclude {
83	display: none;
84}
85
86#main-layout {
87	padding-top: .5em;
88	display: table-row-group;
89}
90
91#footer-layout {
92	display: block;
93	padding-top: 0;
94}
95#footer-layout footer {
96	display: block;
97	width: auto;
98}
99
100/* reset main borders and margins: */
101main {
102	display: table-row-group;
103	padding: 0;
104	border-width: 0;
105	line-height: 1.5em;
106	border: none 0;
107	word-break: break-word;
108	-moz-box-shadow: 0 0 0 0 transparent;
109	-webkit-box-shadow: 0 0 0 0 transparent;
110	box-shadow: 0 0 0 0 transparent;
111}
112
113/* headlines */
114main h1, main h2, main h3, main h4, main h5, main h6 {
115	font-family: @ini_print_title_fonts;
116	color: @ini_print_title_color;
117	line-height: 1.2em;
118	margin: 1em 0 .5em 0;
119	padding: 0 0 .25em 0;
120	break-inside: avoid;
121	page-break-inside: avoid;
122	break-after: avoid;
123	page-break-after: avoid;
124	clear: both;
125	position: relative;
126}
127main h1 { font-size: 18pt; margin-bottom: .5em; }
128main h2 { font-size: 14pt; margin-top: 2em; }
129main h3 { font-size: 12pt; }
130main h4 { font-size: 12pt; font-style: italic; }
131main h5 { font-size: 12pt; font-weight: normal; font-style: italic; }
132main h6 { font-size: 11pt; font-weight: normal; font-style: italic; }
133
134main h1 + div, main h2 + div, main h3 + div, main h4 + div, main h5 + div, main h6 + div {
135	page-break-before: avoid;
136	break-before: avoid;
137}
138
139/* paragraph-level blocks */
140main p, main ul, main ol {
141	margin: .5em 0;
142}
143main p, main li {
144	widows: 2;
145	orphans: 2;
146	word-wrap: break-word;
147	overflow-wrap: break-word;
148	hyphens: auto;
149	-ms-hyphens: auto;
150	-moz-hyphens: auto;
151	-webkit-hyphens: auto;
152	hyphenate-limit-chars: 6 2 3;
153}
154main ul { list-style: square outside; }
155main ul ul { list-style-type: disc; }
156main ul ul ul { list-style-type: none; }
157main ol { list-style: decimal outside; }
158main ul ul ul li {margin-left: 1em; }
159main ul ul ul li:before { display: block; content: '\2043'; text-align:center; float: left; width: 1em; margin-left: -1em; }
160main ul ul ul ul li:before { content: '\FE63' }
161main ul ul ul ul ul li:before { content: '\00B7' }
162
163main ol ol { list-style-type: lower-alpha; }
164main ol ol ol { list-style-type: lower-roman; }
165main ol ol ol ol { list-style-type: lower-greek; }
166main ol ol ol ol ol { list-style-type: decimal-leading-zero; }
167main ul ul ul ol li { margin-left: 0; }
168main ul ul ul ol li:before { display: none; content: ''; }
169
170main li {
171	margin-left: 1.5em;
172}
173main blockquote {
174	border-left: @ini_blockquote solid 3pt;
175	padding: .25em 0 .25em .5em;
176	margin: 0 .25em 1em .25em;
177	widows: 2;
178	orphans: 2;
179	hyphens: auto;
180}
181main pre {
182	white-space: normal;
183}
184main figure {
185	break-inside: avoid;
186	page-break-inside: avoid;
187	background-color: transparent;
188	border: #666 solid .5pt;
189	margin: .5em 0;
190}
191main figure figcaption {
192	font-family: @ini_print_title_fonts;
193	margin-top: .5em;
194	font-size: small;
195	text-align: left;
196}
197main figure figcaption p,
198main figure figcaption li {
199	font-family: @ini_print_title_fonts;
200}
201body.print-compact main figure figcaption p {
202	text-indent: 0;
203}
204body.print-compact main figure table {
205	max-width: 100%;
206	border: #000 solid .5pt;
207}
208main footer {
209	margin-top: 2em;
210	border-top: #000 solid .5pt;
211	page-break-before: avoid;
212	break-before: avoid;
213}
214main footer p.docInfo,
215body.print-compact main p.docInfo {
216	display: block;
217	border: none;
218	padding: 0;
219	text-align: right;
220	color: #000;
221}
222#ftLicenseButtons p.license {
223	color: #000;
224}
225
226/* links overrides */
227main a:link,
228main a:visited {
229	text-decoration: underline;
230	text-decoration-style: dotted;
231}
232main a:link.text-link,
233main a:visited.text-link {
234	color: #000;
235}
236
237/* add URL after external links - optional!
238main a.interwiki:after,
239main a.urlextern:after {
240  content: ' <' attr(href) '>';
241  font-size: 90%;
242  color: #333;
243} */
244
245/* fixed-width elements: */
246main tt, main blockquote tt,
247main code, main blockquote code {
248	font-family:	@ini_mono_fonts;
249}
250
251/* text attributes */
252main s {
253	text-decoration: line-through rgba(255,0,0,0.5) solid 1pt;
254	-webkit-text-decoration: line-through rgba(255,0,0,0.5) solid 1pt;
255}
256main u {
257	-webkit-text-decoration-color: @ini_missing;
258	-webkit-text-decoration-line: underline;
259	-webkit-text-decoration-style: wavy;
260	-webkit-text-decoration-thickness: .7pt;
261	text-decoration: underline @ini_missing wavy .7pt;
262}
263main u.valid {
264	-webkit-text-decoration-color: @ini_existing;
265	text-decoration-color: @ini_existing;
266	text-decoration-style: dashed;
267}
268main abbr {
269	text-decoration: none;
270	font-size: 97%;
271	letter-spacing: .05em;
272}
273
274/* horizontal rules */
275main hr {
276	border: #000 solid 0;
277	border-top-width: 1pt;
278	height: 0;
279	margin: 3pt 0;
280}
281
282/* table styles */
283main table {
284	max-width: 100%;
285	border: #000 solid .5pt;
286	border-collapse: collapse;
287	line-height: 1.25em;
288	margin: .5em 0;
289	box-decoration-break: clone;
290	page-break-inside: avoid;
291	break-inside: avoid;
292	font-size: small;
293}
294main table td,
295main table th {
296	padding: 2pt 3pt;
297	vertical-align: top;
298}
299main table th,
300main table th * {
301	font-family: @ini_print_title_fonts;
302	color: @ini_print_title_color;
303}
304main table thead {
305	break-inside: avoid;
306	break-after: avoid;
307}
308main table thead tr {
309	background-color: #EEE;
310	border-bottom: #000 solid .5pt;
311	text-align: left;
312}
313main table thead tr th,
314main table thead tr td {
315	vertical-align: bottom;
316	border-right: #000 solid .5pt;
317}
318main table thead tr th:last-child,
319main table thead tr td:last-child {
320	border-right: none 0;
321}
322main table tbody tr {
323	border-bottom: #000 dashed .5pt;
324}
325main table tbody tr:nth-child(even) {
326	background-color: #EEE;
327}
328main table tbody th {
329	vertical-align: top;
330	border-right: #000 solid .5pt;
331}
332main table tbody td {
333	border-right: #000 dashed .5pt;
334}
335main table a:link {
336	text-decoration: none;
337}
338
339main table.layout,
340main table.layout tr,
341main table.layout th,
342main table.layout td {
343	border: none !important;
344	background: transparent none !important;
345}
346
347main blockquote table {
348	margin: 0;
349}
350
351/* image-related */
352main aside {
353	float: none;
354	width: 100%;
355	margin: .5em 0;
356	text-align: center;
357	font-size: smaller;
358	page-break-inside: avoid;
359	break-inside: avoid;
360	font-size: small;
361	line-height: 1.5em;
362}
363main img {
364	width: auto;
365	max-width: 100%;
366	height: auto;
367	break-inside: avoid;
368	page-break-inside: avoid;
369}
370
371/* alternative compact style: */
372body.print-compact #main-content {
373	columns: 2;
374	column-gap: 1.2em;
375	column-rule: .25pt solid #666;
376	font-size: 11pt;
377}
378body.print-compact main h1,
379body.print-compact main h2,
380body.print-compact main figure {
381	column-span: all;
382}
383body.print-compact main figure.print-narrow {
384	column-span: none;
385}
386
387#main-content h1 + div > p:first-child {
388	column-span: all;
389	font-weight: 600;
390	margin-bottom: 1.5em;
391	text-indent: 0;
392}
393
394body.print-compact main p {
395	margin: 0;
396	text-align: justify;
397	text-indent: 1.5em;
398}
399body.print-compact main h1 + div > p:first-child + p,
400body.print-compact main h2 + div > p:first-child,
401body.print-compact main h3 + div > p:first-child,
402body.print-compact main h4 + div > p:first-child,
403body.print-compact main h5 + div > p:first-child,
404body.print-compact main h6 + div > p:first-child,
405body.print-compact main figure + p + p,
406body.print-compact main div.table + p,
407body.print-compact main aside + p + p,
408body.print-compact main ul + p,
409body.print-compact main ol + p,
410body.print-compact main blockquote + p,
411body.print-compact main p.info-box,
412body.print-compact main p.info-box + p + p {
413	text-indent: 0;
414}
415
416body.print-compact main table {
417	border: none;
418}
419body.print-compact main figure {
420	border: none;
421	margin: 1em 0 .5em 0;
422	padding: .5em 0;
423}
424body.print-compact main blockquote {
425	margin: .5em 0;
426	padding: 0 0 0 .5em;
427}
428body.print-compact main figure blockquote {
429	margin: 0;
430}
431body.print-compact main p.info-box {
432	margin: .5em 0;
433}
434body.print-compact main ul,
435body.print-compact main ol {
436	margin-left: .5em;
437	margin: 0;
438	padding: 0;
439	list-style-position: inside;
440}
441body.print-compact main ul > li,
442body.print-compact main ol > li {
443	margin-left: 0;
444}
445body.print-compact main ul ul,
446body.print-compact main ul ol,
447body.print-compact main ol ul,
448body.print-compact main ol ol,
449body.print-compact main ul ul li,
450body.print-compact main ul ol li,
451body.print-compact main ol ul li,
452body.print-compact main ol ol li {
453	margin-left: .5em;
454}
455body.print-compact main ul li::marker,
456body.print-compact main ol li::marker {
457	display: inline-block;
458	float: none;
459}
460body.print-compact main ul li div.li,
461body.print-compact main ol li div.li {
462	display: inline;
463}
464body.print-compact main ul div.li,
465body.print-compact main ol div.li {
466	text-align: justify;
467}
468/* media detail */
469body.mediadetail figure {
470	border: none;
471	background:	transparent none;
472}
473body.mediadetail figure table ul {
474	margin: 0;
475}
476
477/* allow user to force keep-together rules: */
478.keep-together,
479.wrap_keep-together {
480	page-break-inside: avoid;
481	break-inside: avoid;
482}
483.break-before,
484.wrap_break-before {
485	page-break-before: always;
486	break-before: always;
487}
488.print-wide,
489.wrap_print-wide {
490	clear: both;
491	column-span: all;
492}
493.print-outline {
494	margin-top: 1em;
495	border: #666 solid .5pt;
496	border-radius:	1em;
497	padding: 0 1em;
498}
499
500/* site-banners */
501.site-banner {
502	clear: both;
503	column-span: all;
504	margin-top: 1em;
505	border: #666 solid 1pt;
506	border-radius: 1em;
507	padding: 0 1em;
508	page-break-inside: avoid;
509	break-inside: avoid;
510	text-align: left;
511}
512.site-banner h4 {
513	margin: .75em 0 .15em 0;
514	font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
515	font-size: 11pt;
516	font-style: normal;
517}
518.site-banner p {
519	font-size: 9pt;
520	line-height: 13pt;
521}
522.site-banner img {
523	margin: 0 .25em .25em .5em;
524}
525
526/* boxes */
527main .info-box,
528main .wrap_info-box {
529	border: #666 solid 1px;
530	background-color: @ini_background_alt;
531	padding: .5em .25em .5em .5em;
532	font-size: small;
533	line-height: 1.5em;
534}
535
536main aside.info-box,
537main aside .wrap_info-box {
538	border: none;
539	background-color: transparent;
540}
541