first chicken and egg

lib/chicken_egg_web/components/chicken_components.ex

@@ -0,0 +1,19 @@
+defmodule ChickenEggWeb.ChickenComponents do
+  use ChickenEggWeb, :html
+
+  def chicken(assigns) do
+    ~H"""
+    <div class="w-32 h-32 absolute" style={"top: #{@y}px; left: #{@x}px;"}>
+      <img src={~p"/images/chicken.svg"} />
+    </div>
+    """
+  end
+
+  def egg(assigns) do
+    ~H"""
+    <div class="w-12 h-12 absolute" style={"top: #{@y}px; left: #{@x}px;"}>
+      <img src={~p"/images/egg.svg"} />
+    </div>
+    """
+  end
+end

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

@@ -1,31 +1,6 @@
-<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-4">
-      <a href="/">
-        <img src={~p"/images/logo.svg"} width="36" />
-      </a>
-      <p class="bg-brand/5 text-brand rounded-full px-2 font-medium leading-6">
-        v<%= Application.spec(:phoenix, :vsn) %>
-      </p>
-    </div>
-    <div class="flex items-center gap-4 font-semibold leading-6 text-zinc-900">
-      <a href="https://twitter.com/elixirphoenix" class="hover:text-zinc-700">
-        @elixirphoenix
-      </a>
-      <a href="https://github.com/phoenixframework/phoenix" class="hover:text-zinc-700">
-        GitHub
-      </a>
-      <a
-        href="https://hexdocs.pm/phoenix/overview.html"
-        class="rounded-lg bg-zinc-100 px-2 py-1 hover:bg-zinc-200/80"
-      >
-        Get Started <span aria-hidden="true">&rarr;</span>
-      </a>
-    </div>
-  </div>
-</header>
-<main class="px-4 py-20 sm:px-6 lg:px-8">
-  <div class="mx-auto max-w-2xl">
+<header class="px-4 sm:px-6 lg:px-8 p-0"></header>
+<main class="">
+  <div class="">
     <.flash_group flash={@flash} />
     <%= @inner_content %>
   </div>