Dashed focus outline on buttons (#360)

thatbudakguy · thatbudakguy · commit 5ccf2b20d05c · 2021-05-20T10:26:55.000-04:00
diff --git a/sitemedia/semantic/src/site/elements/button.overrides b/sitemedia/semantic/src/site/elements/button.overrides
@@ -41,4 +41,9 @@
         color: @disabledTextColor;
         border-color: @disabledTextColor;
     }
+
+    &.focus,
+    &:focus {
+        outline: @focusOutline;
+    }
 }
diff --git a/sitemedia/semantic/src/site/elements/button.variables b/sitemedia/semantic/src/site/elements/button.variables
@@ -32,6 +32,7 @@
 /* Focused */
 @focusBackgroundColor: @primaryColor;
 @focusColor: @invertedTextColor;
+@focusOutline: 2px dashed black;
 
 /* Pressed Down */
 @downBackgroundColor: @primaryColor;

Original file line number	Diff line number	Diff line change
`@@ -41,4 +41,9 @@`
`41`	`41`	`color: @disabledTextColor;`
`42`	`42`	`border-color: @disabledTextColor;`
`43`	`43`	`}`
	`44`	`+`
	`45`	`+ &.focus,`
	`46`	`+ &:focus {`
	`47`	`+ outline: @focusOutline;`
	`48`	`+ }`
`44`	`49`	`}`