feat(button): Add outline brand modifier (#3077)

* feat(button): Add outline brand modifier * Lint
salesforce-ux · Feb 14, 2018 · 0dec41e5baa7f21e62c677b19ca53b51c3ba476b · 0dec41e
1 parent 94e002d
commit 0dec41e5baa7f21e62c677b19ca53b51c3ba476b
Unified Split

Showing with 20 additions and 0 deletions.

+20 −0 ui/components/buttons/base/_index.scss
diff --git a/ui/components/buttons/base/_index.scss b/ui/components/buttons/base/_index.scss
@@ -179,6 +179,26 @@ a.slds-button--inverse:focus {
  }
 }
+  
+/**
+  
+ * Creates the outlined button with the brand color
+  
+ *
+  
+ * @selector .slds-button_outline-brand
+  
+ * @restrict .slds-button
+  
+ * @modifier
+  
+ * @group theme
+  
+ */
+  
+.slds-button_outline-brand {
+  
+  @include button;
+  
+  @include button-base;
+  
+  border-color: $brand-accessible;
+  
+
+  
+  &[disabled] {
+  
+    background: $brand-disabled;
+  
+    border-color: $brand-disabled;
+  
+    color: $color-text-button-brand-disabled;
+  
+  }
+  
+}
+  
+
 /**
 * Creates the inverse style for dark backgrounds
 *