marp-team / marp-core

The core of Marp converter
MIT License
789 stars 132 forks source link

How to do autofit so content won't be cropped off? #128

Closed gpenghe closed 4 years ago

gpenghe commented 4 years ago

Firstly thanks for developing this great tool. I just started using it and it's fantastic. The real time previewing in VS Code is like nothing I've seen before :)

In my first test, one slide is not able to hold all the content. I am wondering if Marp can scale the result to fit all content into one page. (I don't mind the text font will be smaller.)

I've tried to use the following options.

theme: enable-all-auto-scaling
auto-scaling: true   

I can see the code block is scaled. But the text lines are still overflown.

yhatt commented 4 years ago

I appreciate you using our ecosystem. Unfortunately, we have not auto-scaling directive for the whole of page contents.

But you could try to tweak style manually for the best font size.

<style scoped>section { font-size: 20px; }</style>

<style scoped> can change font size in the whole of only current page so would be help to fix cropped slide.

gpenghe commented 4 years ago

Wow, it works like a charm. Thank you very much.

Now that the content fits in a single slide. Then it comes to the question of whether there's a way to put content to two columns. But maybe I'd better submit a new question for that.

BTW, do you have plan to add feature for auto-scaling for the whole page? I haven't taken a look at Marp code yet, but would like to see if I can contribute in some ways.

yhatt commented 4 years ago

We have no plan of auto-scaling for the slide because HTML and web platform does not have better layout system usable for scaling. Marp's auto scaling features are limited to some elements.

If you are using Mac, Deckset would help you to scale the content of slide automatically (Mac has a rich layout system like Core Text to suit to auto layout).