bh v0.0.10 Bh.Bh4.Alert

Twitter Bootstrap 4 alert helpers for Phoenix.

Examples

Real live examples can be found on the site of the Project.

Summary

Functions

Generates alert HTML markup

Functions

bh_alert(text, opts \\ [])

Generates alert HTML markup.

Options

  • :context - context of the alert. Allowed values are :info, :success, :warning, :danger. Default context is :info.

  • :id - id of the alert.

  • :class - extra class, appended to the alert classes. Option :class can take string of space-separated class names or symbol.

  • :dismissible - boolean field. Will result in alert block with close button. Requires alert.js plugin.

Examples

<%= bh_alert "Alert text" %>
<div class="alert alert-info" role="alert">Alert text</div>

Multiple options:

<%= bh_alert "Alert text", id: :one, class: "extra", context: :danger %>
<div class="alert alert-danger extra" id="one" role="alert">Alert text</div>

Instead of a simple alert text message you can pass a complex markup as a block:

<%= bh_alert context: :success, id: :one, class: :extra do %>
  <span><b>Alert</b> is <u>very important</u></span>
<% end %>
<div class="alert alert-success extra" id="one" role="alert">
  <span><b>Alert</b> is <u>very important</u></span>
</div>

Dismissible alert example:

<%= bh_alert context: :success, id: :one, class: :extra, dismissible: true do %>
  <span><b>Dismissible alert</b> is <u>very important</u></span>
<% end %>

Dismissible alert HTML result:

<div class="alert alert-success extra alert-dismissible fade in" id="one" role="alert">
  <button aria-label="Close" class="close" data-dismiss="alert" type="button">
    <span aria-hidden="true">×</span>
  </button>
  <span><b>Dismissible alert</b> is <u>very important</u></span>
</div>