(master): Rename section accordion-section

Author: Joe Crick

index.html

@@ -151,7 +151,7 @@ <h2 class="content-subhead">Installation</h2>
                     <h2 class="content-subhead">Accordion</h2>
 
                     <ul class="accordion">
-                        <li class="section">
+                        <li class="accordion-section">
                             <input type="radio" class="hidden-header hidden" id="a-1" name="a-tab-head" role="tab"
                                    checked/>
                             <label for="a-1" class="tab-header">Option 0</label>
@@ -162,15 +162,15 @@ <h2>Heading 1</h2>
                                 vel vestibulum in,
                             </div>
                         </li>
-                        <li class="section">
+                        <li class="accordion-section">
                             <input type="radio" class="hidden-header hidden" id="a-2" name="a-tab-head" role="tab"/>
                             <label for="a-2" class="tab-header">Option 1</label>
                             <div class="content">
                                 <h2>Heading 1</h2>
                                 Content goes here
                             </div>
                         </li>
-                        <li class="section">
+                        <li class="accordion-section">
                             <input type="radio" class="hidden-header hidden" id="a-3" name="a-tab-head" role="tab"/>
                             <label for="a-3" class="tab-header">Option 2</label>
                             <div class="content">
@@ -615,7 +615,7 @@ <h3 class="popover-title">Popover Right</h3>
                     <h2 class="content-subhead">Tabs</h2>
 
                     <ul class="accordion accordion-tab">
-                        <li class="section">
+                        <li class="accordion-section">
                             <input type="radio" class="hidden-header hidden" id="zero" name="tab-head" role="tab"
                                    checked/>
                             <label for="zero" class="tab-header">Option 0</label>
@@ -626,15 +626,15 @@ <h2>Heading 1</h2>
                                 vel vestibulum in,
                             </div>
                         </li>
-                        <li class="section">
+                        <li class="accordion-section">
                             <input type="radio" class="hidden-header hidden" id="one" name="tab-head" role="tab"/>
                             <label for="one" class="tab-header">Option 1</label>
                             <div class="content">
                                 <h2>Heading 1</h2>
                                 Content goes here
                             </div>
                         </li>
-                        <li class="section">
+                        <li class="accordion-section">
                             <input type="radio" class="hidden-header hidden" id="two" name="tab-head" role="tab"/>
                             <label for="two" class="tab-header">Option 2</label>
                             <div class="content">

main.css

@@ -7,7 +7,7 @@
 
   &.accordion-tab {
 
-    .section {
+    .accordion-section {
       @media only screen and (min-width: 768px) {
         display: inline;
       }
@@ -31,7 +31,7 @@
 
   }
 
-  .section {
+  .accordion-section {
     margin: 0;
     padding: 18px 0 4px;
     display: block;