(master): Namespace dropdown

Author: Joe Crick

index.html

@@ -21,7 +21,7 @@
                 <a class="pure-menu-heading" href="#top">Pure
                     <div class="small-caps">components</div>
                 </a>
-                <div tabindex="0" class="menu-link dropdown">
+                <div tabindex="0" class="menu-link pcssc-dropdown">
                     <span></span>
                 </div>
                 <ul class="dropdown-content pure-menu-list pure-menu">
@@ -518,7 +518,7 @@ <h3>Toggling Button Label Collapse</h3>
                     <a name="dropdown"></a>
                     <h2 class="content-subhead">Dropdown</h2>
 
-                    <div tabindex="0" class="pure-button dropdown">Dropdown Button</div>
+                    <div tabindex="0" class="pure-button pcssc-dropdown">Dropdown Button</div>
                     <ul class="dropdown-content">
                         <li class="dropdown-menu-item">
                             <button class="dropdown-action-item">Edit</button>
@@ -530,7 +530,7 @@ <h2 class="content-subhead">Dropdown</h2>
 
                     <div style="background: #ffffff; margin-top: 50px; overflow:auto;width:auto;border:solid gray;border-width:.1em .1em .1em .8em;padding:.2em .6em;"><pre
                             style="margin: 0; line-height: 125%">
-&lt;div tabindex=<span style="color: #a31515">&quot;0&quot;</span> class=<span style="color: #a31515">&quot;pure-button dropdown&quot;</span>&gt;Dropdown Button&lt;/div&gt;
+&lt;div tabindex=<span style="color: #a31515">&quot;0&quot;</span> class=<span style="color: #a31515">&quot;pure-button pcssc-dropdown&quot;</span>&gt;Dropdown Button&lt;/div&gt;
 &lt;ul class=<span style="color: #a31515">&quot;dropdown-content&quot;</span>&gt;
     &lt;li class=<span style="color: #a31515">&quot;dropdown-menu-item&quot;</span>&gt;
         &lt;button class=<span style="color: #a31515">&quot;dropdown-action-item&quot;</span>&gt;Edit&lt;/button&gt;
@@ -561,7 +561,7 @@ <h2 class="content-subhead">Collapsing Menu</h2>
     &lt;a class=<span style="color: #a31515">&quot;pure-menu-heading&quot;</span> href=<span style="color: #a31515">&quot;#top&quot;</span>&gt;Pure
         &lt;div class=<span style="color: #a31515">&quot;small-caps&quot;</span>&gt;components&lt;/div&gt;
     &lt;/a&gt;
-    &lt;div tabindex=<span style="color: #a31515">&quot;0&quot;</span> class=<span style="color: #a31515">&quot;menu-link dropdown&quot;</span>&gt;
+    &lt;div tabindex=<span style="color: #a31515">&quot;0&quot;</span> class=<span style="color: #a31515">&quot;menu-link pcssc-dropdown&quot;</span>&gt;
         &lt;span&gt;&lt;/span&gt;
     &lt;/div&gt;
     &lt;ul class=<span style="color: #a31515">&quot;dropdown-content pure-menu-list pure-menu&quot;</span>&gt;

main.css

@@ -1,6 +1,6 @@
 @import '../lib/variables';
 
-.dropdown {
+.pcssc-dropdown {
   position: relative;
   cursor: pointer;
   display: inline-block;