From b3be7df890d282f6d1c5dcdedf92573ff3dfa2e8 Mon Sep 17 00:00:00 2001
From: Alejandro Celaya <alejandro@alejandrocelaya.com>
Date: Fri, 10 Aug 2018 22:27:50 +0200
Subject: [PATCH] Improved tags filtering control

---
 src/short-urls/SearchBar.js   | 3 ++-
 src/short-urls/SearchBar.scss | 4 ++++
 src/utils/Tag.scss            | 4 ++--
 3 files changed, 8 insertions(+), 3 deletions(-)

diff --git a/src/short-urls/SearchBar.js b/src/short-urls/SearchBar.js
index 5feaf65a..d82ae9f2 100644
--- a/src/short-urls/SearchBar.js
+++ b/src/short-urls/SearchBar.js
@@ -1,4 +1,5 @@
 import searchIcon from '@fortawesome/fontawesome-free-solid/faSearch';
+import tagsIcon from '@fortawesome/fontawesome-free-solid/faTags';
 import FontAwesomeIcon from '@fortawesome/react-fontawesome';
 import React from 'react';
 import { connect } from 'react-redux';
@@ -41,7 +42,7 @@ export class SearchBar extends React.Component {
 
         {!isEmpty(selectedTags) && (
           <h4 className="search-bar__selected-tag mt-2">
-            <small>Filtering by tags:</small>
+            <FontAwesomeIcon icon={tagsIcon} className="search-bar__tags-icon" />
             &nbsp;
             {selectedTags.map(tag => <Tag
               text={tag}
diff --git a/src/short-urls/SearchBar.scss b/src/short-urls/SearchBar.scss
index 009de586..eb4f37f9 100644
--- a/src/short-urls/SearchBar.scss
+++ b/src/short-urls/SearchBar.scss
@@ -19,3 +19,7 @@
   @include vertical-align();
   right: 15px;
 }
+
+.search-bar__tags-icon {
+  vertical-align: bottom;
+}
diff --git a/src/utils/Tag.scss b/src/utils/Tag.scss
index 24a838e3..757abd36 100644
--- a/src/utils/Tag.scss
+++ b/src/utils/Tag.scss
@@ -16,6 +16,6 @@
 }
 
 .tag__close-selected-tag.tag__close-selected-tag:hover {
-  color: inherit;
-  opacity: 1;
+  color: inherit !important;
+  opacity: 1 !important;
 }