From 8030b56bbac337359bebbd6209dff38e8a7bb384 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Torkel=20=C3=96degaard?= <torkel@grafana.org>
Date: Mon, 2 Jan 2017 11:13:50 +0100
Subject: [PATCH] fix(panel): fixed panel help text for panels that set
 background color, fixes #7085

---
 public/sass/pages/_dashboard.scss | 45 +++++++++++++++----------------
 1 file changed, 21 insertions(+), 24 deletions(-)

diff --git a/public/sass/pages/_dashboard.scss b/public/sass/pages/_dashboard.scss
index 820c2ebc558..67a694de666 100644
--- a/public/sass/pages/_dashboard.scss
+++ b/public/sass/pages/_dashboard.scss
@@ -68,16 +68,6 @@ div.flot-text {
   display: block;
 }
 
-.panel-links-btn {
-  margin-left: 10px;
-  display: none;
-}
-
-.panel-help-text {
-  margin-left: 10px;
-  display: none;
-}
-
 .panel-loading {
   position:absolute;
   top: -3px;
@@ -89,6 +79,23 @@ div.flot-text {
   text-align: center;
 }
 
+
+.panel-info-corner-inner {
+  width: 0;
+  height: 0;
+  position: absolute;
+  left: 0;
+  bottom: 0;
+}
+
+@mixin panel-corner-color($corner-bg) {
+  .panel-info-corner-inner {
+    border-left: 27px solid $corner-bg;
+    border-right: none;
+    border-bottom: 27px solid transparent;
+  }
+}
+
 .panel-info-corner {
   color: $text-muted;
   cursor: pointer;
@@ -105,11 +112,12 @@ div.flot-text {
     top: -4px;
     left: -6px;
     font-size: 75%;
+    z-index: 1000;
   }
 
   &--info {
     display: block;
-    background: lighten($panel-bg, 4%);
+    @include panel-corner-color(lighten($panel-bg, 4%));
     .fa:before {
       content: "\f129";
     }
@@ -117,7 +125,7 @@ div.flot-text {
 
   &--links {
     display: block;
-    background: lighten($panel-bg, 4%);
+    @include panel-corner-color(lighten($panel-bg, 4%));
     .fa {
       left: -5px;
     }
@@ -129,24 +137,13 @@ div.flot-text {
   &--error {
     display: block;
     color: $text-color;
-    background: $errorBackground !important;
+    @include panel-corner-color($errorBackground);
     .fa:before {
       content: "\f12a";
     }
   }
 }
 
-.panel-info-corner-inner {
-  width: 0;
-  height: 0;
-  position: absolute;
-  border-left: 27px solid transparent;
-  border-right: 0px solid transparent;
-  border-bottom: 26px solid $panel-bg;
-  left: 0;
-  bottom: 0;
-}
-
 .panel-full-edit {
   margin-top: 20px;
   margin-bottom: 20px;