From 846b927459974f5d4c817e4abff2a0cd0b67a7e0 Mon Sep 17 00:00:00 2001
From: Chris Hill-Scott <me@quis.cc>
Date: Mon, 29 Oct 2018 14:24:44 +0000
Subject: [PATCH] Make spacing tighter on templates page
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The prototype for folders tightens up the templates page to fit more
templates on the screen. Partly because it looks better, and partly
because the sticky bottom toolbar means that there’s less available
space. So reducing the spacing means that roughly the same number of
templates fit on the screen.

For those who won’t see the checkboxes (people who don’t have the send
permission) or use folders, this just means that they’ll have slightly
less scrolling to do if they have a lot of templates.

Doing this before adding the folders so that:
- we roll out changes more gradually
- once we add the folders we can see if the spacing has stayed
  consistent
- changing where the margins are applied to resolve the inconsistent
  spacing when there is/isn’t tabbed navigation or a search box shown
---
 app/assets/stylesheets/components/message.scss | 8 ++++++--
 app/templates/views/templates/choose.html      | 2 +-
 2 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/app/assets/stylesheets/components/message.scss b/app/assets/stylesheets/components/message.scss
index 37de83af6..db9f6a0a5 100644
--- a/app/assets/stylesheets/components/message.scss
+++ b/app/assets/stylesheets/components/message.scss
@@ -2,7 +2,7 @@
 
   &-name {
     @include bold-24;
-    margin: 20px 0 5px 0;
+    margin: 0;
 
     a {
       display: block;
@@ -14,8 +14,12 @@
 
   &-type {
     color: $secondary-text-colour;
-    margin-bottom: $gutter / 3;
+    margin: 0 0 $gutter-two-thirds 0;
     pointer-events: none;
   }
 
 }
+
+#template-list {
+  margin-top: $gutter;
+}
diff --git a/app/templates/views/templates/choose.html b/app/templates/views/templates/choose.html
index 361dcb638..e69ac226a 100644
--- a/app/templates/views/templates/choose.html
+++ b/app/templates/views/templates/choose.html
@@ -51,7 +51,7 @@
     </div>
 
     {% if show_template_nav %}
-      <div class="bottom-gutter-2-3">
+      <div class="bottom-gutter">
         {{ pill(template_nav_items, current_value=template_type, show_count=False) }}
       </div>
     {% endif %}