{%- from 'macros/misc.html' import render_notification %}


  {%- set example_notifications -%}
{{ render_notification('Without category and icon. But at least with <a href="#">a link</a>.'|safe) }}

{{ render_notification('Just FYI. <a href="#">Read more.</a>'|safe, category='info', icon='info') }}

{{ render_notification('The action was <strong>successful</strong>. <a href="#">Get yourself something nice.</a>'|safe, category='success', icon='success') }}

{{ render_notification('Careful, <a href="#">remember this</a>.'|safe, category='warning', icon='warning') }}

{{ render_notification('<p>This did not end well. :( <a href="#">Try again?</a></p><p>To explain the problem, debug information like a stack trace could follow here.</p>'|safe, category='danger', icon='error') }}

{{ render_notification('Unsafe content that needs (default) escaping ahead: <script>alert("h4x0r3d!");</script>', category='danger', icon='error') }}
  {%- endset %}

  <div class="example">
    <div class="example-result">
{{ example_notifications }}
    </div>
    <div class="example-code">
      {% call render_code_block() -%}
{{ example_notifications }}
      {%- endcall %}
    </div>
  </div>

{%- from 'macros/misc.html' import render_notification %}


  {%- set example_notifications -%}
{{ render_notification('Without category and icon. But at least with <a href="#">a link</a>.'|safe) }}

{{ render_notification('Just FYI. <a href="#">Read more.</a>'|safe, category='info', icon='info') }}

{{ render_notification('Wait … what?', category='info', icon='spinner') }}

{{ render_notification('The action was <strong>successful</strong>. <a href="#">Get yourself something nice.</a>'|safe, category='success', icon='success') }}

{{ render_notification('Careful, <a href="#">remember this</a>.'|safe, category='warning', icon='warning') }}

{{ render_notification('<p>This did not end well. :( <a href="#">Try again?</a></p><p>To explain the problem, debug information like a stack trace could follow here.</p>'|safe, category='danger', icon='error') }}

{{ render_notification('Unsafe content that needs (default) escaping ahead: <script>alert("h4x0r3d!");</script>', category='danger', icon='error') }}
  {%- endset %}

  <div class="example">
    <div class="example-result">
{{ example_notifications }}
    </div>
    <div class="example-code">
      {% call render_code_block() -%}
{{ example_notifications }}
      {%- endcall %}
    </div>
  </div>

Add notification with spinning spinner to style guide
Add notification with spinning spinner to style guide
