Saturday, July 28, 2018

Hotfix Sencha Touch 2 2 1 broken layout in Chrome 29

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.

visit link download