Merge pull request #5330 from umbraco/v8/feature/ui-umb-button-nicer-…

…outline

V8: prettier outline for buttons, and only shown when tabbing is active.

src/Umbraco.Web.UI.Client/src/less/components/buttons/umb-button.less

@@ -7,6 +7,21 @@
     position: relative;
 }
 
+.umb-button__button:focus {
+    outline: none;
+    .tabbing-active &:after {
+        content: '';
+        position: absolute;
+        z-index: 10000;
+        top: 0;
+        bottom: 0;
+        left: 0;
+        right: 0;
+        border-radius: 3px;
+        box-shadow: 0 0 2px @blueMid, inset 0 0 2px 1px @blueMid;
+    }
+}
+
 .umb-button__content {
    opacity: 1;
    transition: opacity 0.25s ease;
@@ -133,4 +148,4 @@
 .umb-button--block {
     display: block;
     width: 100%;
-}
+}