BookStack Code Mirror - bookstack/blob - resources/sass/export-styles.scss

   1 @use "sass:math";
   2 @import "variables";
   3 @import "mixins";
   4 @import "html";
   5 @import "text";
   6 @import "tables";
   7 @import "content";
   8
   9 html, body {
  10   background-color: #FFF;
  11 }
  12
  13 body {
  14   font-family: 'DejaVu Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", "Oxygen", "Ubuntu", "Roboto", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
  15   margin: 0;
  16   padding: 0;
  17   display: block;
  18 }
  19
  20 table {
  21   border-spacing: 0;
  22   border-collapse: collapse;
  23 }
  24
  25 .page-content {
  26   overflow: hidden;
  27 }
  28
  29 // Prevent code block overflow on export
  30 pre {
  31   padding-left: 12px;
  32 }
  33 pre:before {
  34   display: none;
  35 }
  36 pre code {
  37   white-space: pre-wrap;
  38 }
  39
  40 .page-break {
  41   page-break-after: always;
  42 }
  43 @media screen {
  44   .page-break {
  45     border-top: 1px solid #DDD;
  46   }
  47 }
  48
  49 ul.contents ul li {
  50   list-style: circle;
  51 }
  52
  53 .chapter-hint {
  54   color: #888;
  55   margin-top: 32px;
  56 }
  57 .chapter-hint + h1 {
  58   margin-top: 0;
  59 }
  60
  61 // PDF specific overrides
  62 body.export-format-pdf {
  63   font-size: 14px;
  64   line-height: 1.2;
  65
  66   h1, h2, h3, h4, h5, h6 {
  67     line-height: 1.2;
  68   }
  69
  70   table {
  71     max-width: 800px !important;
  72     font-size: 0.8em;
  73     width: 100% !important;
  74   }
  75
  76   table td {
  77     width: auto !important;
  78   }
  79
  80   .page-content .float {
  81     float: none !important;
  82   }
  83
  84   .page-content img.align-left, .page-content img.align-right  {
  85     float: none !important;
  86     clear: both;
  87     display: block;
  88   }
  89
  90 }
  91
  92 // DOMPDF pdf export specific overrides
  93 body.export-format-pdf.export-engine-dompdf {
  94   // Fix for full width linked image sizes on DOMPDF
  95   .page-content a > img {
  96     max-width: 700px;
  97   }
  98   // Undoes the above for table images to prevent visually worse scenario, Awaiting next DOMPDF release for patch
  99   .page-content td a > img {
 100     max-width: 100%;
 101   }
 102 }