From a4f83e0125f8b68e08d7ca31acce8cea9197272f Mon Sep 17 00:00:00 2001
From: Chris Houston <chouston@vizioz.com>
Date: Thu, 3 Nov 2016 14:41:41 +0000
Subject: [PATCH] Style changes to the developer dashboard area.

---
 .../lib/bootstrap/less/thumbnails.less           | 13 ++++++++-----
 .../src/less/healthcheck.less                    |  4 ++--
 .../developer/developerdashboardvideos.html      | 16 +++++++---------
 .../views/dashboard/developer/healthcheck.html   |  2 +-
 4 files changed, 18 insertions(+), 17 deletions(-)

diff --git a/src/Umbraco.Web.UI.Client/lib/bootstrap/less/thumbnails.less b/src/Umbraco.Web.UI.Client/lib/bootstrap/less/thumbnails.less
index 513039cca4..dd5db3891a 100644
--- a/src/Umbraco.Web.UI.Client/lib/bootstrap/less/thumbnails.less
+++ b/src/Umbraco.Web.UI.Client/lib/bootstrap/less/thumbnails.less
@@ -31,15 +31,18 @@
   display: block;
   padding: 4px;
   line-height: @baseLineHeight;
-  border: 1px solid #ddd;
+  border: 1px solid @grayLight;
   .border-radius(@baseBorderRadius);
   .box-shadow(0 1px 3px rgba(0,0,0,.055));
   .transition(all .2s ease-in-out);
+  background-color: @grayLighter;
 }
-// Add a hover/focus state for linked versions only
-a.thumbnail:hover,
-a.thumbnail:focus {
-  border-color: @linkColor;
+// Add a hover/focus state for linked versions only.
+a.thumbnail:hover, 
+a.thumbnail:focus,
+a div.thumbnail:hover,
+a div.thumbnail:focus {
+  border-color: @blue;
   .box-shadow(0 1px 4px rgba(0,105,214,.25));
 }
 
diff --git a/src/Umbraco.Web.UI.Client/src/less/healthcheck.less b/src/Umbraco.Web.UI.Client/src/less/healthcheck.less
index 6e82d424bb..b5e1622214 100644
--- a/src/Umbraco.Web.UI.Client/src/less/healthcheck.less
+++ b/src/Umbraco.Web.UI.Client/src/less/healthcheck.less
@@ -31,12 +31,12 @@
 	box-sizing: border-box;
 
 	text-align: center;
-	border: 2px solid transparent;
+	border: 1px solid @grayLight;
 	height: 100%;
 }
 
 .umb-healthcheck-group:hover {
-	border: 2px solid @blue;
+	border: 1px solid @blue;
 	cursor: pointer;
 }
 
diff --git a/src/Umbraco.Web.UI.Client/src/views/dashboard/developer/developerdashboardvideos.html b/src/Umbraco.Web.UI.Client/src/views/dashboard/developer/developerdashboardvideos.html
index bbf94629a0..0ad779cf3e 100644
--- a/src/Umbraco.Web.UI.Client/src/views/dashboard/developer/developerdashboardvideos.html
+++ b/src/Umbraco.Web.UI.Client/src/views/dashboard/developer/developerdashboardvideos.html
@@ -1,5 +1,5 @@
 <h3>Hours of Umbraco training videos are only a click away</h3>
-<p>Want to master Umbraco? Spend a couple of minutes learning some best practices by watching one of these videos about using Umbraco. And visit <a class="btn-link -underline"  href="http://umbraco.tv" target="_blank">umbraco.tv</a> for even more Umbraco videos</p>
+<p>Want to master Umbraco? Spend a couple of minutes learning some best practices by watching one of these videos about using Umbraco, then visit <a class="btn-link -underline"  href="http://umbraco.tv" target="_blank">umbraco.tv</a> for even more Umbraco videos.</p>
 
 <div class="row-fluid"
 	ng-init="init('http://umbraco.tv/videos/developer/chapterrss?sort=no')"
@@ -7,14 +7,12 @@
 
 	<ul class="thumbnails" >
 		<li class="span2" ng-repeat="video in videos">
-	    	<div class="thumbnail" style="margin-right: 20px; padding: 20px;">
-		    	<a class="btn-link -underline"  target="_blank" href="{{video.link}}" title="{{video.title}}">
-		    		<img ng-src="{{video.thumbnail}}"  alt="{{video.title}}">
-		    	</a>
-		    	<a target="_blank" href="{{video.link}}" title="{{video.title}}">
-		    		<div style="font-weight: bold; text-align: center; margin: 20px 0 0;">{{video.title}}</div>
-		    	</a>
-	    	</div>
+            <a class="btn-link" target="_blank" href="{{video.link}}" title="{{video.title}}">
+                <div class="thumbnail" style="margin-right: 20px; padding: 20px;">
+                    <img ng-src="{{video.thumbnail}}" alt="{{video.title}}">
+                    <div style="font-weight: bold; text-align: center; margin: 20px 0 0;">{{video.title}}</div>
+                </div>
+            </a>
 	    </li>
 	</ul>
 </div>
diff --git a/src/Umbraco.Web.UI.Client/src/views/dashboard/developer/healthcheck.html b/src/Umbraco.Web.UI.Client/src/views/dashboard/developer/healthcheck.html
index ca796043e6..79081e5933 100644
--- a/src/Umbraco.Web.UI.Client/src/views/dashboard/developer/healthcheck.html
+++ b/src/Umbraco.Web.UI.Client/src/views/dashboard/developer/healthcheck.html
@@ -2,7 +2,7 @@
 
     <div ng-if="vm.viewState === 'list'">
 
-        <h3 class="bold">Health Check</h3>
+        <h3>Health Check</h3>
         <div class="umb-healthcheck-help-text faded">
             <p>The health checker evaluates various areas of your site for best practice settings, configuration, potential problems, etc. You can easily fix problems by pressing a button.
             You can add your own health checks, have a look at <a href="https://our.umbraco.org/documentation/Extending/Healthcheck/" target="_blank" class="btn-link -underline">the documentation for more information</a> about custom health checks.</p>