docs>components>button-groups headings

Normalized the heading hierarchy in the documentation for the Button groups component.

diff --git a/docs/_includes/components/button-groups.html b/docs/_includes/components/button-groups.html
index 9abf562945fdea041957b64be4864252df698147..5f61bfc05e3a7f4116db87193ce863397ea2c3c6 100644 (file)
--- a/docs/_includes/components/button-groups.html
+++ b/docs/_includes/components/button-groups.html
@@ -15,7 +15,7 @@
     <p>In addition, groups and toolbars should be given an explicit label, as most assistive technologies will otherwise not announce them, despite the presence of the correct <code>role</code> attribute. In the examples provided here, we use <code>aria-label</code>, but alternatives such as <code>aria-labelledby</code> can also be used.</p>
   </div>
 
-  <h3 id="btn-groups-single">Basic example</h3>
+  <h2 id="btn-groups-single">Basic example</h2>
   <p>Wrap a series of buttons with <code>.btn</code> in <code>.btn-group</code>.</p>
   <div class="bs-example" data-example-id="simple-button-group">
     <div class="btn-group" role="group" aria-label="Basic example">
@@ -32,7 +32,7 @@
 </div>
 {% endhighlight %}
 
-  <h3 id="btn-groups-toolbar">Button toolbar</h3>
+  <h2 id="btn-groups-toolbar">Button toolbar</h2>
   <p>Combine sets of <code>&lt;div class="btn-group"&gt;</code> into a <code>&lt;div class="btn-toolbar"&gt;</code> for more complex components.</p>
   <div class="bs-example" data-example-id="simple-button-toolbar">
     <div class="btn-toolbar" role="toolbar" aria-label="Toolbar with button groups">
@@ -60,7 +60,7 @@
 </div>
 {% endhighlight %}
 
-  <h3 id="btn-groups-sizing">Sizing</h3>
+  <h2 id="btn-groups-sizing">Sizing</h2>
   <p>Instead of applying button sizing classes to every button in a group, just add <code>.btn-group-*</code> to each <code>.btn-group</code>, including when nesting multiple groups.</p>
   <div class="bs-example" data-example-id="button-group-sizing">
     <div class="btn-group btn-group-lg" role="group" aria-label="Large button group">
@@ -94,7 +94,7 @@
 <div class="btn-group btn-group-xs" role="group" aria-label="...">...</div>
 {% endhighlight %}
 
-  <h3 id="btn-groups-nested">Nesting</h3>
+  <h2 id="btn-groups-nested">Nesting</h2>
   <p>Place a <code>.btn-group</code> within another <code>.btn-group</code> when you want dropdown menus mixed with a series of buttons.</p>
   <div class="bs-example" data-example-id="button-group-nesting">
     <div class="btn-group" role="group" aria-label="Button group with nested dropdown">
@@ -131,7 +131,7 @@
 </div>
 {% endhighlight %}
 
-  <h3 id="btn-groups-vertical">Vertical variation</h3>
+  <h2 id="btn-groups-vertical">Vertical variation</h2>
   <p>Make a set of buttons appear vertically stacked rather than horizontally. <strong class="text-danger">Split button dropdowns are not supported here.</strong></p>
   <div class="bs-example" data-example-id="vertical-button-group">
     <div class="btn-group-vertical" role="group" aria-label="Vertical button group">
@@ -187,7 +187,7 @@
 </div>
 {% endhighlight %}
 
-  <h3 id="btn-groups-justified">Justified button groups</h3>
+  <h2 id="btn-groups-justified">Justified button groups</h2>
   <p>Make a group of buttons stretch at equal sizes to span the entire width of its parent. Also works with button dropdowns within the button group.</p>
 
   <div class="bs-callout bs-callout-warning" id="callout-btn-group-justified-dbl-border">