fix visual diff

mui · Mar 18, 2018 · e5878a5 · e5878a5
1 parent 7122f25
commit e5878a5
Show file tree

Hide file tree

Showing 2 changed files with 11 additions and 2 deletions.
diff --git a/pages/api/step-button.md b/pages/api/step-button.md
@@ -23,6 +23,7 @@ Any other properties supplied will be [spread to the root element](/guides/api#s
 You can override all the class names injected by Material-UI thanks to the `classes` property.
 This property accepts the following keys:
 - `root`
+- `vertical`
 - `touchRipple`
 
 Have a look at [overriding with classes](/customization/overrides#overriding-with-classes) section

diff --git a/src/Stepper/StepButton.js b/src/Stepper/StepButton.js
@@ -11,11 +11,13 @@ import { isMuiElement } from '../utils/reactHelpers';
 export const styles = theme => ({
   root: {
     width: '100%',
-    justifyContent: 'left',
     padding: `${theme.spacing.unit * 3}px ${theme.spacing.unit * 2}px`,
     margin: `${-theme.spacing.unit * 3}px ${-theme.spacing.unit * 2}px`,
     boxSizing: 'content-box',
   },
+  vertical: {
+    justifyContent: 'left',
+  },
   touchRipple: {
     color: 'rgba(0, 0, 0, 0.3)',
   },
@@ -56,7 +58,13 @@ function StepButton(props) {
     <ButtonBase
       disabled={disabled}
       TouchRippleProps={{ className: classes.touchRipple }}
-      className={classNames(classes.root, classNameProp)}
+      className={classNames(
+        classes.root,
+        {
+          [classes.vertical]: orientation === 'vertical',
+        },
+        classNameProp,
+      )}
       {...other}
     >
       {child}