From a293dc013d1d10569935b7b389a4d2a7abebcbd5 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Javi=20Mart=C3=ADn?= <javim@elretirao.net>
Date: Sat, 9 May 2020 00:21:12 +0200
Subject: [PATCH] Make management layout similar to admin layout

The <main> tag was including the navigation, and now we use the same
flex layout, making it more accessible for mobile phone users.

I'm not sure the <main> tag should actually include the account info and
the flash message. I'm keeping it like this in order to keep the layout
the way it was.
---
 app/assets/stylesheets/admin.scss           |  2 +-
 app/views/layouts/management.html.erb       | 19 +++---
 app/views/management/_account_info.html.erb | 65 ++++++++++-----------
 3 files changed, 43 insertions(+), 43 deletions(-)

diff --git a/app/assets/stylesheets/admin.scss b/app/assets/stylesheets/admin.scss
index d3709a73f..8dc11daae 100644
--- a/app/assets/stylesheets/admin.scss
+++ b/app/assets/stylesheets/admin.scss
@@ -648,7 +648,7 @@ code {
   border-radius: rem-calc(3);
   font-size: rem-calc(16);
   font-weight: normal;
-  margin: $line-height;
+  margin-bottom: $line-height;
   padding: $line-height / 2;
 
   strong {
diff --git a/app/views/layouts/management.html.erb b/app/views/layouts/management.html.erb
index b16d1778e..449b20a76 100644
--- a/app/views/layouts/management.html.erb
+++ b/app/views/layouts/management.html.erb
@@ -45,18 +45,21 @@
       </div>
     </header>
 
-    <main class="no-margin-top row expanded collapse">
-      <div class="small-12 medium-3 column admin-sidebar">
+    <div class="menu-and-content no-margin-top">
+      <%= check_box_tag :show_menu, nil, false, role: "switch" %>
+
+      <nav class="admin-sidebar">
         <%= render "/management/menu" %>
-      </div>
+      </nav>
 
-      <%= render "management/account_info" %>
+      <main class="admin-content">
+        <%= label_tag :show_menu, t("admin.menu.admin"),
+                      "aria-hidden": true, class: "button hollow expanded" %>
 
-      <div class="admin-content small-12 medium-9 column">
+        <%= render "management/account_info" %>
         <%= render "layouts/flash" %>
         <%= yield %>
-      </div>
-    </main>
-
+      </main>
+    </div>
   </body>
 </html>
diff --git a/app/views/management/_account_info.html.erb b/app/views/management/_account_info.html.erb
index 28f141ba9..cb262a9ef 100644
--- a/app/views/management/_account_info.html.erb
+++ b/app/views/management/_account_info.html.erb
@@ -1,43 +1,40 @@
 <% if managed_user.document_number.present? %>
-  <section class="small-12 medium-9 column">
-    <div class="account-info">
-
-      <%= link_to(t("management.account_info.change_user"),
-                    logout_management_users_path,
-                    method: :delete,
-                    class: "float-right btchange-user button hollow") %>
-
-      <% if managed_user.level_two_or_three_verified? %>
-        <p>
-          <strong>
-            <%= t("management.account_info.identified_label") %>
-          </strong>
-        </p>
-      <% end %>
-
-      <% if managed_user.username.present? %>
-        <p>
-          <%= t("management.account_info.username_label") %>
-          <strong><%= managed_user.username %></strong>
-        </p>
-      <% end %>
-
-      <% if managed_user.email.present? %>
-        <p>
-          <%= t("management.account_info.email_label") %>
-          <strong><%= managed_user.email %></strong>
-        </p>
-      <% end %>
+  <section class="account-info">
+    <%= link_to(t("management.account_info.change_user"),
+                  logout_management_users_path,
+                  method: :delete,
+                  class: "float-right btchange-user button hollow") %>
 
+    <% if managed_user.level_two_or_three_verified? %>
       <p>
-        <%= t("management.account_info.document_type_label") %>
-        <strong><%= humanize_document_type(managed_user.document_type) %></strong>
+        <strong>
+          <%= t("management.account_info.identified_label") %>
+        </strong>
       </p>
+    <% end %>
 
+    <% if managed_user.username.present? %>
       <p>
-        <%= t("management.account_info.document_number_label") %>
-        <strong><%= managed_user.document_number %></strong>
+        <%= t("management.account_info.username_label") %>
+        <strong><%= managed_user.username %></strong>
       </p>
-    </div>
+    <% end %>
+
+    <% if managed_user.email.present? %>
+      <p>
+        <%= t("management.account_info.email_label") %>
+        <strong><%= managed_user.email %></strong>
+      </p>
+    <% end %>
+
+    <p>
+      <%= t("management.account_info.document_type_label") %>
+      <strong><%= humanize_document_type(managed_user.document_type) %></strong>
+    </p>
+
+    <p>
+      <%= t("management.account_info.document_number_label") %>
+      <strong><%= managed_user.document_number %></strong>
+    </p>
   </section>
 <% end %>