Created by: gotbahn
Bootstrap uses a lot of repeated media queries, this is proposal to combine them.
I found in issue tracker quite similar, approved pull request "Media query mixins" #13014. But it only changes hardcoded media queries to mixins (in my opinion not in better way to write code inside) and what is more important not combining media queries in output CSS.
So inside proposal changed all media queries to media mixins declarations, that called in media-queries.less file collector.
Media mixins naming composed of parts from media queries: @media screen and (min-width: @screen-sm-min) {...} -> .media-screen-min-sm() {...}
Benefits:
- combined media queries;
- reduced little bit size of bootstrap.css from 3kb, bootstrap.min.css from 2.5kb
- mechanism to scale media queries for LESS Bootstrap users without adding post processors
Concerns:
- non standard way of use mixins possible only in LESS
- CSS way to write media queries, media mixins should always wrap content
- I founded that bootstrap not supported LESS extends, so didn't find way better than add .navbar-form to .form-inline. Of course form.less should not know anything about navbar.less.