      <p class="component-description">Title bars are full width and docked to the top of the viewport.</p>

        <div class="component-example component-example-fullbleed">
          <header class="bar bar-nav">
            <h1 class="title">Title</h1>
          </header>
        </div>

{% highlight html %}
<header class="bar bar-nav">
  <h1 class="title">Title</h1>
</header>
{% endhighlight %}

    </article>

    <article class="component">
      <h3 class="component-title">Title bar with buttons</h3