From 21bc57bc2496005888a95f7b01b5c2627c315a78 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C5=81ukasz=20Mierzwa?= <l.mierzwa@gmail.com>
Date: Fri, 26 Oct 2018 22:55:26 +0100
Subject: [PATCH 1/2] fix(ui): use correct classes for not yet applied filters

---
 ui/src/Components/Labels/FilterInputLabel/index.js | 12 ++++++++----
 1 file changed, 8 insertions(+), 4 deletions(-)

diff --git a/ui/src/Components/Labels/FilterInputLabel/index.js b/ui/src/Components/Labels/FilterInputLabel/index.js
index a7f1d0d07..648bd900e 100644
--- a/ui/src/Components/Labels/FilterInputLabel/index.js
+++ b/ui/src/Components/Labels/FilterInputLabel/index.js
@@ -56,7 +56,10 @@ const FilterInputLabel = observer(
           className={
             filter.applied
               ? cs.className
-              : ["badge-secondary", ...cs.baseClassNames].join(" ")
+              : [
+                  "badge-secondary components-filteredinputlabel",
+                  ...cs.baseClassNames
+                ].join(" ")
           }
           style={cs.style}
         >
@@ -67,7 +70,9 @@ const FilterInputLabel = observer(
             onClick={() => alertStore.filters.removeFilter(filter.raw)}
           >
             <span
-              className={`align-text-bottom ${cs.colorClassNames.join(" ")}`}
+              className={`align-text-bottom ${cs.colorClassNames
+                .filter(c => !c.match(/badge-/))
+                .join(" ")}`}
             >
               &times;
             </span>
@@ -78,7 +83,7 @@ const FilterInputLabel = observer(
                 {filter.hits}
               </span>
             ) : (
-              <span className="mr-1">
+              <span className="badge mr-1">
                 <FontAwesomeIcon icon={faSpinner} spin />
               </span>
             )
@@ -93,7 +98,6 @@ const FilterInputLabel = observer(
               value={filter.raw}
               propName="raw"
               change={this.onChange}
-              className={cs.colorClassNames.join(" ")}
               classEditing="py-0 border-0 bg-light"
             />
           </TooltipWrapper>

From 87540017a4dc81ccce36b001b6f31d572075b2d3 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C5=81ukasz=20Mierzwa?= <l.mierzwa@gmail.com>
Date: Fri, 26 Oct 2018 22:56:40 +0100
Subject: [PATCH 2/2] chore(ui): drop margin between annotations and labels

---
 .../AlertGrid/AlertGroup/Alert/__snapshots__/index.test.js.snap | 2 +-
 ui/src/Components/Grid/AlertGrid/AlertGroup/Alert/index.js      | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/ui/src/Components/Grid/AlertGrid/AlertGroup/Alert/__snapshots__/index.test.js.snap b/ui/src/Components/Grid/AlertGrid/AlertGroup/Alert/__snapshots__/index.test.js.snap
index 35bfcde0d..3b2611ef3 100644
--- a/ui/src/Components/Grid/AlertGrid/AlertGroup/Alert/__snapshots__/index.test.js.snap
+++ b/ui/src/Components/Grid/AlertGrid/AlertGroup/Alert/__snapshots__/index.test.js.snap
@@ -3,7 +3,7 @@
 exports[`<Alert /> matches snapshot with showAlertmanagers=false showReceiver=false 1`] = `
 "
 <li class=\\"components-grid-alertgrid-alertgroup-alert list-group-item pl-1 pr-0 py-0 my-1 rounded-0 border-left-1 border-right-0 border-top-0 border-bottom-0 border-danger\\">
-  <div class=\\"mb-1\\">
+  <div>
     <div class=\\"mr-1 mb-1 p-1 bg-light cursor-pointer d-inline-block rounded components-grid-annotation\\">
       <svg aria-hidden=\\"true\\"
            data-prefix=\\"fas\\"
diff --git a/ui/src/Components/Grid/AlertGrid/AlertGroup/Alert/index.js b/ui/src/Components/Grid/AlertGrid/AlertGroup/Alert/index.js
index 0c1d5b844..20317401b 100644
--- a/ui/src/Components/Grid/AlertGrid/AlertGroup/Alert/index.js
+++ b/ui/src/Components/Grid/AlertGrid/AlertGroup/Alert/index.js
@@ -47,7 +47,7 @@ const Alert = observer(
 
       return (
         <li className={classNames.join(" ")}>
-          <div className="mb-1">
+          <div>
             {alert.annotations.filter(a => a.isLink === false).map(a => (
               <RenderNonLinkAnnotation
                 key={a.name}