priv/templates/joby_kit.new/layouts.ex

defmodule <%= @web_module %>.Layouts do
  @moduledoc """
  Layouts for <%= @web_module %>. Generated by `mix joby_kit.new`.

  Pages compose `<Layouts.app flash={@flash}>...` from inside their
  LiveView render. The kit's `simple_nav` and `flash_group` are wired
  in here so every page gets them for free.
  """
  use <%= @web_module %>, :html

  embed_templates "layouts/*"

  attr :flash, :map, required: true
  attr :current_scope, :map, default: nil
  attr :active_nav, :string, default: nil
  slot :inner_block, required: true

  def app(assigns) do
    ~H"""
    <div class="relative flex min-h-dvh flex-col bg-base-100">
      <div class="sticky top-0 z-40 border-b border-base-300/60 bg-base-100/80 backdrop-blur supports-[backdrop-filter]:bg-base-100/65">
        <div class="mx-auto flex w-full max-w-6xl items-center px-2 sm:px-4">
          <JobyKit.NavComponent.simple_nav active={@active_nav} brand="<%= @app_camel %>" />
        </div>
      </div>

      <main class="flex-1">
        {render_slot(@inner_block)}
      </main>

      <footer class="mt-12 border-t border-base-300/60">
        <div class="mx-auto flex max-w-6xl flex-col gap-3 px-6 py-6 text-xs text-base-content/60 sm:flex-row sm:items-center sm:justify-between">
          <p>
            <%= @app_camel %> · powered by
            <a
              href="https://github.com/jobycorp/joby_kit"
              class="link link-hover font-medium"
              target="_blank"
              rel="noopener"
            >
              JobyKit
            </a>
          </p>
          <p class="font-mono">
            <a href="/design" class="link link-hover">/design</a>
            <span class="opacity-40"> · </span>
            <a href="/custom-designs" class="link link-hover">/custom-designs</a>
            <span class="opacity-40"> · </span>
            <a href="/design.json" class="link link-hover">/design.json</a>
          </p>
        </div>
      </footer>

      <JobyKit.CoreComponents.flash_group flash={@flash} />
    </div>
    """
  end
end