From 33ab70920949d0093e93fe2370eb31c3fecfdbe9 Mon Sep 17 00:00:00 2001
From: azivner <adam.zivner@gmail.com>
Date: Mon, 4 Dec 2017 18:21:57 -0500
Subject: [PATCH] spacing between action buttons and pointer cursor

---
 public/stylesheets/style.css |  4 ++++
 views/index.ejs              | 28 +++++++++++++++-------------
 2 files changed, 19 insertions(+), 13 deletions(-)

diff --git a/public/stylesheets/style.css b/public/stylesheets/style.css
index 61c90e2c0..bfe20189f 100644
--- a/public/stylesheets/style.css
+++ b/public/stylesheets/style.css
@@ -83,6 +83,10 @@ span.fancytree-node.fancytree-active-clone:not(.fancytree-active) .fancytree-tit
     text-decoration: none;
 }
 
+.icon-action {
+    cursor: pointer;
+}
+
 #protect-button, #unprotect-button {
     display: none;
 }
diff --git a/views/index.ejs b/views/index.ejs
index 1e92f0d62..ced6e97b4 100644
--- a/views/index.ejs
+++ b/views/index.ejs
@@ -33,22 +33,24 @@
         </div>
       </div>
 
-      <div class="hide-toggle" style="grid-area: tree-actions">
-        <a onclick="noteTree.createNewTopLevelNote()" title="Create new top level note" class="icon-action">
-          <img src="images/icons/file-plus.png" alt="Create new top level note"/>
-        </a>
+      <div class="hide-toggle" style="grid-area: tree-actions;">
+        <div style="display: flex; justify-content: space-evenly; padding: 10px;">
+          <a onclick="noteTree.createNewTopLevelNote()" title="Create new top level note" class="icon-action">
+            <img src="images/icons/file-plus.png" alt="Create new top level note"/>
+          </a>
 
-        <a onclick="noteTree.collapseTree()" title="Collapse tree" class="icon-action">
-          <img src="images/icons/list.png" alt="Collapse tree"/>
-        </a>
+          <a onclick="noteTree.collapseTree()" title="Collapse tree" class="icon-action">
+            <img src="images/icons/list.png" alt="Collapse tree"/>
+          </a>
 
-        <a onclick="noteTree.scrollToCurrentNote()" title="Scroll to current note" class="icon-action">
-          <img src="images/icons/crosshair.png" alt="Collapse tree"/>
-        </a>
+          <a onclick="noteTree.scrollToCurrentNote()" title="Scroll to current note" class="icon-action">
+            <img src="images/icons/crosshair.png" alt="Collapse tree"/>
+          </a>
 
-        <a onclick="searchTree.toggleSearch()" title="Search in notes" class="icon-action">
-          <img src="images/icons/search.png" alt="Search in notes"/>
-        </a>
+          <a onclick="searchTree.toggleSearch()" title="Search in notes" class="icon-action">
+            <img src="images/icons/search.png" alt="Search in notes"/>
+          </a>
+        </div>
 
         <div id="search-box" style="display: none; padding: 10px; margin-top: 10px;">
           <p>