From 903752a5ed8e2004478367e167b7186e70adfb04 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C5=81ukasz=20Mierzwa?= <l.mierzwa@gmail.com>
Date: Tue, 8 Oct 2019 09:47:08 +0100
Subject: [PATCH] fix(ui): align labels in the overview modal

Moves the left column labels to the top, since the right side will have progress bars
at the bottom which makes them taller
---
 ui/src/Components/OverviewModal/OverviewModalContent.js     | 2 +-
 .../__snapshots__/OverviewModalContent.test.js.snap         | 6 +++---
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/ui/src/Components/OverviewModal/OverviewModalContent.js b/ui/src/Components/OverviewModal/OverviewModalContent.js
index 999aba214..f27239f75 100644
--- a/ui/src/Components/OverviewModal/OverviewModalContent.js
+++ b/ui/src/Components/OverviewModal/OverviewModalContent.js
@@ -16,7 +16,7 @@ const TableRows = observer(({ alertStore, nameStats }) =>
   nameStats.map(nameStats => (
     <tr key={nameStats.name}>
       <td width="25%" className="text-nowrap mw-100 p-1">
-        <span className="badge badge-light components-label mx-0 my-1 pl-0 text-left">
+        <span className="badge badge-light components-label mx-0 mt-0 mb-auto pl-0 text-left">
           <span className="bg-primary text-white mr-1 px-1 components-labelWithPercent-percent">
             {nameStats.hits}
           </span>
diff --git a/ui/src/Components/OverviewModal/__snapshots__/OverviewModalContent.test.js.snap b/ui/src/Components/OverviewModal/__snapshots__/OverviewModalContent.test.js.snap
index 8b8df63a6..741eece48 100644
--- a/ui/src/Components/OverviewModal/__snapshots__/OverviewModalContent.test.js.snap
+++ b/ui/src/Components/OverviewModal/__snapshots__/OverviewModalContent.test.js.snap
@@ -24,7 +24,7 @@ exports[`<OverviewModalContent /> matches snapshot with labels to show 1`] = `
           <td width=\\"25%\\"
               class=\\"text-nowrap mw-100 p-1\\"
           >
-            <span class=\\"badge badge-light components-label mx-0 my-1 pl-0 text-left\\">
+            <span class=\\"badge badge-light components-label mx-0 mt-0 mb-auto pl-0 text-left\\">
               <span class=\\"bg-primary text-white mr-1 px-1 components-labelWithPercent-percent\\">
                 16
               </span>
@@ -131,7 +131,7 @@ exports[`<OverviewModalContent /> matches snapshot with labels to show 1`] = `
           <td width=\\"25%\\"
               class=\\"text-nowrap mw-100 p-1\\"
           >
-            <span class=\\"badge badge-light components-label mx-0 my-1 pl-0 text-left\\">
+            <span class=\\"badge badge-light components-label mx-0 mt-0 mb-auto pl-0 text-left\\">
               <span class=\\"bg-primary text-white mr-1 px-1 components-labelWithPercent-percent\\">
                 20
               </span>
@@ -439,7 +439,7 @@ exports[`<OverviewModalContent /> matches snapshot with labels to show 1`] = `
           <td width=\\"25%\\"
               class=\\"text-nowrap mw-100 p-1\\"
           >
-            <span class=\\"badge badge-light components-label mx-0 my-1 pl-0 text-left\\">
+            <span class=\\"badge badge-light components-label mx-0 mt-0 mb-auto pl-0 text-left\\">
               <span class=\\"bg-primary text-white mr-1 px-1 components-labelWithPercent-percent\\">
                 5
               </span>