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, 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 page-break-inside: avoid; 121 break-inside: avoid; 122 page-break-after: avoid; 123 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 134/* workaround: force headlines to keep with the next paragraph: */ 135main h1::after, main h2::after, main h3::after, main h4::after, main h5::after, main h6::after, 136main dl:not(.compact) dt::after { 137 content: ''; 138 display: block; 139 height: 4.5em; 140 margin-bottom: -4.5em; 141 page-break-inside: avoid; 142 break-inside: avoid; 143} 144 145main h1 + div, main h2 + div, main h3 + div, main h4 + div, main h5 + div, main h6 + div { 146 page-break-before: avoid; 147 break-before: avoid; 148} 149 150/* paragraph-level blocks */ 151main p, main ul, main ol { 152 margin: .5em 0; 153} 154main p, main li { 155 widows: 2; 156 orphans: 2; 157 word-wrap: break-word; 158 overflow-wrap: break-word; 159 hyphens: auto; 160 -ms-hyphens: auto; 161 -moz-hyphens: auto; 162 -webkit-hyphens: auto; 163 hyphenate-limit-chars: 6 2 3; 164} 165main ul { list-style: square outside; } 166main ul ul { list-style-type: disc; } 167main ul ul ul { list-style-type: none; } 168main ol { list-style: decimal outside; } 169main ul ul ul li {margin-left: 1em; } 170main ul ul ul li:before { display: block; content: '\2043'; text-align:center; float: left; width: 1em; margin-left: -1em; } 171main ul ul ul ul li:before { content: '\FE63' } 172main ul ul ul ul ul li:before { content: '\00B7' } 173 174main ol ol { list-style-type: lower-alpha; } 175main ol ol ol { list-style-type: lower-roman; } 176main ol ol ol ol { list-style-type: lower-greek; } 177main ol ol ol ol ol { list-style-type: decimal-leading-zero; } 178main ul ul ul ol li { margin-left: 0; } 179main ul ul ul ol li:before { display: none; content: ''; } 180 181main li { 182 margin-left: 1.5em; 183} 184main blockquote { 185 border-left: @ini_blockquote solid 3pt; 186 padding: .25em 0 .25em .5em; 187 margin: 0 .25em 1em .25em; 188 widows: 2; 189 orphans: 2; 190 hyphens: auto; 191} 192main pre { 193 white-space: normal; 194} 195main figure { 196 break-inside: avoid; 197 page-break-inside: avoid; 198 background-color: transparent; 199 border: #666 solid .5pt; 200 margin: .5em 0; 201} 202main figure figcaption { 203 font-family: @ini_print_title_fonts; 204 margin-top: .5em; 205 font-size: small; 206 text-align: left; 207} 208main figure figcaption p, 209main figure figcaption li { 210 font-family: @ini_print_title_fonts; 211} 212body.print-compact main figure figcaption p { 213 text-indent: 0; 214} 215body.print-compact main figure table { 216 max-width: 100%; 217 border: #000 solid .5pt; 218} 219main footer { 220 margin-top: 2em; 221 border-top: #000 solid .5pt; 222 page-break-before: avoid; 223 break-before: avoid; 224} 225main footer p.docInfo, 226body.print-compact main p.docInfo { 227 display: block; 228 border: none; 229 padding: 0; 230 text-align: right; 231 color: #000; 232} 233#ftLicenseButtons p.license { 234 color: #000; 235} 236 237/* links overrides */ 238main a:link, 239main a:visited { 240 text-decoration: underline; 241 text-decoration-style: dotted; 242} 243main a:link.text-link, 244main a:visited.text-link { 245 color: #000; 246} 247 248/* add URL after external links - optional! 249main a.interwiki:after, 250main a.urlextern:after { 251 content: ' <' attr(href) '>'; 252 font-size: 90%; 253 color: #333; 254} */ 255 256/* fixed-width elements: */ 257main tt, main code, main pre, 258main blockquote tt, main blockquote code, main blockquote pre { 259 font-family: @ini_mono_fonts; 260} 261 262/* text attributes */ 263main s { 264 text-decoration: line-through rgba(255,0,0,0.5) solid 1pt; 265 -webkit-text-decoration: line-through rgba(255,0,0,0.5) solid 1pt; 266} 267main u { 268 -webkit-text-decoration-color: @ini_missing; 269 -webkit-text-decoration-line: underline; 270 -webkit-text-decoration-style: wavy; 271 -webkit-text-decoration-thickness: .7pt; 272 text-decoration: underline @ini_missing wavy .7pt; 273} 274main u.valid { 275 -webkit-text-decoration-color: @ini_existing; 276 text-decoration-color: @ini_existing; 277 text-decoration-style: dashed; 278} 279main abbr { 280 text-decoration: none; 281 font-size: 97%; 282 letter-spacing: .05em; 283} 284 285/* horizontal rules */ 286main hr { 287 border: #000 solid 0; 288 border-top-width: 1pt; 289 height: 0; 290 margin: 3pt 0; 291} 292 293/* table styles */ 294main table { 295 max-width: 100%; 296 border: #000 solid .5pt; 297 border-collapse: collapse; 298 line-height: 1.25em; 299 margin: .5em 0; 300 box-decoration-break: clone; 301 page-break-inside: avoid; 302 break-inside: avoid; 303 font-size: small; 304} 305main table td, 306main table th { 307 padding: 2pt 3pt; 308 vertical-align: top; 309} 310main table th, 311main table th * { 312 font-family: @ini_print_title_fonts; 313 color: @ini_print_title_color; 314} 315main table thead { 316 break-inside: avoid; 317 break-after: avoid; 318} 319main table thead tr { 320 background-color: #EEE; 321 border-bottom: #000 solid .5pt; 322 text-align: left; 323} 324main table thead tr th, 325main table thead tr td { 326 vertical-align: bottom; 327 border-right: #000 solid .5pt; 328} 329main table thead tr th:last-child, 330main table thead tr td:last-child { 331 border-right: none 0; 332} 333main table tbody tr { 334 border-bottom: #000 dashed .5pt; 335} 336main table tbody tr:nth-child(even) { 337 background-color: #EEE; 338} 339main table tbody th { 340 vertical-align: top; 341 border-right: #000 solid .5pt; 342} 343main table tbody td { 344 border-right: #000 dashed .5pt; 345} 346main table a:link { 347 text-decoration: none; 348} 349 350main table.layout, 351main table.layout tr, 352main table.layout th, 353main table.layout td { 354 border: none !important; 355 background: transparent none !important; 356} 357 358main blockquote table { 359 margin: 0; 360} 361 362/* image-related */ 363main aside { 364 float: none; 365 width: 100%; 366 margin: .5em 0; 367 page-break-inside: avoid; 368 break-inside: avoid; 369} 370main img { 371 width: auto; 372 max-width: 100%; 373 height: auto; 374 break-inside: avoid; 375 page-break-inside: avoid; 376} 377 378/* footnotes */ 379main div.footnotes { 380 margin-top: 1.5em; 381 font-size: smaller; 382} 383main div.footnotes div.fn { 384 display: grid; 385 grid-template-columns: 1.5em auto; 386 grid-gap: .25em; 387} 388main div.footnotes div.fn > sup { 389 vertical-align: baseline; 390 font-size: smaller; 391 text-align: right; 392} 393 394main div.footnotes:before { 395 content: ' '; 396 display: block; 397 width: 33%; 398 min-width: 5em; 399 border-top: @ini_text solid .5pt; 400 height: .5em; 401} 402 403/* show language code, if configured as menu */ 404#tbLanguages { 405 & { 406 display: block; 407 float:right; 408 position: relative; 409 top: -1.5rem; 410 } 411 button { 412 & { 413 border: transparent none 0; 414 } 415 svg { 416 & { 417 fill: transparent; 418 stroke: #000; 419 stroke-width: .5pt; 420 width: 1.75rem; height: 1.75rem; 421 } 422 text { 423 fill: #000; 424 text-transform: uppercase; 425 font-family: Arial, Helvetica, Verdana, sans; 426 stroke-width: 0; 427 } 428 } 429 } 430} 431 432/* alternative compact style: */ 433body.print-compact #main-content { 434 columns: 2; 435 column-gap: 1.2em; 436 column-rule: .25pt solid #666; 437 font-size: 11pt; 438} 439body.print-compact main h1, 440body.print-compact main h2, 441body.print-compact main figure { 442 column-span: all; 443} 444body.print-compact main figure.print-narrow { 445 column-span: none; 446} 447 448#main-content h1 + div > p:first-child { 449 column-span: all; 450 font-weight: 600; 451 margin-bottom: 1.5em; 452 text-indent: 0; 453} 454 455body.print-compact main p { 456 margin: 0; 457 text-align: justify; 458 text-indent: 1.5em; 459} 460body.print-compact main h1 + div > p:first-child + p, 461body.print-compact main h2 + div > p:first-child, 462body.print-compact main h3 + div > p:first-child, 463body.print-compact main h4 + div > p:first-child, 464body.print-compact main h5 + div > p:first-child, 465body.print-compact main h6 + div > p:first-child, 466body.print-compact main figure + p + p, 467body.print-compact main div.table + p, 468body.print-compact main aside + p + p, 469body.print-compact main ul + p, 470body.print-compact main ol + p, 471body.print-compact main blockquote + p, 472body.print-compact main p.info-box, 473body.print-compact main p.info-box + p + p { 474 text-indent: 0; 475} 476 477body.print-compact main table { 478 border: none; 479} 480body.print-compact main figure { 481 border: none; 482 margin: 1em 0 .5em 0; 483 padding: .5em 0; 484} 485body.print-compact main blockquote { 486 margin: .5em 0; 487 padding: 0 0 0 .5em; 488} 489body.print-compact main figure blockquote { 490 margin: 0; 491} 492body.print-compact main p.info-box { 493 margin: .5em 0; 494} 495body.print-compact main ul, 496body.print-compact main ol { 497 margin-left: .5em; 498 margin: 0; 499 padding: 0; 500 list-style-position: inside; 501} 502body.print-compact main ul > li, 503body.print-compact main ol > li { 504 margin-left: 0; 505} 506body.print-compact main ul ul, 507body.print-compact main ul ol, 508body.print-compact main ol ul, 509body.print-compact main ol ol, 510body.print-compact main ul ul li, 511body.print-compact main ul ol li, 512body.print-compact main ol ul li, 513body.print-compact main ol ol li { 514 margin-left: .5em; 515} 516body.print-compact main ul li::marker, 517body.print-compact main ol li::marker { 518 display: inline-block; 519 float: none; 520} 521body.print-compact main ul li div.li, 522body.print-compact main ol li div.li { 523 display: inline; 524} 525body.print-compact main ul div.li, 526body.print-compact main ol div.li { 527 text-align: justify; 528} 529 530/* media detail */ 531body.mediadetail figure { 532 border: none; 533 background: transparent none; 534} 535body.mediadetail figure table ul { 536 margin: 0; 537} 538 539/* allow user to force keep-together rules: */ 540.keep-together, 541.wrap_keep-together { 542 page-break-inside: avoid; 543 break-inside: avoid; 544} 545.break-before, 546.wrap_break-before { 547 page-break-before: always; 548 break-before: always; 549} 550.print-wide, 551.wrap_print-wide { 552 clear: both; 553 column-span: all; 554} 555.print-outline { 556 margin-top: 1em; 557 border: #666 solid .5pt; 558 border-radius: 1em; 559 padding: 0 1em; 560} 561 562/* site-banners */ 563.site-banner { 564 clear: both; 565 column-span: all; 566 margin-top: 1em; 567 border: #666 solid 1pt; 568 border-radius: 1em; 569 padding: 0 1em; 570 page-break-inside: avoid; 571 break-inside: avoid; 572 text-align: left; 573} 574.site-banner h4 { 575 margin: .75em 0 .15em 0; 576 font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; 577 font-size: 11pt; 578 font-style: normal; 579} 580.site-banner p { 581 font-size: 9pt; 582 line-height: 13pt; 583} 584.site-banner img { 585 margin: 0 .25em .25em .5em; 586} 587 588/* boxes */ 589main .box, 590main .wrap_box { 591 border: #666 solid 1px; 592 background-color: @ini_background_alt; 593 padding: .5em .25em .5em .5em; 594 font-size: small; 595 line-height: 1.5em; 596} 597