Packages

vik

0.0.1-rc1
0.0.1-rc2 0.0.1-rc1

What if GitHub gists, AWS Lambdas and Elixir Plugs had a baby?

HexDocs

Current section

Files

Jump to
Readme
2 Versions
17 Dependencies
Dependants
Files
Activity
vik lib vik_web components layouts app.html.heex
Raw

lib/vik_web/components/layouts/app.html.heex 

<header class="px-4 sm:px-6 lg:px-8">

  <div class="flex items-center justify-between border-b border-zinc-100 py-3 text-sm">

    <div class="flex items-center gap-5">

      <.link navigate={~p"/"}>

        <span class="font-bold text-xl">Vik</span>

        <span class="font-medium ml-2">v{@versions.app}</span>

      </.link>

      <div :if={@socket.view != VikWeb.HomeLive} class="flex items-center gap-2 lowercase">

        <p class="bg-red-600/5 text-red-600 rounded-full px-2 font-medium leading-6">

          <span class="hidden sm:inline">erlang</span> v{@versions.erlang}

        </p>

        <p class="bg-purple-600/5 text-purple-600 rounded-full px-2 font-medium leading-6">

          <span class="hidden sm:inline">Elixir</span> v{@versions.elixir}

        </p>

        <p class="bg-brand/5 text-brand rounded-full px-2 font-medium leading-6">

          <span class="hidden sm:inline">Phoenix</span> v{@versions.phoenix}

        </p>

      </div>

    </div>

    <div class="flex items-center gap-4 font-semibold leading-6 text-zinc-900">

      <.link navigate={~p"/shell"}>

        Shell

      </.link>

      <.link navigate={~p"/log"}>

        Logs

      </.link>

      <.link

        navigate={~p"/new"}

        class="rounded-lg bg-zinc-100 px-2 py-1 hover:bg-zinc-200/80 flex items-center gap-1"

      >

        <.icon name="hero-plus" class="!size-3" /> New

      </.link>

    </div>

  </div>

</header>

<main class={"p-3 md:px-6 #{@socket.view == VikWeb.HomeLive && "overflow-visible"}"}>

  <.flash_group flash={@flash} />

  {@inner_content}

</main>