Skip to content

Add styled alerts to markdown#13079

Open
Hiviexd wants to merge 1 commit into
ppy:masterfrom
Hiviexd:markdown-styled-alerts
Open

Add styled alerts to markdown#13079
Hiviexd wants to merge 1 commit into
ppy:masterfrom
Hiviexd:markdown-styled-alerts

Conversation

@Hiviexd

@Hiviexd Hiviexd commented Jun 18, 2026

Copy link
Copy Markdown
Member

Resolves #13064 (with applied feedback from #osu-wiki)

Enabled for wiki and news.

Also supports an inline variant per wiki maintainer request.

Preview image
Initial implementation commentary

initial implementation used the GitHub custom syntax detailed in the linked issue via a custom parser. after a conversation with clayton and Wala in #osu-wiki (link), we decided it would be best to rework this using existing syntax of CustomContainerInline (similar to flags), and let CSS selectors do the heavy lifting, which eliminates the need of custom parsers altogether.

finalized syntax is the following:

> ::{alert=caution}:: **Caution**
> This is *critical* content demanding of the user's attention.

this results in an alert.
image

> ::{alert=note}:: **See also:** [Ranking criteria](/wiki/Ranking_criteria) and [Beatmap ranking procedure](/wiki/Beatmap_ranking_procedure)

this results in an inline alert.
image


Available styleblock attributes are:

  • ::: alert-note
  • ::: alert-tip
  • ::: alert-notice
  • ::: alert-warning
  • ::: alert-caution

Syntax is the following:

::: alert-note
**See also:** [Ranking criteria](/wiki/Ranking_criteria)
:::

This results in an inline/compact alert.
image

::: alert-caution
**Caution**
This is *critical* content demanding of the user's attention.
:::

This results in a regular alert.
image

@Hiviexd Hiviexd force-pushed the markdown-styled-alerts branch from bde7146 to 2b3ea14 Compare June 19, 2026 00:13
@notbakaneko notbakaneko self-requested a review June 29, 2026 09:52

@notbakaneko notbakaneko left a comment

Copy link
Copy Markdown
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You can whitelist extra attributes in attributes_allowed and add attributes to blockquotes:

{data-alert=note}
> **line1**
> line2

custom inline containers are for customizing the rendering of inline elements, not abusing to make a block level element behave differently.

There's also the existing style block syntax for infoboxes that can be extended to support more customization:

::: Someotherclass
alert
:::

@notbakaneko

Copy link
Copy Markdown
Collaborator

There's also the argument that blockquote shouldn't be used for things that aren't quotes, this is more like a div with a left border

@Hiviexd Hiviexd force-pushed the markdown-styled-alerts branch 2 times, most recently from 69d502f to 47937a5 Compare June 30, 2026 17:52
@Hiviexd Hiviexd force-pushed the markdown-styled-alerts branch from fff41ba to f332aa7 Compare June 30, 2026 18:05
@Hiviexd

Hiviexd commented Jun 30, 2026

Copy link
Copy Markdown
Member Author

went all in with style blocks, see PR description for the syntax I chose.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Add styled alerts to wiki markdown

2 participants