<!DOCTYPE html>
<html lang="en" class="[scrollbar-gutter:stable]">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <meta name="csrf-token" content={get_csrf_token()} />
    <.live_title suffix=" - zoeys.computer">
      <%= assigns[:page_title] || "" %>
    </.live_title>
    <link phx-track-static rel="stylesheet" href={~p"/assets/app.css"} />
    <link phx-track-statuc rel="stylesheet" href={~p"/fonts/Iosevka.css"} />
    <script defer phx-track-static type="text/javascript" src={~p"/assets/app.js"}>
    </script>
  </head>
  <body class="ctp-mocha bg-ctp-base text-base text-ctp-overlay0">
    <%= if @current_user do %>
      <div class="flex w-full">
        <div class="p-4">
          <.link
            class="text-ctp-mauve text-sm font-bold hover:border-b-2 border-ctp-mauve"
            navigate={~p"/"}
          >
            zoey
          </.link>
        </div>
        <div class="p-4">
          <.link
            class="text-ctp-pink text-sm hover:border-b-2 border-ctp-pink"
            navigate={~p"/images"}
          >
            image
          </.link>
        </div>
        <div class="p-4 grow">
          <.link
            class="text-ctp-pink text-sm hover:border-b-2 border-ctp-pink"
            navigate={~p"/gists"}
          >
            gists
          </.link>
        </div>
        <ul class="relative z-10 flex items-center gap-4 px-4 sm:px-6 lg:px-8 justify-end">
          <li class="text-[0.8125rem] leading-6">
            <%= @current_user.email %>
          </li>
          <li>
            <.link
              href={~p"/users/settings"}
              class="text-[0.8125rem] leading-6 font-semibold hover:text-ctp-mauve"
            >
              Settings
            </.link>
          </li>
          <li>
            <.link
              href={~p"/users/log_out"}
              method="delete"
              class="text-[0.8125rem] leading-6 font-semibold hover:text-ctp-mauve"
            >
              Log out
            </.link>
          </li>
        </ul>
      </div>
    <% end %>
    <%= @inner_content %>
  </body>
</html>
