Menu
I often have code samples in reveal.js slide decks that span quite many lines.
Take for instance the markdown code as example:
---
title: "Long and silly code"
author: "Yours truly"
---
```python
print('1')
print('2')
print('fizz')
print('4')
print('buzz')
print('fizz')
print('7')
print('8')
print('fizz')
print('buzz')
print('11')
print('fizz')
print('13')
print('14')
print('fizzbuzz')
print('16')
print('17')
```
Once rendered, it will look like this, with a scroll bar:
The code block seems to always have a max height, and past a certain number of lines a scrollbar appears, even though I'd prefer just a larger box.
I have not yet figured out how to make the box larger both vertically and horizontally so to fill the available slide area rather than scrolling: I have no interest in pausing my presentation to scroll with the mouse just to show more code!
Does anybody have suggestions?
973
The css provided by Reveal.js seems responsible for the vertical limit. Hence it seems you have no choice, but to tweak the css yourself.
For example, modify the file css/reveal.css (and regenerate css/reveal.min.css).
Or you could try to override this value with an additional theme you would provide. For example, copy css/theme/default.css to css/theme/mine.css, define the style you want for the code blocks, and link to this file in the <head> of your .html presentation file.
61
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
