improve close tag icons

dboudro · Aug 4, 2019 · 59a090a · 59a090a
1 parent 0e2876f
commit 59a090a
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 3 deletions.
diff --git a/css/index.css b/css/index.css
@@ -103,6 +103,15 @@ $color5: rgba(233, 188, 183, 1);
   color: #ee8064 !important;
   }
 
+    .darkmode--activated .close-tag-icon {
+      color: #f8c9bd !important;
+    }
+
+     .darkmode--activated .tag-button:hover > .close-tag-icon {
+      color: #ee8064 !important;
+
+    }
+
     .page-title a {
       color: black;
       text-decoration: none;
@@ -254,12 +263,13 @@ $color5: rgba(233, 188, 183, 1);
       margin-bottom: 14px;
     }
 
-    .fa-minus-square {
+    .close-tag-icon {
       color: #ccc !important;
     }
 
-     .tag-button:hover > i.fa-minus-square {
+     .tag-button:hover > .close-tag-icon {
       color: beige !important;
+       visibility: visible;
 
     }
 
@@ -367,6 +377,10 @@ $color5: rgba(233, 188, 183, 1);
       top: 7px;
       visibility: hidden;
     }
+    .close-tag-icon {
+       font-family: font-awesome-solid;
+      visibility: hidden;
+     }
 
     .favorite-icon-selected {
       color: orange;

diff --git a/index.html b/index.html
@@ -76,7 +76,7 @@ <h1 class="page-title"><a href=".">Roots Network</a></h1>
         {{link.text}}</a>
 <!--       <p> {{link.description}} </p> -->
       <button v-for="tag in link.taglist" class="tag-button"> {{tag}}
-        <i class="fas dl fa-minus-square" v-on:click="removeTag(link, tag)"></i></button>
+        <i class="fas fa-times close-tag-icon" v-on:click="removeTag(link, tag)"></i></button>
     </li>
   </ul>
 </div>