From 03e598a53ddae268379cec402a2e46e4d5cbfdf8 Mon Sep 17 00:00:00 2001
From: Alberto <alberto@decabeza.es>
Date: Sat, 21 Mar 2020 03:45:59 +0100
Subject: [PATCH] Improve layout in budget groups form

---
 .../stylesheets/admin/budget_groups/form.scss |  3 ++
 .../stylesheets/admin/budgets/form.scss       |  5 +--
 app/assets/stylesheets/mixins/layouts.scss    |  6 ++++
 app/views/admin/budget_groups/_form.html.erb  | 35 ++++++++-----------
 4 files changed, 24 insertions(+), 25 deletions(-)
 create mode 100644 app/assets/stylesheets/admin/budget_groups/form.scss

diff --git a/app/assets/stylesheets/admin/budget_groups/form.scss b/app/assets/stylesheets/admin/budget_groups/form.scss
new file mode 100644
index 000000000..a34dbaf8a
--- /dev/null
+++ b/app/assets/stylesheets/admin/budget_groups/form.scss
@@ -0,0 +1,3 @@
+.admin .budget-groups-form {
+  @include full-width-form;
+}
diff --git a/app/assets/stylesheets/admin/budgets/form.scss b/app/assets/stylesheets/admin/budgets/form.scss
index 0fef7a2e6..9d0407030 100644
--- a/app/assets/stylesheets/admin/budgets/form.scss
+++ b/app/assets/stylesheets/admin/budgets/form.scss
@@ -1,4 +1,5 @@
 .admin .budgets-form {
+  @include full-width-form;
 
   > fieldset {
     border-top: 4px solid $admin-border-color;
@@ -17,8 +18,4 @@
       text-transform: uppercase;
     }
   }
-
-  .globalize-languages {
-    max-width: none;
-  }
 }
diff --git a/app/assets/stylesheets/mixins/layouts.scss b/app/assets/stylesheets/mixins/layouts.scss
index ee5422be9..38f53974e 100644
--- a/app/assets/stylesheets/mixins/layouts.scss
+++ b/app/assets/stylesheets/mixins/layouts.scss
@@ -21,3 +21,9 @@
     margin-top: 0;
   }
 }
+
+@mixin full-width-form {
+  .globalize-languages {
+    max-width: none;
+  }
+}
diff --git a/app/views/admin/budget_groups/_form.html.erb b/app/views/admin/budget_groups/_form.html.erb
index b50378063..8c152c3c5 100644
--- a/app/views/admin/budget_groups/_form.html.erb
+++ b/app/views/admin/budget_groups/_form.html.erb
@@ -1,30 +1,23 @@
-<%= render "shared/globalize_locales", resource: group %>
-
-<%= translatable_form_for group, url: path do |f| %>
+<%= translatable_form_for group, url: path, html: { class: "budget-groups-form" } do |f| %>
+  <%= render "shared/globalize_locales", resource: group %>
 
   <%= render "shared/errors", resource: group %>
 
-  <div class="row">
-    <%= f.translatable_fields do |translations_form| %>
-      <div class="small-12 medium-6 column end">
-        <%= translations_form.text_field :name, maxlength: 50 %>
-      </div>
-    <% end %>
-  </div>
-
-  <% if group.persisted? %>
-    <div class="row">
-      <div class="small-12 medium-6 column">
-        <%= f.select :max_votable_headings,
-                     (1..group.headings.count),
-                     hint: t("admin.budget_groups.form.max_votable_headings_info") %>
-      </div>
+  <%= f.translatable_fields do |translations_form| %>
+    <div class="small-12 medium-6 column end">
+      <%= translations_form.text_field :name, maxlength: 50 %>
     </div>
   <% end %>
 
-  <div class="row">
-    <div class="small-12 medium-6 column">
-      <%= f.submit t("admin.budget_groups.form.#{action}"), class: "button success" %>
+  <% if group.persisted? %>
+    <div class="small-12 medium-6 column margin">
+      <%= f.select :max_votable_headings,
+                   (1..group.headings.count),
+                   hint: t("admin.budget_groups.form.max_votable_headings_info") %>
     </div>
+  <% end %>
+
+  <div class="clear">
+    <%= f.submit t("admin.budget_groups.form.#{action}"), class: "button hollow" %>
   </div>
 <% end %>