From 8ec77723ed5c6c572c352427e8d0c94871638f05 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Javi=20Mart=C3=ADn?= <javim@elretirao.net>
Date: Mon, 8 Nov 2021 20:05:41 +0100
Subject: [PATCH 1/3] Use buttons instead of inputs to remove supports

We're starting to use buttons instead of submit inputs where possible
because buttons are easier to style; for instance, buttons allow
pseudoelements. Rails has also changed the `button_to` helper to always
generate a <button> tag in recent versions [1].

In this case, buttons get on better with flex layouts, since by default
some browsers display submit inputs with `white-space: pre`, meaning
some of the text isn't visible on small screens.

[1] See pull request 40747 in https://github.com/rails/rails
---
 app/components/budgets/investments/votes_component.html.erb | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/app/components/budgets/investments/votes_component.html.erb b/app/components/budgets/investments/votes_component.html.erb
index 0535d9815..941b619b4 100644
--- a/app/components/budgets/investments/votes_component.html.erb
+++ b/app/components/budgets/investments/votes_component.html.erb
@@ -12,11 +12,13 @@
             <%= t("budgets.investments.votes.already_supported") %>
           </div>
           <% if feature?(:remove_investments_supports) %>
-            <%= button_to t("budgets.investments.votes.remove_support"), remove_support_path,
+            <%= button_to remove_support_path,
                 class: "button button-remove-support expanded",
                 method: "delete",
                 remote: true,
-                "aria-label": remove_support_aria_label %>
+                "aria-label": remove_support_aria_label do %>
+              <%= t("budgets.investments.votes.remove_support") %>
+            <% end %>
           <% end %>
         </div>
       <% else %>

From e54b6b3d97c9c4d78435f5f101a01c568721f93e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Javi=20Mart=C3=ADn?= <javim@elretirao.net>
Date: Mon, 8 Nov 2021 21:51:32 +0100
Subject: [PATCH 2/3] Increase investments width in management section

I'm not sure whether it now looks worse on extra large screens, but I'm
positive it looks much better on medium and large screens, particularly
when investments have images.
---
 app/views/management/budgets/investments/index.html.erb | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/views/management/budgets/investments/index.html.erb b/app/views/management/budgets/investments/index.html.erb
index ad00520b7..caad26e8b 100644
--- a/app/views/management/budgets/investments/index.html.erb
+++ b/app/views/management/budgets/investments/index.html.erb
@@ -4,7 +4,7 @@
   </span>
 
   <div class="wrap row">
-    <div id="budget-investments" class="budget-investments-list small-12 medium-9 column">
+    <div id="budget-investments" class="budget-investments-list small-12 column">
 
       <div class="small-12 search-results">
         <%= tag.h2 t("management.budget_investments.filters.unfeasible") if params[:unfeasible].present? %>

From a8ff04d9b7a9f53ccc7544cfc7b18ec49e29d6c9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Javi=20Mart=C3=ADn?= <javim@elretirao.net>
Date: Tue, 9 Nov 2021 12:26:13 +0100
Subject: [PATCH 3/3] Fix investments list layout on small screens

The flex layout didn't work well on small screens, since there was
barely any space for the elements.
---
 app/assets/stylesheets/participation.scss | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/app/assets/stylesheets/participation.scss b/app/assets/stylesheets/participation.scss
index 1f6e47636..85f8683e0 100644
--- a/app/assets/stylesheets/participation.scss
+++ b/app/assets/stylesheets/participation.scss
@@ -514,10 +514,10 @@
 
   @include breakpoint(medium) {
     min-height: $line-height * 15;
-  }
 
-  .with-image > .row {
-    display: flex;
+    .with-image > .row {
+      display: flex;
+    }
   }
 }