CSS/Layout Tweaks

-layouts/_banner.html.erb
  - Remove negative top margin, as this was eating into the space of the
    _page_nav elements.
- layouts/application.html.erb
  - Utilize gap-y-12 instead of main.my-12 since we have a flex
    container there now. I think the flex gap is generally better.

app/views/layouts/_banner.html.erb

@@ -9,12 +9,10 @@
   <% end %>
   data-banner-hide-class="opacity-0"
   data-action="transitionend->banner#remove"
-  class="
-    block -mt-6 md:-mt-3 mb-12 text-center text-balance
-    transition-opacity ease-in
-  "
+  class="mb-12 text-center text-balance transition-opacity ease-in"
 >
   <span class="sr-only">Banner</span>
+
   <div class="flex gap-x-6 items-baseline">
     <p><%= banner.content %></p>
 

app/views/layouts/application.html.erb

@@ -56,7 +56,7 @@
     data-controller="theme time-zone"
     data-theme-active-theme-button-class="text-red-700 dark:text-red-600"
     data-time-zone-update-url-value="<%= current_user_time_zone_update_path %>"
-    class="flex flex-col h-screen"
+    class="flex flex-col gap-y-12 h-screen"
   >
     <%= render("layouts/flash/container") %>
 
@@ -69,14 +69,13 @@
       <%= render("nav") %>
     </header>
 
-    <main class="my-12 px-6 lg:px-12">
+    <main class="px-6 lg:px-12">
       <%= yield %>
     </main>
 
     <footer
       class="
-        mt-auto
-        px-6 lg:px-12 py-6
+        mt-auto px-6 lg:px-12 py-6
         border-t border-t-300 dark:border-t-neutral-700
       "
     >