🌸 DesignLibrary: Layout is responsible for.... Layout... (zinc-coll…

…ective#2281) - zinc-collective#1187 - zinc-collective#2271 - zinc-collective#2253 One of the things we've kept bumping into is that each page has to decide how wide it wants to be. That doesn't really seem sustainable or particularly necessary; so now the Layout takes care of: - Providing a Max-Width on every page - Ensuring the Layout is centered horizontally - Ensuring there is appropriate margin from the top of the screen
zinc-collective · Mar 25, 2024 · a92e7f9 · a92e7f9
1 parent 47b680a
commit a92e7f9
Show file tree

Hide file tree

Showing 9 changed files with 51 additions and 57 deletions.
diff --git a/app/furniture/journal/journals/_journal.html.erb b/app/furniture/journal/journals/_journal.html.erb
@@ -1,13 +1,12 @@
-<section class="max-w-3xl mx-auto">
-  <%= render Journal::NewEntryButtonComponent.new(journal: journal) %>
 
-  <div class="flex flex-wrap">
-    <%- @pagy, @entries = pagy(policy_scope(journal.entries.recent)) %>
+<%= render Journal::NewEntryButtonComponent.new(journal: journal) %>
 
-    <%= render Journal::EntryComponent.with_collection(@entries) %>
-  </div>
+<div class="flex flex-wrap">
+  <%- @pagy, @entries = pagy(policy_scope(journal.entries.recent)) %>
 
-  <%== pagy_nav(@pagy) %>
+  <%= render Journal::EntryComponent.with_collection(@entries) %>
+</div>
 
-  <%= render Journal::NewEntryButtonComponent.new(journal: journal) %>
-</section>
+<%== pagy_nav(@pagy) %>
+
+<%= render Journal::NewEntryButtonComponent.new(journal: journal) %>
diff --git a/app/furniture/layouts/marketplace.html.erb b/app/furniture/layouts/marketplace.html.erb
@@ -1,25 +1,24 @@
 <%- content_for :content do %>
-  <div class="flex flex-col content-between justify-end mx-auto max-w-7xl sm:px-6 lg:px-8">
-    <div class="grow mx-auto w-full">
-      <%= turbo_frame_tag(marketplace, data: { turbo_action: :advance }) do %>
-        <%- if policy(marketplace).edit? %>
-          <%= render Marketplace::ManagementComponent.new(marketplace: marketplace) do %>
-            <%= yield  %>
-          <%- end %>
-        <%- else %>
-          <section>
-            <header>
-              <h2>
-                <%= t('.header', space: marketplace.space.name, room: marketplace.room.name) %>
-              </h2>
-            </header>
-            <div>
-              <%= yield  %>
-            </div>
-          </section>
+  <div class="grow mx-auto w-full">
+    <%= turbo_frame_tag(marketplace, data: { turbo_action: :advance }) do %>
+      <%- if policy(marketplace).edit? %>
+        <%= render Marketplace::ManagementComponent.new(marketplace: marketplace) do %>
+          <%= yield  %>
         <%- end %>
+      <%- else %>
+        <section>
+          <header>
+            <h2>
+              <%= t('.header', space: marketplace.space.name, room: marketplace.room.name) %>
+            </h2>
+          </header>
+          <div>
+            <%= yield  %>
+          </div>
+        </section>
       <%- end %>
     <%- end %>
-  </div>
+  <%- end %>
 </div>
+
 <%= render template: "layouts/application" %>
diff --git a/app/furniture/marketplace/orders/index.html.erb b/app/furniture/marketplace/orders/index.html.erb
@@ -1,6 +1,5 @@
 <%- breadcrumb :marketplace_orders, marketplace %>
 <%- @pagy, @records = pagy(orders.paid) %>
-<div class="mx-auto w-full max-w-prose">
-  <%= render @records %>
-  <%== pagy_nav(@pagy) if @pagy.pages > 1 %>
-</div>
+
+<%= render @records %>
+<%== pagy_nav(@pagy) if @pagy.pages > 1 %>
diff --git a/app/furniture/marketplace/orders/show.html.erb b/app/furniture/marketplace/orders/show.html.erb
@@ -1,4 +1,3 @@
 <%- breadcrumb :marketplace_order, order%>
-<div class="mx-auto w-full max-w-prose">
-  <%= render order %>
-</div>
+
+<%= render order %>
diff --git a/app/views/authenticated_sessions/new.html.erb b/app/views/authenticated_sessions/new.html.erb
@@ -1,3 +1 @@
-<div class="md:w-4/12 sm:w-auto m-auto mt-8">
-  <%= render partial: 'form', locals: { authenticated_session: authenticated_session } %>
-</div>
+<%= render partial: 'form', locals: { authenticated_session: authenticated_session } %>
diff --git a/app/views/layouts/application.html.erb b/app/views/layouts/application.html.erb
@@ -5,7 +5,8 @@
   <body>
     <%= render 'layouts/header' %>
 
-    <main id="<%= current_space.present? ? dom_id(current_space) : nil %>" class="gap-3">
+    <main id="<%= current_space.present? ? dom_id(current_space) : nil %>"
+          class="gap-3 flex flex-col content-between mx-auto w-full max-w-7xl sm:px-6 lg:px-8">
       <%= content_for?(:content) ? yield(:content) : yield %>
     </main>
 

diff --git a/app/views/neighborhoods/show.html.erb b/app/views/neighborhoods/show.html.erb
@@ -1,18 +1,18 @@
 <%- @pagy, @records = pagy(policy_scope(neighborhood.spaces)) %>
 
-<section class="max-w-3xl mx-auto">
-  <div class="mt-3 grid grid-cols-1 gap-5 sm:gap-6 sm:grid-cols-2 lg:grid-cols-4">
-    <%= render @records %>
-  </div>
 
-  <%== pagy_nav(@pagy) %>
+<div class="grid grid-cols-1 gap-5 sm:gap-6 sm:grid-cols-2 lg:grid-cols-4">
+  <%= render @records %>
+</div>
+
+<%== pagy_nav(@pagy) %>
+
+<%- if policy(Space).new? %>
+  <div class="text-center w-full">
+    <%= link_to "Add a Space",[:new, :space] %>
+  </div>
+<%- end %>
 
-  <%- if policy(Space).new? %>
-    <div class="text-center w-full">
-      <%= link_to "Add a Space",[:new, :space] %>
-    </div>
-  <%- end %>
-</section>
 
 <%- if !neighborhood.email_configured? %>
   <p>It looks like you haven't configured Convene to send email. Check the <code>.env.example</code> file for variables named with <code>SMTP</code> and make sure each is set with your email providers configuration.</p>

diff --git a/app/views/rooms/_room.html.erb b/app/views/rooms/_room.html.erb
@@ -1,10 +1,9 @@
 <%- if room.hero_image&.upload.present? %>
   <%= image_tag room.hero_image&.upload&.variant(resize_to_fill: Media::FULL_WIDTH_SHORT), class: "w-full" %>
 <%- end %>
-<div class="flex flex-col content-between justify-end mx-auto max-w-7xl sm:px-6 lg:px-8">
-  <div class="grow mx-auto w-full">
-    <section id="furnitures">
-      <%= render room.gizmos.rank(:slot) %>
-    </section>
-  </div>
+
+<div class="grow mx-auto w-full">
+  <section id="furnitures">
+    <%= render room.gizmos.rank(:slot) %>
+  </section>
 </div>
diff --git a/app/views/space/agreements/_agreement.html.erb b/app/views/space/agreements/_agreement.html.erb
@@ -1,4 +1,4 @@
-<%= render CardComponent.new(dom_id: dom_id(agreement), classes: "mx-auto mt-2 max-w-prose w-full") do %>
+<%= render CardComponent.new(dom_id: dom_id(agreement)) do %>
   <h2><%= agreement.name %></h2>
 
   <div>