<aside class="aside">
  <div class="aside__contents">
    <a class="aside__header" href="{{ relativePath }}">
      {% if metadata.project.logo_mini is defined %}
      <div class="aside__logo">
        <img src="{{ relativePath }}{{ metadata.project.logo_mini }}" class="aside__logo-image">
      </div>
      {% else %}
      <div class="aside__logo icon icon-a-pollo"></div>
      <div class="aside__headline">
        <strong class="aside__title">a-pollo</strong>
        <div class="aside__sub-title">
          The CSS style guide
        </div>
      </div>
      {% endif %}
    </a>

    <hr class="hr hr--aside">

    {% include 'aside-menu.twig' with { title: 'Documentation', items: metadata.collections.doc } %}
    {% include 'aside-menu-simple.twig' with { title: 'Identity', items: metadata.collections.identity } %}
    {% include 'aside-menu.twig' with { title: 'Posts', items: metadata.collections.posts } %}
    {% include 'aside-menu.twig' with { title: 'Snippet', items: metadata.collections.snippet } %}
    {% include 'aside-menu-assets.twig' %}

    <hr class="hr hr--aside">

    <ul class="aside-menu">
      <li class="aside-menu__title aside-menu__title--big">
        External links
      </li>
      <li class="aside-menu__item aside-menu__item--inline">
        <a class="aside-menu__link" href="{{ metadata.repo }}">
          <i class="fa fa-github-alt"></i>
        </a>
      </li>
      <li class="aside-menu__item aside-menu__item--inline">
        <a class="aside-menu__link" href="{{ metadata.work }}">
          <i class="fa fa-briefcase"></i>
        </a>
      </li>
      <li class="aside-menu__item aside-menu__item--inline">
        <a class="aside-menu__link" href="{{ metadata.home }}">
          <i class="fa fa-coffee"></i>
        </a>
      </li>
    </ul>
  </div>
</aside>
