<p>Current media breakpoint: {{ breakpoint() }}</p>

@if (breakpoint() === 'xs') {
  <nav class="my-nav-mobile">
    <ul>
      <li>
        <button aria-label="Home" type="button">
          <sky-icon icon="menu" />
        </button>
      </li>
    </ul>
  </nav>
} @else {
  <nav class="my-nav-desktop">
    <ul>
      <li>
        <a href="#">Home</a>
      </li>
    </ul>
  </nav>
}
