From 6a97bf09918ba090f74b0414f0cdb05071fb6513 Mon Sep 17 00:00:00 2001
From: Matias De lellis <mati86dl@gmail.com>
Date: Tue, 26 May 2020 23:31:02 -0300
Subject: [PATCH] Add icon to tags on notes.

---
 css/style.css                     | 11 +++++++++--
 js/script.js                      |  2 +-
 js/templates/note-item.handlebars |  2 +-
 js/templates/notes.handlebars     |  2 +-
 4 files changed, 12 insertions(+), 5 deletions(-)

diff --git a/css/style.css b/css/style.css
index c103f2b..940920d 100644
--- a/css/style.css
+++ b/css/style.css
@@ -221,9 +221,16 @@ div[contenteditable="true"] {
 
 .slim-tag {
     display: inline-block;
-    padding: 3px 5px;
+    padding: 0px 6px 0 24px;
     background-color: rgba(0,0,0,0.08);
-    border-radius: 12px;
+    background-position: 8px center;
+    opacity: 0.7;
+    border-radius: 10px;
+    font-size: 90%;
+}
+
+.note-tags {
+    margin-top: 10px;
 }
 
 /* Restore defaults select2 rules */
diff --git a/js/script.js b/js/script.js
index 0195ed5..866a72d 100644
--- a/js/script.js
+++ b/js/script.js
@@ -675,7 +675,7 @@ View.prototype = {
                         modalTags.html('');
                         newTags.forEach(function (item, index) {
                             var noteId = parseInt(item.id) || -1;
-                            var tag = $('<div class="slim-tag" tag-id="' + noteId + '">' + item.text + '</div>');
+                            var tag = $('<div class="icon-tag slim-tag" tag-id="' + noteId + '">' + item.text + '</div>');
                             modalTags.append(tag);
                         });
                     }
diff --git a/js/templates/note-item.handlebars b/js/templates/note-item.handlebars
index 45ec743..2adfeb2 100644
--- a/js/templates/note-item.handlebars
+++ b/js/templates/note-item.handlebars
@@ -27,7 +27,7 @@
 		</div>
 		<div class='note-tags'>
 			{{#each tags}}
-				<div class="slim-tag" tag-id="{{ id }}">{{{ name }}}</div>
+				<div class="icon-tag slim-tag" tag-id="{{ id }}">{{{ name }}}</div>
 			{{/each}}
 		</div>
 		{{/if}}
diff --git a/js/templates/notes.handlebars b/js/templates/notes.handlebars
index 91755e6..ff12609 100644
--- a/js/templates/notes.handlebars
+++ b/js/templates/notes.handlebars
@@ -30,7 +30,7 @@
 			</div>
 			<div class='note-tags'>
 				{{#each tags}}
-					<div class='slim-tag' tag-id="{{ id }}">
+					<div class='icon-tag slim-tag' tag-id="{{ id }}">
 						{{{ name }}}
 					</div>
 				{{/each}}