Merge pull request #91 from BrightspaceUI/sass-mixins

exposing a few mixins so that BSI can leverage them
BrightspaceUI · Apr 25, 2017 · 588b430 · 588b430
2 parents 9acad82 + 8f37765
commit 588b430
Showing 1 changed file with 16 additions and 4 deletions.
diff --git a/d2l-button.scss b/d2l-button.scss
@@ -1,10 +1,23 @@
 @import 'bower_components/d2l-colors/d2l-colors.scss';
 
+@mixin _d2l-button-clear-focus() {
+	box-shadow: 0 0 0 4px rgba(0, 0, 0, 0);
+}
+
+@mixin _d2l-button-focus() {
+	border-color: rgba(0, 111, 191, 0.4);
+	box-shadow: 0 0 0 4px rgba(0, 111, 191, 0.3);
+}
+
+@mixin _d2l-button-primary-focus() {
+	box-shadow: 0 0 0 4px rgba(0, 111, 191, 0.3);
+}
+
 @mixin d2l-button() {
 	border-width: 1px;
 	border-style: solid;
 	border-radius: 0.3rem;
-	box-shadow: 0 0 0 4px rgba(0, 0, 0, 0);
+	@include _d2l-button-clear-focus();
 	box-sizing: border-box;
 	cursor: pointer;
 	display: inline-block;
@@ -39,8 +52,7 @@
 		background-color: $d2l-color-gypsum;
 	}
 	&:focus, &.d2l-button-focus {
-		border-color: rgba(0, 111, 191, 0.4);
-		box-shadow: 0 0 0 4px rgba(0, 111, 191, 0.3);
+		@include _d2l-button-focus();
 	}
 	&[disabled] {
 		opacity: 0.5;
@@ -55,6 +67,6 @@
 		background-color: $d2l-color-celestuba;
 	}
 	&[primary]:focus, &[primary].d2l-button-focus {
-		box-shadow: 0 0 0 4px rgba(0, 111, 191, 0.3);
+		@include _d2l-button-primary-focus();
 	}
 }