feat: basic style inbox

lib/radiator_web/live/outline_live/index.html.heex

@@ -1,25 +1,30 @@
-<section>
-  <h1>Outline</h1>
+<div>
+  <header>
+    <h1 class="text-4xl">Outline</h1>
+    <p>Collect and structure links and content for your prodcast</p>
+  </header>
 
-  <h2>Inbox</h2>
+  <section class="my-12 ">
+    <h2 class="text-2xl">Inbox</h2>
 
-  <.focus_wrap id="input-form-wrap">
-    <.form id="inbox-form" for={@form} phx-change="update" phx-submit="next">
-      <.input type="text" field={@form[:content]} />
-      <.input type="hidden" field={@form[:uuid]} />
-    </.form>
-  </.focus_wrap>
+    <.focus_wrap id="input-form-wrap">
+      <.form id="inbox-form" for={@form} phx-change="update" phx-submit="next">
+        <.input type="text" field={@form[:content]} />
+        <.input type="hidden" field={@form[:uuid]} />
+      </.form>
+    </.focus_wrap>
 
-  <ul id="inbox" class="mt-8 list-disc list-inside" phx-update="stream">
-    <li :for={{dom_id, node} <- @streams.nodes} id={dom_id}>
-      <%= node.content %>
-      <.link
-        phx-click={JS.push("delete", value: %{uuid: node.uuid}) |> hide("##{dom_id}")}
-        data-confirm="Delete?"
-      >
-        <.icon name="hero-x-circle" class="w-5 h-5" />
-        <div class="sr-only">Delete</div>
-      </.link>
-    </li>
-  </ul>
-</section>
+    <ul id="inbox" class="mt-8 list-disc list-inside" phx-update="stream">
+      <li :for={{dom_id, node} <- @streams.nodes} id={dom_id}>
+        <%= node.content %>
+        <.link
+          phx-click={JS.push("delete", value: %{uuid: node.uuid}) |> hide("##{dom_id}")}
+          data-confirm="Delete?"
+        >
+          <.icon name="hero-x-circle" class="w-5 h-5" />
+          <div class="sr-only">Delete</div>
+        </.link>
+      </li>
+    </ul>
+  </section>
+</div>