From 34cf18b257b16918ac8b1dcdb028a6942c310afd Mon Sep 17 00:00:00 2001
From: Enrique Alcantara <ealcantara@gitlab.com>
Date: Thu, 30 May 2019 14:15:57 -0400
Subject: [PATCH] Address feature highlight popover inconsistencies

---
 app/assets/stylesheets/components/popover.scss          | 2 +-
 app/assets/stylesheets/framework/feature_highlight.scss | 7 ++-----
 app/assets/stylesheets/framework/variables.scss         | 1 +
 3 files changed, 4 insertions(+), 6 deletions(-)

diff --git a/app/assets/stylesheets/components/popover.scss b/app/assets/stylesheets/components/popover.scss
index 3d915928565..cd46765ead2 100644
--- a/app/assets/stylesheets/components/popover.scss
+++ b/app/assets/stylesheets/components/popover.scss
@@ -87,7 +87,7 @@
 }
 
 .popover-body {
-  padding: $gl-padding;
+  padding: $gl-padding $gl-padding-12;
 
   > .popover-hr {
     margin: $gl-padding 0;
diff --git a/app/assets/stylesheets/framework/feature_highlight.scss b/app/assets/stylesheets/framework/feature_highlight.scss
index 85cabf43e9e..f9b167669a6 100644
--- a/app/assets/stylesheets/framework/feature_highlight.scss
+++ b/app/assets/stylesheets/framework/feature_highlight.scss
@@ -39,7 +39,7 @@
   display: none;
 
   hr {
-    margin: $gl-padding * 0.5 0;
+    margin: $gl-padding 0;
   }
 
   .btn-link {
@@ -71,9 +71,6 @@
 
 .feature-highlight-popover {
   width: 240px;
-  padding: 0;
-  border: 1px solid $border-color;
-  box-shadow: 0 2px 4px $dropdown-shadow-color;
 
   &.right > .arrow {
     border-right-color: $border-color;
@@ -85,7 +82,7 @@
 }
 
 .feature-highlight-popover-sub-content {
-  padding: 9px 14px;
+  padding: $gl-padding $gl-padding-12;
 }
 
 @include keyframes(pulse-highlight) {
diff --git a/app/assets/stylesheets/framework/variables.scss b/app/assets/stylesheets/framework/variables.scss
index 3d7a3d5766e..07fc655307e 100644
--- a/app/assets/stylesheets/framework/variables.scss
+++ b/app/assets/stylesheets/framework/variables.scss
@@ -336,6 +336,7 @@ $tooltip-font-size: 12px;
  */
 $gl-padding-4: 4px;
 $gl-padding-8: 8px;
+$gl-padding-12: 12px;
 $gl-padding: 16px;
 $gl-padding-24: 24px;
 $gl-padding-32: 32px;