Rename .navbar-toggleable-xs to .navbar-toggleable + more cleanup (#21226)

* Clean up some utilities

- Align CSS properties
- In `_spacing.scss`, we had a comment saying what 'a' was for, but we removed that so this comment no longer applies

* Remove '-xs' from `.navbar-toggleable-xs` and remove duplication

* Fix outdated classes to use newer ones

docs/examples/navbar/index.html

@@ -23,7 +23,7 @@
     <div class="container">
       <nav class="navbar navbar-light bg-faded">
         <button class="navbar-toggler hidden-sm-up" type="button" data-toggle="collapse" data-target="#navbar-header" aria-controls="navbar-header" aria-expanded="false" aria-label="Toggle navigation"></button>
-        <div class="collapse navbar-toggleable-xs" id="navbar-header">
+        <div class="collapse navbar-toggleable" id="navbar-header">
           <a class="navbar-brand" href="#">Navbar</a>
           <ul class="nav navbar-nav">
             <li class="nav-item active">
@@ -39,7 +39,7 @@
               <a class="nav-link" href="#">About</a>
             </li>
           </ul>
-          <form class="form-inline float-xs-right">
+          <form class="form-inline float-right">
             <input class="form-control" type="text" placeholder="Search">
             <button class="btn btn-outline-success" type="submit">Search</button>
           </form>