From 52fd1fa91f3b925322e3a0f6200b2d52b1239705 Mon Sep 17 00:00:00 2001
From: Seyi Adebajo <sadebajo@linkedin.com>
Date: Wed, 20 Jun 2018 11:04:48 -0700
Subject: [PATCH] updates styling on dataset pills

---
 .../components/dataset-property/_all.scss     |  1 +
 .../dataset-property/_dataset-pill.scss       |  5 +++
 .../app/templates/datasets/dataset.hbs        | 37 ++++++++-----------
 3 files changed, 21 insertions(+), 22 deletions(-)
 create mode 100644 wherehows-web/app/styles/components/dataset-property/_dataset-pill.scss

diff --git a/wherehows-web/app/styles/components/dataset-property/_all.scss b/wherehows-web/app/styles/components/dataset-property/_all.scss
index f62445ad48..3bb5458101 100644
--- a/wherehows-web/app/styles/components/dataset-property/_all.scss
+++ b/wherehows-web/app/styles/components/dataset-property/_all.scss
@@ -1,3 +1,4 @@
 @import 'deprecated-dataset';
 @import 'removed-dataset';
 @import 'contains-personal-data';
+@import 'dataset-pill';
diff --git a/wherehows-web/app/styles/components/dataset-property/_dataset-pill.scss b/wherehows-web/app/styles/components/dataset-property/_dataset-pill.scss
new file mode 100644
index 0000000000..270633b826
--- /dev/null
+++ b/wherehows-web/app/styles/components/dataset-property/_dataset-pill.scss
@@ -0,0 +1,5 @@
+.dataset-pill {
+  & + & {
+    margin-left: item-spacing(3);
+  }
+}
diff --git a/wherehows-web/app/templates/datasets/dataset.hbs b/wherehows-web/app/templates/datasets/dataset.hbs
index 09f07d3f2d..3bdfd4fba1 100644
--- a/wherehows-web/app/templates/datasets/dataset.hbs
+++ b/wherehows-web/app/templates/datasets/dataset.hbs
@@ -5,33 +5,26 @@
     <div class="row">
       <div class="container">
       {{#if model.removed}}
-        <span class="removed-dataset">REMOVED</span>
+        <span class="removed-dataset dataset-pill">
+          REMOVED
 
-        <sup>
-              <span
-                class="glyphicon glyphicon-question-sign"
-                title="This dataset has been removed">
-                {{tooltip-on-element
-                  event="hover"
-                  text="This dataset has been removed"
-                }}
-              </span>
-        </sup>
+          {{tooltip-on-element
+            event="hover"
+            text="This dataset has been removed"
+          }}
+        </span>
       {{/if}}
 
       {{#if datasetContainsPersonalData}}
-        <span class="pii-dataset">PII</span>
+        <span class="pii-dataset dataset-pill">
+          PII
+
+          {{tooltip-on-element
+            event="hover"
+            text="This dataset contains personally identifiable information"
+          }}
+        </span>
 
-        <sup>
-              <span
-                class="glyphicon glyphicon-question-sign"
-                title="This dataset contains personally identifiable information">
-                {{tooltip-on-element
-                  event="hover"
-                  text="This dataset contains personally identifiable information"
-                }}
-              </span>
-        </sup>
       {{/if}}
 
       {{#if model.deprecated}}