button group sizes for ie7 fixes

4 files changed, 75 insertions, 12 deletions

diff --git a/docs/assets/bootstrap.zip b/docs/assets/bootstrap.zip
index 2ccbc3cf1..f3c7981e0 100644
--- a/docs/assets/bootstrap.zip
+++ b/docs/assets/bootstrap.zip
diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css
index e6ccb8b14..d87bd2f8e 100644
--- a/docs/assets/css/bootstrap.css
+++ b/docs/assets/css/bootstrap.css
@@ -2265,6 +2265,11 @@ input[type="submit"].btn.btn-small {
   *padding-top: 3px;
   *padding-bottom: 3px;
 }
+button.btn.btn-mini,
+input[type="submit"].btn.btn-mini {
+  *padding-top: 1px;
+  *padding-bottom: 1px;
+}
 .btn-group {
   position: relative;
   *zoom: 1;
@@ -2355,12 +2360,18 @@ input[type="submit"].btn.btn-small {
   -webkit-box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.125), inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
   -moz-box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.125), inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
   box-shadow: inset 1px 0 0 rgba(255, 255, 255, 0.125), inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
-  *padding-top: 5px;
-  *padding-bottom: 5px;
+  *padding-top: 3px;
+  *padding-bottom: 3px;
 }
 .btn-group .btn-mini.dropdown-toggle {
   padding-left: 5px;
   padding-right: 5px;
+  *padding-top: 1px;
+  *padding-bottom: 1px;
+}
+.btn-group .btn-small.dropdown-toggle {
+  *padding-top: 4px;
+  *padding-bottom: 4px;
 }
 .btn-group .btn-large.dropdown-toggle {
   padding-left: 12px;
diff --git a/docs/components.html b/docs/components.html
index 1d0603608..10b2aec20 100644
--- a/docs/components.html
+++ b/docs/components.html
@@ -420,13 +420,39 @@
           </ul>
         </div><!-- /btn-group -->
       </div><!-- /btn-toolbar -->
-      <h3>Right aligned menus</h3>
-      <p>Add <code>.pull-right</code> to the <code>.dropdown-menu</code> of any button dropdown for right aligned menus.</p>
+      <h3>Sizes</h3>
+      <p>Utilize the extra button classe <code>.btn-mini</code>, <code>.btn-small</code>, or <code>.btn-large</code> for sizing.</p>
       <div class="btn-toolbar">
         <div class="btn-group">
-          <button class="btn">Right aligned</button>
-          <button class="btn dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>
-          <ul class="dropdown-menu pull-right">
+          <button class="btn btn-large">Large action</button>
+          <button class="btn btn-large dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>
+          <ul class="dropdown-menu">
+            <li><a href="#">Action</a></li>
+            <li><a href="#">Another action</a></li>
+            <li><a href="#">Something else here</a></li>
+            <li class="divider"></li>
+            <li><a href="#">Separated link</a></li>
+          </ul>
+        </div><!-- /btn-group -->
+      </div><!-- /btn-toolbar -->
+      <div class="btn-toolbar">
+        <div class="btn-group">
+          <button class="btn btn-small">Small action</button>
+          <button class="btn btn-small dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>
+          <ul class="dropdown-menu">
+            <li><a href="#">Action</a></li>
+            <li><a href="#">Another action</a></li>
+            <li><a href="#">Something else here</a></li>
+            <li class="divider"></li>
+            <li><a href="#">Separated link</a></li>
+          </ul>
+        </div><!-- /btn-group -->
+      </div><!-- /btn-toolbar -->
+      <div class="btn-toolbar">
+        <div class="btn-group">
+          <button class="btn btn-mini">Mini action</button>
+          <button class="btn btn-mini dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>
+          <ul class="dropdown-menu">
             <li><a href="#">Action</a></li>
             <li><a href="#">Another action</a></li>
             <li><a href="#">Something else here</a></li>
diff --git a/docs/templates/pages/components.mustache b/docs/templates/pages/components.mustache
index d841357c3..1a7f5b91a 100644
--- a/docs/templates/pages/components.mustache
+++ b/docs/templates/pages/components.mustache
@@ -344,13 +344,39 @@
           </ul>
         </div><!-- /btn-group -->
       </div><!-- /btn-toolbar -->
-      <h3>{{_i}}Right aligned menus{{/i}}</h3>
-      <p>{{_i}}Add <code>.pull-right</code> to the <code>.dropdown-menu</code> of any button dropdown for right aligned menus.{{/i}}</p>
+      <h3>{{_i}}Sizes{{/i}}</h3>
+      <p>{{_i}}Utilize the extra button classe <code>.btn-mini</code>, <code>.btn-small</code>, or <code>.btn-large</code> for sizing.{{/i}}</p>
       <div class="btn-toolbar">
         <div class="btn-group">
-          <button class="btn">{{_i}}Right aligned{{/i}}</button>
-          <button class="btn dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>
-          <ul class="dropdown-menu pull-right">
+          <button class="btn btn-large">{{_i}}Large action{{/i}}</button>
+          <button class="btn btn-large dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>
+          <ul class="dropdown-menu">
+            <li><a href="#">{{_i}}Action{{/i}}</a></li>
+            <li><a href="#">{{_i}}Another action{{/i}}</a></li>
+            <li><a href="#">{{_i}}Something else here{{/i}}</a></li>
+            <li class="divider"></li>
+            <li><a href="#">{{_i}}Separated link{{/i}}</a></li>
+          </ul>
+        </div><!-- /btn-group -->
+      </div><!-- /btn-toolbar -->
+      <div class="btn-toolbar">
+        <div class="btn-group">
+          <button class="btn btn-small">{{_i}}Small action{{/i}}</button>
+          <button class="btn btn-small dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>
+          <ul class="dropdown-menu">
+            <li><a href="#">{{_i}}Action{{/i}}</a></li>
+            <li><a href="#">{{_i}}Another action{{/i}}</a></li>
+            <li><a href="#">{{_i}}Something else here{{/i}}</a></li>
+            <li class="divider"></li>
+            <li><a href="#">{{_i}}Separated link{{/i}}</a></li>
+          </ul>
+        </div><!-- /btn-group -->
+      </div><!-- /btn-toolbar -->
+      <div class="btn-toolbar">
+        <div class="btn-group">
+          <button class="btn btn-mini">{{_i}}Mini action{{/i}}</button>
+          <button class="btn btn-mini dropdown-toggle" data-toggle="dropdown"><span class="caret"></span></button>
+          <ul class="dropdown-menu">
             <li><a href="#">{{_i}}Action{{/i}}</a></li>
             <li><a href="#">{{_i}}Another action{{/i}}</a></li>
             <li><a href="#">{{_i}}Something else here{{/i}}</a></li>