orzih / mkdocs-with-pdf

Generate a single PDF file from MkDocs repository.
MIT License
332 stars 77 forks source link

How to increase font-size for text and headings? #51

Open alexander-matthiesen opened 3 years ago

alexander-matthiesen commented 3 years ago

How can the font size be increased globally? Especially the headings are pretty small when there are h5 or h6 headings.

orzih commented 3 years ago

Hi @alexander-matthiesen.

Are you using a material theme? See material theme's default.

e.g. try adding the following to your custom CSS:

@media print {
  .md-typeset {
    font-size: 0.8rem !important;
  }
  .md-typeset h4,
  .md-typeset h5,
  .md-typeset h6 {
    font-size: 1rem;
  }
}
giswa commented 3 years ago

Got the exact opposite : everything is way too big except TOC. Tried extra-sass plugin from this sample repo without luck https://github.com/orzih/mkdocs-with-pdf/tree/master/samples/mkdocs-material

Bildschirmfoto 2021-05-09 um 20 37 32
giswa commented 3 years ago

FInally got it all good using the docker images provided here : dockerfile (I was using image from dockerhub : hellt/mkdocs-material-apline-docker which uses python2.7 )

DanielFichtner commented 2 years ago

I seem to have the same problem. It simply does not overwrite any of the font sizes with the custom CSS styles.scss in a folder templates in mkdocs root.

StefanSchroeder commented 2 years ago

I have the same problem. Fonts are too big. I tried the solution suggested by @orzih above, it didn't help. I also tried the suggestion in the documentation to enable debug output and examine the HTML. But I am not sure what I am looking for.

Tip: setting the debug_html option to true to get the generated html that is passed to weasyprint can help you determine the html tags, classes or identifiers you want to modify in your stylesheet.

I can see in the debug output that my styles.scss was evaluated, but to no effect. @DanielFichtner did you find a solution?

DanielFichtner commented 2 years ago

@StefanSchroeder well I just went directly into the source code and edited everything I needed in there. It's all still open source :) It's a little bit more complicated but if you know your way around you get it done:

StefanSchroeder commented 2 years ago

@DanielFichtner NIce. I actually was able to fix the font adjustment using a stylesheet only. It took me a while to figure out the right tag-names, appropriate units and filename for the stylesheet. For the record: I created a folder "templates" on the top-level that contains a file "styles.scss" that contains CSS.

Works on my machine.

The CSS:

@media print { .md-typeset { font-size: 9pt !important; } .md-typeset h1, .md-typeset h2, .md-typeset h3, .md-typeset h4, .md-typeset h5, .md-typeset h6 { font-size: 12pt; } }