given `width: 100%` is always on a container now and it's constrained by max-width, we can remove our navbar changes from #21722 and #22383

Rename `$navbar-*-toggler-bg` to `$navbar-*-toggler-icon-bg` since it's placed on .navbar-toggler-icon (#22564)

* Rename variable $input-border-focus to $input-border-color-focus
* Rename variables $pagination-hover-border, $pagination-active-border, $pagination-disabled-border to $pagination-hover-border-color, $pagination-active-border-color, $pagination-disabled-border-color, respectively
* Rename variables $state-*-border to $state-*-border-color, respectively
* Rename variables $alert-*-border to $alert-*-border-color
* Rename $list-group-active-border to $list-group-active-border-color
* Rename $table-inverse-border to $table-inverse-border-color
* Rename $btn-*-border to $btn-*-border-color
* Rename $navbar-*-toggler-border to $navbar-*-toggler-border-color

* no more outline overrides
* rename old .open to .show

Vertical centering `.navbar` flex children's

Demo: http://jsbin.com/fibini

Set/reset `.dropdown` position when `.navbar-expand`.

Demo: http://jsbin.com/pojecuh

Change the .navbar-toggler to default contextual .navbar-*-color.

<iframe height='265' scrolling='no' title='Bootstrap - .navbar-toggler color' src='//codepen.io/zalog/embed/MJLZOE/?height=265&theme-id=light&default-tab=css,result&embed-version=2' frameborder='no' allowtransparency='true' allowfullscreen='true' style='width: 100%;'>See the Pen <a href='http://codepen.io/zalog/pen/MJLZOE/'>Bootstrap - .navbar-toggler color</a> by Catalin Zalog (<a href='http://codepen.io/zalog'>@zalog</a>) on <a href='http://codepen.io'>CodePen</a>.
</iframe>

instead of flex column, use wrap and an explicit flexbox break with flex-basis 100% on the navbar-collapse.

add some additional container styles for enabling flex behavior when content isn't immediate child of .navbar

Generate correct breakpoints for navbar-toggleable-* and generate toggleable without media query to never collapse

* Make container in navbar to occupy full width even on smallest breakpoint

* Fix typo in comment

* Apply fix only on smaller breakpoint

* drop the comment as chrome doesn't have a bug here

* Change it's to its.

* Fix links

* Fix typos

Remove .navbar-divider; it's undocumented and wasn't updated with the flexbox navbar updates, so it's kinda bunk right now

this was mad confusing for awhile

- since we're column to start, need to set row.
- note that flex-direction cannot be inherited, so we have to set it twice.
- apply the horizontal padding again to .nav-link.
- remove the .nav-item styles (un-needed).
- remove previous .nav-link styles as they were un-nested and potentially problematic in old placement should someone mix more navs in here.

since we're no longer using the .nav as a base class, we need to bring over some base styles for redoing browser list styles and setting flex in motion.

also brings with it some .nav-link styling. we're still using this global class, but with this small modification for alignment of content in responsive modes.