alder-ui demos

al-alert

A message box. Write role="alert" (warning, destructive) or role="status" (info, success) yourself: CSS cannot add a role. heading is drawn as the heading. dismissible makes room for the close button that the optional al-alert.js module adds.

Variants

Comments are moderated before they appear. Your post is live. Leaving this page discards your draft. The title must not be empty.

Holding a form's errors

An alert whose only child is an empty ul.errors is not drawn (Alder's <al-alert variant="destructive"><Errors form /></al-alert> before any error). Below: the empty one (hidden), then one with an error.

    • That slug is taken.

    Without a heading

    The default variant is info.

    Dismissible (with al-alert.js)

    Close me with the button.