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