From 32b7e494fdd2c320315bd35884a9ff8b7855c256 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=C5=81ukasz=20Mierzwa?= <l.mierzwa@gmail.com>
Date: Sun, 16 Sep 2018 21:47:11 +0100
Subject: [PATCH] chore(ui): make link annotations look more like links and
 less like labels

---
 .../AlertGroup/Alert/__snapshots__/index.test.js.snap      | 2 +-
 .../AlertGroup/Annotation/__snapshots__/index.test.js.snap | 2 +-
 .../Grid/AlertGrid/AlertGroup/Annotation/index.css         | 7 +++++++
 .../Grid/AlertGrid/AlertGroup/Annotation/index.js          | 2 +-
 .../GroupFooter/__snapshots__/index.test.js.snap           | 2 +-
 5 files changed, 11 insertions(+), 4 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 22eb955a9..9ab14ce9b 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
@@ -71,7 +71,7 @@ exports[`<Alert /> matches snapshot with showAlertmanagers=false showReceiver=fa
   <a href=\\"http://localhost\\"
      target=\\"_blank\\"
      rel=\\"noopener noreferrer\\"
-     class=\\"components-label-with-hover text-nowrap text-truncate badge badge-secondary mr-1\\"
+     class=\\"components-label-with-hover text-nowrap text-truncate badge mr-1 components-grid-annotation-link\\"
   >
     <svg aria-hidden=\\"true\\"
          data-prefix=\\"fas\\"
diff --git a/ui/src/Components/Grid/AlertGrid/AlertGroup/Annotation/__snapshots__/index.test.js.snap b/ui/src/Components/Grid/AlertGrid/AlertGroup/Annotation/__snapshots__/index.test.js.snap
index 0de43d9fd..5f9775b2b 100644
--- a/ui/src/Components/Grid/AlertGrid/AlertGroup/Annotation/__snapshots__/index.test.js.snap
+++ b/ui/src/Components/Grid/AlertGrid/AlertGroup/Annotation/__snapshots__/index.test.js.snap
@@ -5,7 +5,7 @@ exports[`<RenderLinkAnnotation /> matches snapshot 1`] = `
 <a href=\\"http://localhost/foo\\"
    target=\\"_blank\\"
    rel=\\"noopener noreferrer\\"
-   class=\\"components-label-with-hover text-nowrap text-truncate badge badge-secondary mr-1\\"
+   class=\\"components-label-with-hover text-nowrap text-truncate badge mr-1 components-grid-annotation-link\\"
 >
   <svg aria-hidden=\\"true\\"
        data-prefix=\\"fas\\"
diff --git a/ui/src/Components/Grid/AlertGrid/AlertGroup/Annotation/index.css b/ui/src/Components/Grid/AlertGrid/AlertGroup/Annotation/index.css
index 58ac27a2d..46c2961ab 100644
--- a/ui/src/Components/Grid/AlertGrid/AlertGroup/Annotation/index.css
+++ b/ui/src/Components/Grid/AlertGrid/AlertGroup/Annotation/index.css
@@ -1,3 +1,10 @@
 .components-grid-annotation {
   font-size: 90%;
 }
+
+.components-grid-annotation-link {
+  text-decoration: underline;
+}
+.components-grid-annotation-link:hover {
+  text-decoration: underline;
+}
diff --git a/ui/src/Components/Grid/AlertGrid/AlertGroup/Annotation/index.js b/ui/src/Components/Grid/AlertGrid/AlertGroup/Annotation/index.js
index d10a5bafa..9d2cfb5aa 100644
--- a/ui/src/Components/Grid/AlertGrid/AlertGroup/Annotation/index.js
+++ b/ui/src/Components/Grid/AlertGrid/AlertGroup/Annotation/index.js
@@ -97,7 +97,7 @@ const RenderLinkAnnotation = ({ name, value }) => {
       href={value}
       target="_blank"
       rel="noopener noreferrer"
-      className="components-label-with-hover text-nowrap text-truncate badge badge-secondary mr-1"
+      className="components-label-with-hover text-nowrap text-truncate badge mr-1 components-grid-annotation-link"
     >
       <FontAwesomeIcon icon={faExternalLinkAlt} /> {name}
     </a>
diff --git a/ui/src/Components/Grid/AlertGrid/AlertGroup/GroupFooter/__snapshots__/index.test.js.snap b/ui/src/Components/Grid/AlertGrid/AlertGroup/GroupFooter/__snapshots__/index.test.js.snap
index 30e6a456e..1c2fc1521 100644
--- a/ui/src/Components/Grid/AlertGrid/AlertGroup/GroupFooter/__snapshots__/index.test.js.snap
+++ b/ui/src/Components/Grid/AlertGrid/AlertGroup/GroupFooter/__snapshots__/index.test.js.snap
@@ -57,7 +57,7 @@ exports[`<GroupFooter /> matches snapshot 1`] = `
   <a href=\\"http://link.example.com\\"
      target=\\"_blank\\"
      rel=\\"noopener noreferrer\\"
-     class=\\"components-label-with-hover text-nowrap text-truncate badge badge-secondary mr-1\\"
+     class=\\"components-label-with-hover text-nowrap text-truncate badge mr-1 components-grid-annotation-link\\"
   >
     <svg aria-hidden=\\"true\\"
          data-prefix=\\"fas\\"