Author

Oren Bochman

Published

Saturday, January 20, 2024

Quarto ๐Ÿ’– Bootstrap ๐Ÿ˜

  • Quarto HTML pages and dashboards are built using bootstrap.
  • Quato themes are also based on bootstrap,
  • Quarto also supports pandoc for div and spans.

Thus it is possible to pop bootstrap css into divs and spans and get formatting using bootstrap.

It is also possible to create bootstrap components by structuring markdown with the appropriate css and styling.

Cards

c.f. bootstrap documentation

basic card

Card image cap

Card title

Some quick example text to build on the card title and make up the bulk of the cardโ€™s content.

Card link Another link

Go somewhere

Using grid

Card image cap

Card title 1

Some quick example text to build on the card title and make up the bulk of the cardโ€™s content.

Card link Another link

Go somewhere

Card image cap

Card image cap

Card title 2

Some quick example text to build on the card title and make up the bulk of the cardโ€™s content.

Card link Another link

Go somewhere

Card image cap

Card image cap

Card title 3

Some quick example text to build on the card title and make up the bulk of the cardโ€™s content.

Card link Another link

Go somewhere

Card image cap

Trunctated text

Praeterea iter est quasdam res quas ex communi.

Praeterea iter est quasdam res quas ex communi.

Badges New Pill

Example heading New

this isnโ€™t visible using the light theme and only partially supported in the dark theme

Popover

span span

Citation

BibTeX citation:
@online{bochman2024,
  author = {Bochman, Oren},
  title = {Quarto ๐Ÿ’– {Bootstrap} ๐Ÿ˜},
  date = {2024-01-20},
  url = {https://orenbochman.github.io/posts/2024/2024-02-01-quarto_bootstrap/card.html},
  langid = {en}
}
For attribution, please cite this work as:
Bochman, Oren. 2024. โ€œQuarto ๐Ÿ’– Bootstrap ๐Ÿ˜.โ€ January 20, 2024. https://orenbochman.github.io/posts/2024/2024-02-01-quarto_bootstrap/card.html.