<template>
  <header class="flex space-x-2 flex-1 py-2 px-2 items-center justify-between">
    <span class="rounded font-bold text-secondaryDark tracking-wide py-2 px-4">
      HOPPSCOTCH
    </span>
    <a
      href="/"
      target="_blank"
      rel="noopener noreferrer"
      class="buttonSecondary buttonSecondaryFilled"
    >
      <span class="mr-2 hidden sm:flex"> Open in Hoppscotch </span>
      <carbon-arrow-up-right />
    </a>
  </header>
</template>
