fix(button): button strong is configurable

ionic-team · Dec 6, 2016 · ac07c6f · ac07c6f
1 parent c6fbb9c
commit ac07c6f
Show file tree

Hide file tree

Showing 8 changed files with 59 additions and 6 deletions.
diff --git a/src/components/button/button.ios.scss b/src/components/button/button.ios.scss
@@ -119,14 +119,20 @@ $button-ios-clear-opacity-hover:                    .6 !default;
 // iOS Round Button
 // --------------------------------------------------
 
-
 /// @prop - Padding of the round button
 $button-ios-round-padding:                          $button-round-padding !default;
 
 /// @prop - Border radius of the round button
 $button-ios-round-border-radius:                    $button-round-border-radius !default;
 
 
+// iOS Decorator Button
+// --------------------------------------------------
+
+/// @prop - Font weight of the strong button
+$button-ios-strong-font-weight:                     600 !default;
+
+
 // iOS Default Button
 // --------------------------------------------------
 
@@ -318,5 +324,5 @@ $button-ios-round-border-radius:                    $button-round-border-radius
 // --------------------------------------------------
 
 .button-strong-ios {
-  font-weight: 600;
+  font-weight: $button-ios-strong-font-weight;
 }
diff --git a/src/components/button/button.md.scss b/src/components/button/button.md.scss
@@ -162,6 +162,13 @@ $button-md-round-padding:                       $button-round-padding !default;
 $button-md-round-border-radius:                 $button-round-border-radius !default;
 
 
+// Material Design Decorator Button
+// --------------------------------------------------
+
+/// @prop - Font weight of the strong button
+$button-md-strong-font-weight:                  bold !default;
+
+
 // Material Design Default Button
 // --------------------------------------------------
 
@@ -424,3 +431,11 @@ $button-md-round-border-radius:                 $button-round-border-radius !def
   @include md-button-outline($color-name, $color-base, $color-contrast);
   @include md-button-clear($color-name, $color-base, $color-contrast);
 }
+
+
+// MD strong Button
+// --------------------------------------------------
+
+.button-strong-md {
+  font-weight: $button-md-strong-font-weight;
+}
diff --git a/src/components/button/button.wp.scss b/src/components/button/button.wp.scss
@@ -117,6 +117,13 @@ $button-wp-round-padding:                                 $button-round-padding
 $button-wp-round-border-radius:                           $button-round-border-radius !default;
 
 
+// Material Design Decorator Button
+// --------------------------------------------------
+
+/// @prop - Font weight of the strong button
+$button-wp-strong-font-weight:                            bold !default;
+
+
 // Windows Default Button
 // --------------------------------------------------
 
@@ -315,3 +322,11 @@ $button-wp-round-border-radius:                           $button-round-border-r
   @include wp-button-outline($color-name, $color-base, $color-contrast);
   @include wp-button-clear($color-name, $color-base, $color-contrast);
 }
+
+
+// WP strong Button
+// --------------------------------------------------
+
+.button-strong-wp {
+  font-weight: $button-wp-strong-font-weight;
+}
diff --git a/src/components/picker/picker-component.ts b/src/components/picker/picker-component.ts
@@ -500,9 +500,6 @@ export class PickerCmp {
       }
       return button;
     });
-    if (data.buttons.length > 0) {
-      data.buttons[data.buttons.length - 1].strong = true;
-    }
 
     // clean up dat data
     data.columns = data.columns.map(column => {

diff --git a/src/components/picker/picker.ios.scss b/src/components/picker/picker.ios.scss
@@ -73,6 +73,10 @@ $picker-ios-option-offset-y:                   (($picker-ios-height - $picker-io
   text-align: right;
 }
 
+.picker-ios .picker-toolbar-button:last-child .picker-button {
+  font-weight: $button-ios-strong-font-weight;
+}
+
 .picker-ios .picker-toolbar-cancel {
   font-weight: normal;
 

diff --git a/src/components/toolbar/toolbar.ios.scss b/src/components/toolbar/toolbar.ios.scss
@@ -378,5 +378,5 @@ $navbar-ios-height:                         $toolbar-ios-height !default;
 // --------------------------------------------------
 
 .bar-button-strong-ios {
-  font-weight: 600;
+  font-weight: $button-ios-strong-font-weight;
 }
diff --git a/src/components/toolbar/toolbar.md.scss b/src/components/toolbar/toolbar.md.scss
@@ -390,3 +390,11 @@ $navbar-md-height:                       $toolbar-md-height !default;
   @include md-bar-button-outline($color-name, $color-base, $color-contrast);
   @include md-bar-button-solid($color-name, $color-base, $color-contrast);
 }
+
+
+// MD strong Button
+// --------------------------------------------------
+
+.bar-button-strong-md {
+  font-weight: $button-md-strong-font-weight;
+}
diff --git a/src/components/toolbar/toolbar.wp.scss b/src/components/toolbar/toolbar.wp.scss
@@ -344,3 +344,11 @@ $navbar-wp-height:                       $toolbar-wp-height !default;
   @include wp-bar-button-outline($color-name, $color-base, $color-contrast);
   @include wp-bar-button-solid($color-name, $color-base, $color-contrast);
 }
+
+
+// WP strong Button
+// --------------------------------------------------
+
+.bar-button-strong-wp {
+  font-weight: $button-wp-strong-font-weight;
+}