Fixes #10370: Improved and deprecated dropdown menu alignment options

* Removes an old pair of selectors that didn’t properly target the
right-aligned navbar alignment of dropdown menus.
* Deprecates the `.pull-right` alignment in favor of a more specific
and unique class name.
* Adds `.dropdown-menu-right` as the new alignment class. This is then
mixin-ed into the `.navbar-right.navbar-nav` dropdown menus for
auto-alignment.
* To override that auto-alignment, use `.dropdown-menu-left` as needed.

1 files changed, 6 insertions, 2 deletions

diff --git a/components.html b/components.html
index 8377b8123..a335c06c9 100644
--- a/components.html
+++ b/components.html
@@ -902,9 +902,13 @@ base_url: "../"
 {% endhighlight %}
 
     <h3 id="dropdowns-alignment">Alignment options</h3>
-    <p>Add <code>.pull-right</code> to a <code>.dropdown-menu</code> to right align the dropdown menu.</p>
+    <p>Add <code>.dropdown-menu-right</code> to a <code>.dropdown-menu</code> to right align the dropdown menu.</p>
+    <div class="bs-callout bs-callout-warning">
+      <h4>Deprecated <code>.pull-right</code> alignment</h4>
+      <p>As of v3.1, we've deprecated <code>.pull-right</code> on dropdown menus. To right-align a menu, use <code>.dropdown-menu-right</code>. Right-aligned nav components in the navbar use a mixin version of this class to automatically align the menu. To override it, use <code>.dropdown-menu-left</code>.</p>
+    </div>
 {% highlight html %}
-<ul class="dropdown-menu pull-right" role="menu" aria-labelledby="dLabel">
+<ul class="dropdown-menu dropdown-menu-right" role="menu" aria-labelledby="dLabel">
   ...
 </ul>
 {% endhighlight %}