v4 - Add more flex grid helper classes

Created by: Skwai

justify-content row helpers

Currently there only appears to be align-items level alignment of row and their columns. Would be great to add some classes to align items along the justify-content axis.

For example:

.row-xs-justify-center {
    justify-content: center;
}

<div class="row row-md-justify-center">
  <div class="col-md-4">This content is centered</div>
  <div class="col-md-4">This content is centered</div>
</div>

Instead of this:

<div class="row">
  <div class="col-md-4 col-md-offset-2">This content is centered</div>
  <div class="col-md-4">This content is centered</div>
</div>

column alignment row helpers

Would also be great to allow 'floating' of columns, eg.

.col-md-right {
  margin-left: auto;
}

<div class="row">
  <div class="col-md-4 col-md-right">Right aligned content</div>
</div>

extra flex grid helper classes

.col-fluid {
  padding-left: $grid-gutter-width / 2;
  padding-right: $grid-gutter-width / 2;
}

.row-nowrap {
  flex-wrap: nowrap;
}

.col-grow {
  flex-grow: 1;
}

<div class="row row-nowrap">
  <div class="col-fluid">I am a fluid column</div>
  <div class="col-fluid">I am a fluid column</div>
  <div class="col-fluid">I am a fluid column</div>
</div>