Maybe a stupid question

[Charango-Chile]

Hi everyone,

I don't know how to change the fontsize of a portion of a revealjs presentation or how to define modifiers in the css to do so. The only option that remotely resembles this is the use of small in the YAML, however this is applied to the whole presentation.

The need arises because sometimes it is just needed to reduce a bit the text so it fits within one slide without having to create a separate one for one or two lines.

Many thanks in advance if someone can point me in the right direction, it is very likely that I'm doing something wrong. Just probably too used to Xaringan, and with quarto things are definitely different to what I was used to.

Cheers, Jose

[jjallaire]

You can use the .smaller class to make the text on a single slide smaller: https://quarto.org/docs/presentations/revealjs/index.html#content-overflow

[jjallaire]

Yes, you could create some CSS classes for different sizes and then use markdown spans to apply them. For example:

[this text should be very small]{.verysmall}

Then define .verysmall in your CSS file to have whatever font-size you want.

[Charango-Chile]

Many thanks for the answer... Giving it a go right now.

Cheers, Jose

[Charango-Chile]

Hi,

If definitely works as intended for text. How would this needed to be tweaked in order to work with a bullet point list?

For example, let us suppose that I have defined the following in my customised scss file .footnotesize {font-size: 90%}. By using the technique mentioned by @jjallaire we can then reduce fontzise in a piece of text by doing [Text to be shrinked]{.footnotesize} and it works as intended, however if doing the same on a list, then it causes trouble. For example:

[* Item 1
* Item 2
*Item 3]{.footnotesize}

reduces the size for the lines, but does not show them as itemized list. If doing something like this:

[
* Item 1
* Item 2
*Item 3]{.footnotesize}

Then it does not show anything... And other combinations for placement of the opening and closing [, ] are equally unnefective

Has anyone tried to do something like this before?

The use case is when you have a list on slides and you are just short of space and do not want to start a new slide just for the missing part, hence an option is to reduce the whole list by just a little...

Many thanks in advance,

Jose

[jjallaire]

For blocks you can use the div syntax:

::: {.footnotesize}
* Item 1
* Item 2
* Item 3
:::

[Charango-Chile]

Hi,

Many thanks for the response. This definitely makes everything work OK with the lists and changing the font size.

Cheers, Jose