From 5c1f6c9c96b57dc48b64fb90d64f8d26286549dd Mon Sep 17 00:00:00 2001
From: Benjamin Randolph <104036158+neb417@users.noreply.github.com>
Date: Thu, 7 Nov 2024 06:53:30 -0700
Subject: [PATCH] Follow convention of other pages. (#58)

---
 app/views/dashboard/_index.html.erb      |  9 +-----
 app/views/fixed_expenses/_index.html.erb | 25 +++++++++++-----
 app/views/fixed_expenses/index.html.erb  | 11 +------
 app/views/shared/_total_costs.html.erb   | 38 +++++++++++++-----------
 4 files changed, 40 insertions(+), 43 deletions(-)

diff --git a/app/views/dashboard/_index.html.erb b/app/views/dashboard/_index.html.erb
index 6ff43a8..fea6018 100644
--- a/app/views/dashboard/_index.html.erb
+++ b/app/views/dashboard/_index.html.erb
@@ -71,14 +71,7 @@
     </div>
 
     <div class="primary-card">
-      <div class="mx-auto py-6 sm:px-6 lg:px-8">
-        <%= turbo_frame_tag "fixed_expense_header_frame" do %>
-          <strong>Fixed Expenses</strong>
-          <div class="mt-4">
-            <%= link_to "New Fixed Expense", new_fixed_expense_path, data: { turbo_frame: :fixed_expenses }, class: "btn btn-primary" %>
-          </div>
-        <% end %>
-
+      <div class="pb-6">
         <%= render "fixed_expenses/index" %>
 
         <%= render partial: "shared/total_costs", locals: { total_cost: @total_cost } %>
diff --git a/app/views/fixed_expenses/_index.html.erb b/app/views/fixed_expenses/_index.html.erb
index 23f372b..212f32d 100644
--- a/app/views/fixed_expenses/_index.html.erb
+++ b/app/views/fixed_expenses/_index.html.erb
@@ -1,10 +1,21 @@
 <%= turbo_frame_tag :fixed_expenses do %>
-  <div id="fixed_expense_labels" class="grid grid-cols-5">
-    <% fixed_headings = %w[Expense Annual Monthly Bi-weekly] %>
-    <% fixed_headings.each do |fixed_heading| %>
-      <div class="px-5 pt-4"><strong><%= fixed_heading %></strong></div>
-    <% end %>
-  </div>
+  <div class="primary-card">
+    <div class="mx-auto pt-6 sm:px-6 lg:px-8">
+      <%= turbo_frame_tag "fixed_expense_header_frame" do %>
+        <strong>Fixed Expenses</strong>
+        <div class="mt-4">
+          <%= link_to "New Fixed Expense", new_fixed_expense_path, data: { turbo_frame: :fixed_expenses }, class: "btn btn-primary" %>
+        </div>
+      <% end %>
+
+      <div id="fixed_expense_labels" class="grid grid-cols-5">
+        <% fixed_headings = %w[Expense Annual Monthly Bi-weekly] %>
+        <% fixed_headings.each do |fixed_heading| %>
+          <div class="px-5 pt-4"><strong><%= fixed_heading %></strong></div>
+      <% end %>
+      </div>
 
-  <%= render @fixed_expenses %>
+      <%= render @fixed_expenses %>
+    </div>
+  </div>
 <% end %>
diff --git a/app/views/fixed_expenses/index.html.erb b/app/views/fixed_expenses/index.html.erb
index 2268232..75b088e 100644
--- a/app/views/fixed_expenses/index.html.erb
+++ b/app/views/fixed_expenses/index.html.erb
@@ -3,14 +3,5 @@
     <p class="py-2 px-3 bg-green-50 mb-5 text-green-500 font-medium rounded-lg inline-block" id="notice"><%= notice %></p>
   <% end %>
 
-  <div class="flex justify-between items-center">
-    <%= turbo_frame_tag :fixed_expenses do %>
-      <h1 class="font-bold text-4xl">Fixed expenses</h1>
-      <%= link_to 'New fixed expense', new_fixed_expense_path, class: "rounded-lg py-3 px-5 bg-blue-600 text-white block font-medium" %>
-    <% end %>
-  </div>
-
-  <div id="fixed_expenses" class="min-w-full">
-    <%= render @fixed_expenses %>
-  </div>
+  <%= render "fixed_expenses/index" %>
 </div>
diff --git a/app/views/shared/_total_costs.html.erb b/app/views/shared/_total_costs.html.erb
index cb33c5f..0f11924 100644
--- a/app/views/shared/_total_costs.html.erb
+++ b/app/views/shared/_total_costs.html.erb
@@ -1,25 +1,27 @@
 <%= turbo_frame_tag "total_costs" do %>
-  <div class="grid grid-cols-5">
-    <div class="px-5">
-      <strong>Total</strong>
-    </div>
+  <div class="mx-auto sm:px-6 lg:px-8">
+    <div class="grid grid-cols-5">
+      <div class="px-5">
+        <strong>Total</strong>
+      </div>
 
-    <div>
-      <strong>
-        <%= render partial: "shared/total", locals: { total: total_cost.annual_cost } %>
-      </strong>
-    </div>
+      <div>
+        <strong>
+          <%= render partial: "shared/total", locals: { total: total_cost.annual_cost } %>
+        </strong>
+      </div>
 
-    <div>
-      <strong>
-        <%= render partial: "shared/total", locals: { total: total_cost.monthly_cost } %>
-      </strong>
-    </div>
+      <div>
+        <strong>
+          <%= render partial: "shared/total", locals: { total: total_cost.monthly_cost } %>
+        </strong>
+      </div>
 
-    <div>
-      <strong>
-        <%= render partial: "shared/total", locals: { total: total_cost.bi_weekly_cost } %>
-      </strong>
+      <div>
+        <strong>
+          <%= render partial: "shared/total", locals: { total: total_cost.bi_weekly_cost } %>
+        </strong>
+      </div>
     </div>
   </div>
 <% end %>