Hotfix - Sencha Touch (2.2.1) broken layout in Chrome 29

Chrome has a new flex layout support since version 29.0.1547.57, this cause a broken layout in Sencha Touch 2.2.1.

Fix this issue by changing the rule order of the st-box mixin.

Open resources/themes/stylesheets/sencha-touch/base/mixins/_Class.scss in a text editor and replace the mixin st-box with the following:

@mixin st-box($important: no) {
    @if $important == important {
        display: flex !important;
        display: -webkit-box !important;
        display: -ms-flexbox !important;
    } @else {
        display: flex;
        display: -webkit-box;
        display: -ms-flexbox;
    }
}

After re-compiling your css, your application layout should look as nice as in prior Chrome versions.