Move Tags above Notes on navigation and misc styles fixes

css/style.scss

@@ -34,7 +34,7 @@
     min-height: 150px;
     width: 250px;
     padding: 10px;
-    border-radius: 3px;
+    border-radius: 8px;
     box-shadow: 0 4px 6px #c1c1c1;
 }
 
@@ -150,9 +150,7 @@
 }
 
 .circle-toolbar:hover {
-   color: #ccc;
-   text-decoration:none;
-   background:#333;
+   border-color: var(--color-primary-element);
 }
 
 .any-color {
@@ -165,8 +163,9 @@
     margin: 0 auto;
     padding: 15px;
 }
+
 .note-grid-item {
-  margin-bottom: 10px;
+  margin-bottom: 14px;
 }
 
 /* Modal Note */

js/script.js

@@ -464,7 +464,7 @@ View.prototype = {
             masonry: {
                 isFitWidth: true,
                 fitWidth: true,
-                gutter: 10,
+                gutter: 14,
             },
             sortBy: 'pinnedNote',
             getSortData: {

js/templates/navigation.handlebars

@@ -20,17 +20,6 @@
 		</li>
 	</ul>
 </li>
-<li id="notes-folder" class="collapsible open">
-	<button class="collapse"></button>
-	<a href="#" class="icon-folder svg">{{notesTxt}}</a>
-	<ul>
-		{{#each notes}}
-			<li class="nav-note with-menu {{#if active}}active{{/if}}"  data-id="{{ id }}">
-				<a href="#">{{{ title }}}</a>
-			</li>
-		{{/each}}
-	</ul>
-</li>
 <li id="tags-folder" class="collapsible open">
 	<button class="collapse"></button>
 	<a href="#" class="icon-tag svg">{{tagsTxt}}</a>
@@ -42,3 +31,14 @@
 		{{/each}}
 	</ul>
 </li>
+<li id="notes-folder" class="collapsible open">
+	<button class="collapse"></button>
+	<a href="#" class="icon-quicknotes svg">{{notesTxt}}</a>
+	<ul>
+		{{#each notes}}
+			<li class="nav-note with-menu {{#if active}}active{{/if}}"  data-id="{{ id }}">
+				<a href="#">{{{ title }}}</a>
+			</li>
+		{{/each}}
+	</ul>
+</li>