Added fullWidth prop to Raised Button

mui · Jun 24, 2015 · 9cf0722 · 9cf0722
1 parent 7211ecd
commit 9cf0722
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 1 deletion.
diff --git a/docs/src/app/components/pages/components/buttons.jsx b/docs/src/app/components/pages/components/buttons.jsx
@@ -144,6 +144,12 @@ class ButtonPage extends React.Component {
       {
         name: 'Raised Button',
         infoArray: [
+          {
+            name: 'fullWidth',
+            type: 'bool',
+            header: 'optional',
+            desc: 'If true, will change the width of the button to span the full width of the parent.'
+          },
           {
             name: 'containerElement',
             type: 'oneOfType [string, element]',
@@ -404,6 +410,9 @@ class ButtonPage extends React.Component {
                   <RaisedButton label="Disabled" disabled={true} />
                 </div>
               </div>
+              <div>
+                <RaisedButton label="Block Button" fullWidth={true} />
+              </div>
             </ComponentDoc>
           </Tab>
           <Tab label="Floating Action Buttons">

diff --git a/src/raised-button.jsx b/src/raised-button.jsx
@@ -34,6 +34,7 @@ let RaisedButton = React.createClass({
     primary: React.PropTypes.bool,
     secondary: React.PropTypes.bool,
     labelStyle: React.PropTypes.object,
+    fullWidth: React.PropTypes.bool
   },
 
   getInitialState: function() {
@@ -81,7 +82,7 @@ let RaisedButton = React.createClass({
     let styles = {
       root: {
         display: 'inline-block',
-        minWidth: this.getThemeButton().minWidth,
+        minWidth: this.props.fullWidth ? '100%' : this.getThemeButton().minWidth,
         height: this.getThemeButton().height,
         transition: Transitions.easeOut()
       },