From c2013d4a055cb857264d4327c92e8ef015dc94c9 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C5=81ukasz=20Mierzwa?= <l.mierzwa@gmail.com>
Date: Tue, 1 Jun 2021 18:17:06 +0100
Subject: [PATCH] fix(ui): tweak swimline css

---
 ui/src/Components/Grid/AlertGrid/Swimlane.tsx | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

diff --git a/ui/src/Components/Grid/AlertGrid/Swimlane.tsx b/ui/src/Components/Grid/AlertGrid/Swimlane.tsx
index 567fbcb4e..dd4c5d61f 100644
--- a/ui/src/Components/Grid/AlertGrid/Swimlane.tsx
+++ b/ui/src/Components/Grid/AlertGrid/Swimlane.tsx
@@ -21,12 +21,15 @@ const Swimlane: FC<{
 }> = ({ alertStore, settingsStore, grid, isExpanded, onToggle }) => {
   return (
     <h5 className="components-grid-swimlane d-flex flex-row justify-content-between rounded px-2 py-1 my-1 border border-dark">
-      <span className="flex-shrink-0 flex-grow-0">
+      <span className="flex-shrink-0 flex-grow-0 d-none d-sm-block">
         <span className="badge components-label px-0 ms-1 me-3">
           <FontAwesomeIcon icon={faTh} className="text-muted" />
         </span>
       </span>
-      <span className="flex-shrink-1 flex-grow-0" style={{ minWidth: "0px" }}>
+      <span
+        className="flex-shrink-1 flex-grow-0 ms-1 ms-sm-0"
+        style={{ minWidth: "0px" }}
+      >
         {grid.labelName !== "" && grid.labelValue !== "" && (
           <FilteringLabel
             key={grid.labelValue}
@@ -71,7 +74,7 @@ const Swimlane: FC<{
           alertStore={alertStore}
         />
         <span
-          className="text-muted cursor-pointer badge with-click with-click-dark components-label ms-2 me-1"
+          className="text-muted cursor-pointer badge with-click with-click-dark components-label ms-1 me-0"
           onClick={onToggle}
         >
           <TooltipWrapper title="Click to toggle this grid details or Alt+Click to toggle all grids">