Collapse-callout Example
View the source code by clicking
</> Code
on the top right corner.
Shafayet Khan Shafee
26 Oct, 2022
09 Feb, 2023
View the source code by clicking
</> Code
on the top right corner.
Note that there are five types of callouts, including: note
, warning
, important
, tip
, and caution
.
This is an example of a callout with a caption.
This is an example of a ‘folded’ caution callout that can be expanded by the user. You can use collapse="true"
to collapse it by default or collapse="false"
to make a collapsible callout that is expanded by default.
This is important and it is not collapsible, since we didn’t specify either true
or false
for important
in our YAML header.
WARNINGS !!!!
---
title: "Collapse-callout Example"
author: Shafayet Khan Shafee
date: "26 Oct, 2022"
date-modified: last-modified
date-format: "DD MMM, YYYY"
filters:
- collapse-callout
collapse-callout:
tip: true
note: false
warning: false
caution: true
callout-appearance: minimal
callout-icon: false
format:
html:
code-tools: true
self-contained: true
---
> View the source code by clicking `</> Code` on the top right corner.
## Callout Blocks
:::{.callout-note collapse='true'}
### Note
Note that there are five types of callouts, including:
`note`, `warning`, `important`, `tip`, and `caution`.
:::
:::{.callout-tip}
### Tip With Caption
This is an example of a callout with a caption.
:::
## More callout blocks
:::{.callout-caution}
## Expand To Learn About Collapse
This is an example of a 'folded' caution callout that can be expanded by the user. You can use `collapse="true"` to collapse it by default or `collapse="false"` to make a collapsible callout that is expanded by default.
:::
:::{.callout-important}
## Important
This is important and it is not collapsible, since we didn't specify either `true` or `false` for `important` in our YAML header.
:::
:::{.callout-warning icon='false' collapse='false'}
## warning
WARNINGS !!!!
:::