This PR restores that v3-like grid system goodness that I fucked up in #19099.
The mistake I made in that PR was simplifying things too much; the single mixin approach meant every grid tier class received their position, min-height, and padding-left/-right within their media queries. With this PR, we're back to setting all that grid column prep separately, outside the media queries, for a simpler and more familiar approach. The two grid mixins are now make-col-prep and make-col.
As part of this, I've tried to prevent the need for an xs class for the flexbox grid with a new width: 100% on that grid prep mixin. This "initial" width is then overridden by the flex values for each grid class within each grid media query. I mention this because it's the whole reason I went down the path I did with these mixins in #19099.
Worth noting I've also updated the docs the grid mixins accordingly.
Fixes #19803 (closed) and #20349.
/cc @twbs/team for sanity checks.