dotfiles/app/lib/prymn_web/components/layouts/app.html.heex

<header>
  <a
    href="#main"
    class="absolute left-0 -translate-y-full bg-black p-2 text-white transition-transform focus:transform-none"
  >
    <%= gettext("Skip to content") %>
  </a>
  <div class="flex h-14 items-center justify-between border-b border-slate-100 bg-violet-100 px-4 text-sm sm:px-6 lg:px-8">
    <div class="my-auto leading-tight text-violet-700">
      <p class="text-[10px]">codename</p>
      <a
        href="/"
        class="bg-gradient-to-br from-violet-600 to-pink-600 bg-clip-text text-lg font-black text-transparent"
      >
        Prymn
      </a>
      <p class="inline text-xs">
        v<%= Application.spec(:prymn, :vsn) %>
      </p>
    </div>
    <.dropdown position="right">
      <:button variant="tertiary">
        <.icon name="hero-user-solid" />
      </:button>
      <:item href={~p"/users/settings"}>Settings</:item>
      <:item method="DELETE" href={~p"/auth/log_out"}>Log out</:item>
    </.dropdown>
  </div>
</header>
<main id="main" class="mt-10 px-4 sm:px-6 lg:px-10">
  <div class="pb-20">
    <.flash_group flash={@flash} />
    <%= @inner_content %>
  </div>
</main>