Navigation Bar

<div class="navigation-bar">
  <a href="#" class="navigation-bar__item navigation-bar__item--active">
    <div class="navigation-bar__item__icon">
      <span class="material-icons">circle</span>
    </div>
    <div class="navigation-bar__item__label">
      Label
    </div>
  </a>
  <a href="#" class="navigation-bar__item">
    <div class="navigation-bar__item__icon">
      <span class="material-icons">square</span>
    </div>
    <div class="navigation-bar__item__label">
      Label
    </div>
  </a>
  <a href="#" class="navigation-bar__item">
    <div class="navigation-bar__item__icon">
      <span class="material-icons">square</span>
      <div class="badge badge--small">
      </div>
    </div>
    <div class="navigation-bar__item__label">
      Label
    </div>
  </a>
  <a href="#" class="navigation-bar__item">
    <div class="navigation-bar__item__icon">
      <span class="material-icons">label</span>
      <div class="badge badge--large">
        123+
      </div>
    </div>
    <div class="navigation-bar__item__label">
      Label
    </div>
  </a>
</div>