Buttons layout does not fit

[jirihelmich]

[tobice]

Fixed only partially by redesigning the toolbar. The problem is still there but less apparent.

The problem is that each button is a separated component with decoupled functionality and state (wrapped by the redux higher order connect() component). The UI library is then unable to align the buttons properly. It's a trade-off between nicely structured code and perfect visual output.

[tobice]

Okay, there is an actual bug in the Material UI library. The RaisedButton when used as a standard link (<a href="">...</a>) is shifted a bit down which is the case of the publish button on the screen shot. The bug is fixed in the recent versions of Material UI library which however introduces breaking changes. As the update would be probably complicated and it's not a real priority, I implemented a simple work around.

Nevertheless, the reasons mentioned in the post above are still valid. The visual output will most likely never be perfect (for example, buttons in such a toolbar should seemingly merge into one but they are clearly separated by overlapping shadows that should not be there).