Created by: Starsam80
Same approach as #21217, but this time I changed the formatting of _flex.scss a little bit so it was more easier to add @if {...} @else {...}.
The only remaining xs classes after this PR are:
.col-xs.col-xs-auto.navbar-toggleable-xs.hidden-xs-up.hidden-xs-down
I plan on doing something about .col-xs(-auto) without affecting this (.col wouldn't match) but that takes a bit more work. .hidden-xs-(up|down) seem like they have a naming convention going on, so changing one may break it. I'll leave that for someone else to decide.