access-nyc-patterns/src/views/partials/header.slm

User Interface Patterns for Benefits Access

header class='color-light-background px-2'
  div class='border-b border-color-grey-light'
    div class='flex items-center justify-between p-2 screen-tablet:py-4 screen-tablet:px-2'
      div
        h1 class='m-0 p-0 leading-normal'
          a href='index'
            span class='hidden'
              | ACCESS NYC
            svg class='icon-logo-mark screen-tablet:hidden' aria-hidden='true'
              use xlink:href='#icon-logo-mark'
            svg class='icon-logo-full--large text-color-blue-dark hidden screen-tablet:inline-block' aria-hidden='true'
                use xlink:href='#icon-logo-full'

      div class='flex items-center'
        h2 class='text-font-size-small m-0 text-color-blue-dark screen-tablet:hidden'
          | Patterns
        h2 class='type-h1 m-0 text-color-blue-dark hidden screen-tablet:inline-block' aria-hidden='true'
          | Patterns
        nav class='text-font-size-small'
          a href='${link_source}/tree/v${this.variables.version}' class='rounded-lg text-color-blue-dark border-2 no-underline px-1 ml-2 hidden screen-tablet:inline-block'
            = this.variables.version;
          a href='${link_source}/tree/v${this.variables.version}' class='ml-1 screen-tablet:ml-2 screen-tablet:hidden' aria-hidden='true'
            = this.variables.version;
          button#main-menu-control class='btn-link ml-1 screen-tablet:ml-2' aria-controls='main-menu' aria-expanded='false' data-js='toggle' Menu