[heading size=”h2″ style=”uk-module-title”]Alerts[/heading]
To emphasize a point with an alert box, use the [alert]
shortcode
[alert]Do not dwell in the past, do not dream of the future, concentrate the mind on the present moment.[/alert] [line_break/] [badge style=”note uk-margin-top”]markup[/badge]
[code][alert]Your alert message here[/alert] [/code]
[line_break/] [heading size=”h3″ style=”uk-module-title”]Color variations[/heading]
You can change the color scheme of the alert box by adding the following styles: success
, warning
, or danger
[alert style=”success”]Do not dwell in the past, do not dream of the future, concentrate the mind on the present moment.[/alert] [alert style=”warning”]Do not dwell in the past, do not dream of the future, concentrate the mind on the present moment.[/alert] [alert style=”danger”]Do not dwell in the past, do not dream of the future, concentrate the mind on the present moment.[/alert] [line_break/] [badge style=”note uk-margin-top”]markup[/badge]
[code][alert style=”success”]Your alert message here[/alert] [/code]
[line_break/] [heading size=”h3″ style=”uk-module-title”]Closable alerts[/heading]
To add a close button to an alert, use the close-button
parameter in the alert shortcode
[alert close-button style=”success”]Do not dwell in the past, do not dream of the future, concentrate the mind on the present moment[/alert] [alert close-button style=”danger”]Do not dwell in the past, do not dream of the future, concentrate the mind on the present moment[/alert] [line_break/] [badge style=”note uk-margin-top”]markup[/badge]
[code][alert close-button style=”danger”]Your alert message here[/alert] [/code]
[line_break/] [heading size=”h3″ style=”uk-module-title”]Size modifier[/heading]
To create a large alert with added padding, use the uk-alert-large
style in the alert shortcode.
[alert close-button style=”success uk-alert-large”] [heading size=”h3″ style=”uk-module-title”]We are because of you[/heading]
All of all our customers are happy with our current and upcoming projects. The other 5% are learning the secret of appreciating good stuff. It is possible for you to do whatever you choose, if you first get to know who you are
[/alert] [line_break/] [badge style=”note uk-margin-top”]markup[/badge]
[code][alert close-button style=”success uk-alert-large”] [heading size=”h3″ style=”uk-module-title”]We are because of you[/heading] <p>All of all our customers are happy with our current and upcoming projects. The other 5% are learning the secret of appreciating good stuff. It is possible for you to do whatever you choose, if you first get to know who you are</p> [/alert] [/code] [line_break/] [divider/] [line_break/] [heading size=”h2″ style=”uk-module-title”]Badges[/heading]
You can use badges to highlight a segment of text within your content by using the [badge]
shortcode
[badge]new[/badge] [badge]legend[/badge] [badge]note[/badge] [line_break/][line_break/] [badge style=”note uk-margin-top”]markup[/badge] [code][badge]new[/badge] [/code] [line_break/] [heading size=”h3″ style=”uk-module-title”]Color variations[/heading]
You can change the color scheme of the badge by adding the following styles: note
, success
, warning
, or danger
. You can also use the uk-badge-notification
to have a rounded badge, normally used with numbering.
[badge style=”success”]new[/badge] [badge style=”warning”]legend[/badge] [badge style=”danger”]note[/badge] [badge style=”note”]normal[/badge][line_break/][line_break/] [badge style=”note uk-badge-notification”]1[/badge] [badge style=”note uk-badge-notification”]2[/badge] [badge style=”note uk-badge-notification”]3[/badge] [badge style=”note uk-badge-notification”]4[/badge] [badge style=”note uk-badge-notification”]5[/badge] [line_break/][line_break/] [badge style=”note uk-margin-top”]markup[/badge]
[code][badge style=”success”]new[/badge] [badge style=”warning”]legend[/badge] [badge style=”danger”]note[/badge] [badge style=”note”]normal[/badge] [badge style=”note uk-badge-notification”]1[/badge][/code]