From af112f6b20dae0fab4a0dad6744e00240eb25cfc Mon Sep 17 00:00:00 2001
From: Shannon <sdeminick@gmail.com>
Date: Thu, 19 Mar 2015 17:08:14 +1100
Subject: [PATCH] Adds nicer grid editor labels on hover

---
 .../src/less/gridview.less                    | 33 ++++++++++++++++---
 .../src/views/propertyeditors/grid/grid.html  |  3 +-
 2 files changed, 30 insertions(+), 6 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/src/less/gridview.less b/src/Umbraco.Web.UI.Client/src/less/gridview.less
index 107e042a16..0f0d09a7e9 100644
--- a/src/Umbraco.Web.UI.Client/src/less/gridview.less
+++ b/src/Umbraco.Web.UI.Client/src/less/gridview.less
@@ -251,10 +251,6 @@ IFRAME {overflow:hidden;}
      border: 1px dashed @blue !important;
 }
 
-.usky-grid .usky-control-inner{
-    min-height: 60px;
-}
-
 
 
 // CONTROL PLACEHOLDER
@@ -524,11 +520,38 @@ IFRAME {overflow:hidden;}
     border: 1px dashed transparent;
  }
 
- .usky-grid .usky-control-inner{
+ .usky-grid .usky-control-inner {
     padding: 5px;
     margin-right: 45px;
     margin-bottom: 15px;
     border: 1px dashed transparent;
+    min-height: 60px;
+    position:relative;
+ }
+
+ .usky-grid .usky-control-inner > ins {
+     position: absolute;
+    top: -22px;
+    left: 0;
+    text-decoration: none;
+    padding: 0px 7px;
+    /*opacity: .8;*/
+    display:none;
+    font-size:0.8em;
+    background-color:@blueLight;
+    -moz-border-radius: 0px;
+    -webkit-border-radius: 5px 5px 0px 0px;
+    border-radius: 5px 5px 0px 0px; 
+ }
+
+ .usky-grid .usky-control-inner:hover
+ {
+     border:@grayLighter solid 1px;
+ }
+
+ .usky-grid .usky-control-inner:hover > ins {
+     display:block;
+     z-index:100000;
  }
 
 
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.html
index 0155bc2e3f..1cddb13855 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/grid/grid.html
@@ -118,7 +118,7 @@
                                                      ng-mouseover="setCurrentControl(control)"
                                                      ng-mouseleave="disableCurrentControl(control)"
                                                      ng-animate="'fade'"
-                                                     class="usky-control" title="{{control.editor.name}}">
+                                                     class="usky-control">
 
                                                     <!-- Filled cell tools -->
                                                     <div class="cell-tools"
@@ -170,6 +170,7 @@
                                                                infohighlight:currentInfohighlightControl == control,
                                                                warnhighlight:currentWarnhighlightControl == control,
                                                                selectedControl:currentControl == control}">
+                                                        <ins class="alert alert-info">{{control.editor.name}}</ins>
                                                         <!-- Redering the editor for specific control -->
                                                         <div ng-if="control && control.$editorPath"
                                                              ng-include="control.$editorPath"