Material-ui: [Stepper] The style of step indicator icons are small

[gudh]

Hi, thanks for building this amazing library, really love it!

Problem Description

Unlike the online demo, when I use it locally, the step indicator svg icons are small (I use exact the same code in the online demo, and all latest version of libraries)

_I try to produce a online version, however, is there a online cdn for material-ui?_

Versions

React:

• "react": "^15.0.1",
• "react-dom": "^15.0.1",

Material-UI:

• "material-ui": "^0.15.0-beta.1",
• "react-tap-event-plugin": "^1.0.0",

Browsers, tested on:

• Chrome 49.0.2623.112 (64-bit)
• Firefox 45.0.2

[nathanmarks]

@gudh Can you make a demo repo?

[Marcoga]

I had the same issue (also with the tabs), when I include the following css (which is included in bootstrap):

* {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

I can solve the problem by giving the Tab and the StepButton a className and setting the box-sizing of the relevant elements to content-box with css.

[nathanmarks]

@Marcoga Thanks for testing that.

@gudh We don't seem to have a policy at the moment for resetting that property if/where needed so I'll have to chat to the others to see if we will put something in, but for now @Marcoga 's solution should do the trick 👍

[zabihy]

I have same issue with react 15.4.0 and material-ui 0.16.4.

[zabihy]

To change the icon size, just do it like this in 15.4.0 and material-ui 0.16.4:
<StepLabel iconContainerStyle={{width: 36}}></StepLabel>