From 6d03b3226bf5cc0d43e5797737a02c3d659ea237 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Javi=20Mart=C3=ADn?= <javim@elretirao.net>
Date: Sat, 10 Jul 2021 00:40:27 +0200
Subject: [PATCH] Simplify new investment layout

We had an additional `<div>` just to add a background color, when we can
do it by applying the background color to the whole `<main>` element and
then the body background color to the optional fields.

However, I've decided not to do so. The main purpose of changing the
background color is to highlight the required fields. The benefits of
changing the background color of the header as well are unclear. When in
doubt, we're using the solution which requires less code.
---
 .../stylesheets/budgets/investments/new.scss  |  8 -----
 app/views/budgets/investments/new.html.erb    | 32 +++++++++----------
 2 files changed, 15 insertions(+), 25 deletions(-)

diff --git a/app/assets/stylesheets/budgets/investments/new.scss b/app/assets/stylesheets/budgets/investments/new.scss
index f13325fbf..d7a698e4d 100644
--- a/app/assets/stylesheets/budgets/investments/new.scss
+++ b/app/assets/stylesheets/budgets/investments/new.scss
@@ -2,13 +2,6 @@
   $border-width: 4px;
   @include grid-column-gutter;
 
-  > :first-child:not(.print-info) {
-    @include full-width-background($adjust-padding: true);
-    background: $light;
-    margin-top: -$line-height;
-    padding-top: $line-height;
-  }
-
   h1 {
     margin-bottom: 0;
   }
@@ -16,7 +9,6 @@
   header {
     @include has-fa-icon(building, regular, after);
     align-items: center;
-    background-color: $body-background;
     border: $border-width solid;
     color: $brand-secondary;
     border-bottom-right-radius: rem-calc(12);
diff --git a/app/views/budgets/investments/new.html.erb b/app/views/budgets/investments/new.html.erb
index df1291c36..5c9b3b2a6 100644
--- a/app/views/budgets/investments/new.html.erb
+++ b/app/views/budgets/investments/new.html.erb
@@ -1,23 +1,21 @@
 <main class="budget-investment-new">
-  <div>
-    <%= back_link_to budgets_path %>
+  <%= back_link_to budgets_path %>
 
-    <header>
-      <h1>
-        <span>
-          <%= t("budgets.investments.form.title") %>
+  <header>
+    <h1>
+      <span>
+        <%= t("budgets.investments.form.title") %>
 
-          <% if @budget.single_heading? %>
-            <span>
-              <%= t("budgets.investments.form.subtitle",
-                    heading: @budget.headings.first.name,
-                    price: @budget.formatted_heading_price(@budget.headings.first)) %>
-            </span>
-          <% end %>
-        </span>
-      </h1>
-    </header>
-  </div>
+        <% if @budget.single_heading? %>
+          <span>
+            <%= t("budgets.investments.form.subtitle",
+                  heading: @budget.headings.first.name,
+                  price: @budget.formatted_heading_price(@budget.headings.first)) %>
+          </span>
+        <% end %>
+      </span>
+    </h1>
+  </header>
 
   <%= render "/budgets/investments/form", form_url: budget_investments_path(@budget) %>
 </main>