Banner

This component has 1 variant.

Default – Nevan Scott

Preview

Nevan Scott

Rendered HTML

<header role="banner">
  <h1>
    <a class="h-card" rel="me" href="/">Nevan Scott</a>
  </h1>

  <nav role="navigation">

    <a href="#">Writing</a>

    <a href="#">Portfolio</a>

    <a href="#">Teaching</a>

    <a href="#">Reading</a>

  </nav>

</header>

Template

<header role="banner">
  <h1><a class="h-card" rel="me" href="/">{{ siteName }}</a></h1>
  {% if navLinks %}
    <nav role="navigation">
      {% for link in navLinks %}
        <a href="{{ link.url }}">{{ link.text }}</a>
      {% endfor %}
    </nav>
  {% endif %}
</header>

Default – Notated

Preview

notated.org

Rendered HTML

<header role="banner">
  <h1>
    <a class="h-card" rel="me" href="/">notated.org</a>
  </h1>

  <nav role="navigation">

    <a href="#">Blog</a>

    <a href="#">About</a>

    <a href="#">Projects</a>

    <a href="#">Archive</a>

  </nav>

</header>

Template

<header role="banner">
  <h1><a class="h-card" rel="me" href="/">{{ siteName }}</a></h1>
  {% if navLinks %}
    <nav role="navigation">
      {% for link in navLinks %}
        <a href="{{ link.url }}">{{ link.text }}</a>
      {% endfor %}
    </nav>
  {% endif %}
</header>
Omakase