confirm.md

layout	title	section	h2
bffos	Confirm	building-blocks	<strong>Building Blocks:</strong> markup & examples

Confirm

A confirmation prompt is used to confirm an action or inform the user of an event. Confirmation prompts are frequently used to confirm tasks that cannot be undone, such as permanently deleting an item. Confirmation prompts are designed to disrupt tasks and, as a result, should be used sparingly.

Characteristics

• Confirmation prompts are currently modal - they occupy the entire screen, and require user input to close them.

A confirmation prompts consist of:

• Title (optional)
• Body
• Icon (optional)
• A Confirmation input button, whose label can be customized
• An optional Cancel input button, whose label can be customized

Default

Example

{% include building-blocks/confirm_1.html %}

Note

Use <button type="button"> in case you don't want your form to be submitted.

Css link

{% highlight html linenos=table %}{% endhighlight %}

HTML code

{% highlight html linenos=table %}{% include building-blocks/confirm_1.html %}{% endhighlight %}

---

Confirm with content

Example

{% include building-blocks/confirm_2.html %}

Css link

{% highlight html linenos=table %}{% endhighlight %}

HTML code

{% highlight html linenos=table %}{% include building-blocks/confirm_2.html %}{% endhighlight %}