fixes to menu style, fixes to checkbox docs, removes weird outline in chrome for checkbox

Former-commit-id: 11c4b575dd6b4823980218ccf433d6dc8171e6c4
Former-commit-id: 2c8b5d176ccd5f477473284e360a23f7a41487d9

node/src/documents/modules/checkbox.html

@@ -36,7 +36,7 @@ type   : 'UI Module'
     <h3>Check Box</h3>
     <p>The html required for a standard UI checkbox</p>
     <div class="ui checkbox">
-      <input type="checkbox" id="uniqueid" />
+      <input type="checkbox" />
       <label for="uniqueid"></label>
     </div>
   </div>
@@ -46,7 +46,11 @@ type   : 'UI Module'
     <p>The html required for a standard UI radio box</p>
     <p>A radio box is just a reskinned version of a checkbox, the initialization of the module is the same.</p>
     <div class="ui radio checkbox">
-      <input type="checkbox" id="uniqueid" />
+      <input type="radio" name="foo" />
+      <label for="uniqueid"></label>
+    </div>
+    <div class="ui radio checkbox">
+      <input type="radio" name="foo" />
       <label for="uniqueid"></label>
     </div>
   </div>
@@ -90,8 +94,8 @@ type   : 'UI Module'
   })
 ;</div>
     </li>
-    <li>Default settings for the module can be overridden by modifying $.fn.Checkbox.settings.
-      <br><div class="code">$.fn.Checkbox.settings.moduleName = 'Godzilla';</div>
+    <li>Default settings for the module can be overridden by modifying $.fn.checkbox.settings.
+      <br><div class="code">$.fn.checkbox.settings.moduleName = 'Godzilla';</div>
     </li>
     <li>Settings can be changed after a module is initialized by calling the 'settings' method on the module with either a settings object or a name, value pair. 
       <br><div class="code">$('.foo').checkbox('setting', 'moduleName', 'Godzilla');</div>

node/src/files/javascript/semantic.js

@@ -142,28 +142,30 @@ semantic.ready = function() {
         $waypoint = $('h2').eq( $group.index( $header ) ),
         offset    = $waypoint.offset().top - 80
       ;
-      $menu
-        .addClass('animating')
-      ;
-      $headers
-        .removeClass('active')
-      ;
-      $body
-        .stop()
-        .animate({
-          scrollTop: offset
-        }, 500, function() {
-          $menu
-            .removeClass('animating')
-          ;
-          $header
-            .addClass('active')
-          ;
-        })
-        .one('scroll', function() {
-          $body.stop();
-        })
-      ;
+      if(!$header.hasClass('active') ) {
+        $menu
+          .addClass('animating')
+        ;
+        $headers
+          .removeClass('active')
+        ;
+        $body
+          .stop()
+          .animate({
+            scrollTop: offset
+          }, 500, function() {
+            $menu
+              .removeClass('animating')
+            ;
+            $header
+              .addClass('active')
+            ;
+          })
+          .one('scroll', function() {
+            $body.stop();
+          })
+        ;
+      }
     },
 
     peekSub: function() {

src/collections/menu.css

@@ -441,59 +441,6 @@
   color: rgba(0, 0, 0, 0.75);
 }
 
-
-/*--------------
-     Colors
----------------*/
-
-/*--- Light Colors  ---*/
-.ui.grey.menu {
-  background-color: #F0F0F0;
-}
-
-/*--- Inverted Colors  ---*/
-.ui.inverted.green.menu {
-  background-color: #A1CF64;
-}
-.ui.inverted.green.pointing.menu .item.active:after {
-  background-color: #A1CF64;
-}
-
-.ui.inverted.red.menu {
-  background-color: #EF4D6D;
-}
-.ui.inverted.red.pointing.menu .item.active:after {
-  background-color: #F16883;
-}
-
-.ui.inverted.blue.menu {
-  background-color: #6ECFF5;
-}
-.ui.inverted.blue.pointing.menu .item.active:after {
-  background-color: #6ECFF5;
-}
-
-.ui.inverted.purple.menu {
-  background-color: #564F8A;
-}
-.ui.inverted.purple.pointing.menu .item.active:after {
-  background-color: #564F8A;
-}
-
-.ui.inverted.orange.menu {
-  background-color: #F05940;
-}
-.ui.inverted.orange.pointing.menu .item.active:after {
-  background-color: #F05940;
-}
-
-.ui.inverted.teal.menu {
-  background-color: #00B5AD;
-}
-.ui.inverted.teal.pointing.menu .item.active:after {
-  background-color: #00B5AD;
-}
-
 /*--- Border ---*/
 .ui.inverted.menu .item:before {
   background-image: -webkit-linear-gradient(top,
@@ -590,16 +537,69 @@
 
 /*--- Pointers ---*/
 .ui.inverted.pointing.menu .item.active:after {
-  background-color: #3E3E3E;
+  background-color: #505050;
   box-shadow: none;
 }
 .ui.inverted.pointing.menu .item.active:hover:after {
   background-color: #3B3B3B;
 }
 
+/*--------------
+     Colors
+---------------*/
+
+/*--- Light Colors  ---*/
+.ui.grey.menu {
+  background-color: #F0F0F0;
+}
+
+/*--- Inverted Colors  ---*/
+.ui.inverted.green.menu {
+  background-color: #A1CF64;
+}
+.ui.inverted.green.pointing.menu .item.active:after {
+  background-color: #A1CF64;
+}
+
+.ui.inverted.red.menu {
+  background-color: #EF4D6D;
+}
+.ui.inverted.red.pointing.menu .item.active:after {
+  background-color: #F16883;
+}
+
+.ui.inverted.blue.menu {
+  background-color: #6ECFF5;
+}
+.ui.inverted.blue.pointing.menu .item.active:after {
+  background-color: #6ECFF5;
+}
+
+.ui.inverted.purple.menu {
+  background-color: #564F8A;
+}
+.ui.inverted.purple.pointing.menu .item.active:after {
+  background-color: #564F8A;
+}
+
+.ui.inverted.orange.menu {
+  background-color: #F05940;
+}
+.ui.inverted.orange.pointing.menu .item.active:after {
+  background-color: #F05940;
+}
+
+.ui.inverted.teal.menu {
+  background-color: #00B5AD;
+}
+.ui.inverted.teal.pointing.menu .item.active:after {
+  background-color: #00B5AD;
+}
+
 /*--------------
      Basic
 ---------------*/
+
 .ui.basic.menu {
   background-color: transparent;
   -webkit-box-shadow: none;
@@ -614,6 +614,11 @@
 .ui.basic.menu .item:before {
   display: none;
 }
+.ui.basic.pointing.menu item.active:after {
+  -webkit-box-shadow: none;
+  -moz-box-shadow: none;
+  box-shadow: none;
+}
 
 /*--------------
     Icon Only

src/modules/checkbox.css

@@ -11,6 +11,7 @@
 .ui.checkbox {
   position: relative;
   display: inline-block;
+  outline: none;
 
   width: 1em;
   height: 1em;
@@ -18,11 +19,13 @@
 }
 .ui.checkbox input {
   visibility: hidden;
+  outline: none;
 }
 
 
 /*--- Box ---*/
 .ui.checkbox label {
+  outline: none;
   cursor: pointer;
   position: absolute;
   width: 1em;