make app responsive

lib/cannery_web/live/container_live/add_tag_component.html.heex

@@ -7,7 +7,7 @@
     let={f}
     for={:tag}
     id="add-tag-to-container-form"
-    class="grid grid-cols-3 justify-center items-center space-x-2"
+    class="flex flex-col sm:grid sm:grid-cols-3 justify-center items-center space-x-2"
     phx-target={@myself}
     phx-submit="save"
   >

lib/cannery_web/live/container_live/form_component.html.heex

@@ -6,7 +6,7 @@
     let={f}
     for={@changeset}
     id="container-form"
-    class="grid grid-cols-3 justify-center items-center space-y-4"
+    class="flex flex-col sm:grid sm:grid-cols-3 justify-center items-center space-y-4"
     phx-target={@myself}
     phx-change="validate"
     phx-submit="save"

lib/cannery_web/live/container_live/index.html.heex

@@ -5,7 +5,8 @@
 
   <%= if @containers |> Enum.empty?() do %>
     <h2 class="title text-xl text-primary-500">
-      <%= gettext("No containers") %> <%= display_emoji("😔") %>
+      <%= gettext("No containers") %>
+      <%= display_emoji("😔") %>
     </h2>
 
     <%= live_patch(dgettext("actions", "Add your first container!"),
@@ -19,7 +20,7 @@
     ) %>
   <% end %>
 
-  <div class="flex flex-row flex-wrap">
+  <div class="flex flex-row flex-wrap justify-center items-center">
     <%= for container <- @containers do %>
       <.container_card container={container}>
         <%= live_patch to: Routes.container_index_path(@socket, :edit, container),

lib/cannery_web/live/container_live/show.html.heex

@@ -44,7 +44,8 @@
   <%= if @container.tags |> Enum.empty?() do %>
     <div class="flex flex-row justify-center items-center space-x-4">
       <h2 class="title text-lg text-primary-500">
-        <%= gettext("No tags for this container") %> <%= display_emoji("😔") %>
+        <%= gettext("No tags for this container") %>
+        <%= display_emoji("😔") %>
       </h2>
 
       <%= live_patch(dgettext("actions", "Why not add one?"),