From fe92c77fcdf221ea9937cb4a22eed98f053041b5 Mon Sep 17 00:00:00 2001
From: zombieFox <crudetoaster@gmail.com>
Date: Thu, 27 Dec 2018 09:27:28 -0700
Subject: [PATCH] [design] improve head spacing

---
 css/grid.css | 17 ++++++-----------
 index.html   | 10 +++++-----
 2 files changed, 11 insertions(+), 16 deletions(-)

diff --git a/css/grid.css b/css/grid.css
index b1720b54..dfe51e31 100644
--- a/css/grid.css
+++ b/css/grid.css
@@ -10,7 +10,7 @@
 }
 
 .grid-item-head {
-  padding: 2em 2em 0 2em;
+  padding: 2em 2em 1em 2em;
   width: 100%;
 }
 
@@ -33,12 +33,7 @@
     padding-right: 8vw;
   }
 
-  .grid-item-head {
-    padding-top: 3em;
-  }
-
   .grid-item-body {
-    padding-bottom: 25vh;
     grid-template-columns: repeat(3, minmax(1em, 1fr));
   }
 }
@@ -51,12 +46,7 @@
     padding-right: 11vw;
   }
 
-  .grid-item-head {
-    padding-top: 4em;
-  }
-
   .grid-item-body {
-    padding-top: 3em;
     grid-template-columns: repeat(4, minmax(1em, 1fr));
   }
 }
@@ -69,6 +59,11 @@
     padding-right: 14vw;
   }
 
+  .grid-item-head {
+    padding-top: 3em;
+    padding-bottom: 2em;
+  }
+
   .grid-item-body {
     grid-template-columns: repeat(5, minmax(1em, 1fr));
   }
diff --git a/index.html b/index.html
index 734b39db..0fe50fee 100644
--- a/index.html
+++ b/index.html
@@ -30,10 +30,10 @@
 
     <div class="grid-item-head">
       <div class="head">
-        <div class="head-item mb-3 mb-lg-0">
+        <div class="head-item mb-3 mb-xl-0">
           <p class="clock"></p>
         </div>
-        <div class="head-item head-search mb-3 mb-lg-0">
+        <div class="head-item head-search mb-3 mb-xl-0">
           <form class="search" action="http://www.google.com/search" method="get">
             <input class="search-input mb-0" type="text" placeholder="Find bookmarks or search" tabindex="1" name="q" autocomplete="off" tabindex="1">
             <input type="submit" value="Search" class="is-hidden">
@@ -42,7 +42,7 @@
             <span class="icon-close"></span>
           </button>
         </div>
-        <div class="head-item button-group mb-3 mb-lg-0">
+        <div class="head-item button-group mb-3 mb-xl-0">
           <button class="button mb-0 control-add" tabindex="1">
             <span class="button-text">Add</span>
           </button>
@@ -50,7 +50,7 @@
             <span class="button-text">Edit</span>
           </button>
         </div>
-        <div class="head-item button-group mb-3 mb-lg-0">
+        <div class="head-item button-group mb-3 mb-xl-0">
           <button class="button mb-0 control-link-list" tabindex="1">
             <span class="button-text">List</span>
           </button>
@@ -58,7 +58,7 @@
             <span class="button-text">Block</span>
           </button>
         </div>
-        <div class="head-item mb-3 mb-lg-0">
+        <div class="head-item mb-3 mb-xl-0">
           <form class="theme">
             <label class="button mb-0 theme-label" for="accent-picker">
               <span class="button-text">Accent</span>