Callout boxes for markdown output

[linogaliana]

Hi !

• In the doc about callouts (https://quarto.org/docs/authoring/callouts.html), markdown is not part of the supported format. Since it is possible to embed html blocks within .md, would it be possible to add markdown to the supported format ?

• I suppose this means adding something based on _quarto.format.isMarkdownOutput() to the list of supported formats :

quarto-cli/src/resources/filters/quarto-pre/callout.lua

Lines 60 to 61 in 852c9bb

	if _quarto.format.isHtmlOutput() and hasBootstrap() then
	return calloutDiv(div)

• I guess this should be far easier than Callout boxes for ipynb output #1167 since in my mind this could really be the same output than the HTML version (return calloutDiv(div)).

• Please tell me if I don't see some drawbacks (I am unfamiliar with lua so might miss some difficulties)

[cderv]

Since it is possible to embed html blocks within .md

Callouts for HTML requires requires Bootstrap for styling. With markdown outputs, you can't really add styling for the callouts. Often styling will depend of the previewer of renderer of Markdown to HTML. Callouts in GFM won't work for example.

How do you see things regarding inserting HTML blocks requiring an external lib like bootstrap in a markdown file ?
I am wondering the use case that lead to this question.

[linogaliana]

Hi Christophe !

In my Python website that is based on quarto (qmd -> md) and hugo (md -> html) , I use wowchemy theme. Two years ago, I added a Hugo shortcode to generate callouts.

For instance,

https://github.com/linogaliana/python-datascientist/blob/2efce7829f717055932b5ce4966de328b07b38c6/content/course/manipulation/02a_pandas_tutorial/index.qmd#L80-L116

generates this box in https://pythonds.linogaliana.fr/pandas/ :

Using a custom hugo shortcode works fine now but is not really clever in terms of maintenance and is hugo relevant (while one of the great advantage of quarto in my opinion is the way it handles with the same source code multiple output). Since quarto callouts seem to follow exactly the same principle (given minimal change in the structure of the callout arguments), I was thinking that my custom shortcode reinvents the wheel.

Regarding your question, I suppose that my hugo theme handles bootstrap. I suppose this is the case of most hugo themes, am I right ?

[Aariq]

Github-flavored markdown seems to support callouts like

>[!NOTE]
> a note

>[!WARNING]
>  a warning

>[!IMPORTANT]
> something important

Note

a note

Warning

a warning

Important

something important

It would be nice if the corresponding callouts in Quarto were translated to this upon rendering to gfm

[cscheid]

That's a good idea, and shouldn't be too hard for us to do since 1.3. Let's open a new issue to track

[cscheid]

Tracking here: #6935

[cderv]

Really cool ! I did not know that. Thanks for sharing !

It seems it is still in Beta so it would probably be worth waiting for stability

• https://github.com/orgs/community/discussions/16925

[Aariq]

I can't take full credit for this—I found out about this feature from Don McCurdy on the fediverse: https://fosstodon.org/@donmccurdy/111103471765920844

[mcanouil]

Closing in favour of:

• Callout rendering in gfm #6935