{% extends 'layouts/lab-side-content.html' %}

{% from 'macros/lab-example.html' import LabExample %}
{% from 'macros/lab-code.html' import LabCode %}

{% set pageType = "content" %}
{% set pageId = "icons" %}

{% block content %}
  <h1>Icons</h1>

  <p>Place vector icons anywhere using our SVG sprite generator.</p>

  <h3>Usage</h3>

  {{LabExample(pageType, pageId)}}
  {{LabCode('html', '
  <span class="o-icon o-icon--bell">
    <svg viewbox="0 0 1 1">
      <use xlink:href="/assets/images/icons.svg#bell"></use>
    </svg>
  </span>
  ')}}
{% endblock %}