Add hover effects to _toggle.scss

src/scss/cdb-components/forms/_toggle.scss

@@ -30,21 +30,32 @@
 
 .CDB-Toggle {
   position: absolute;
+  z-index: 1;
   width: $baseSize * 4;
   height: $baseSize * 2;
   opacity: 0;
-  z-index: 1;
+
+  &:hover {
+    + .CDB-ToggleFace {
+      background: $cHintTextHover;
+    }
+
+    &:checked + .CDB-ToggleFace {
+      background: $cHighlightHover;
+    }
+  }
 
   + .CDB-ToggleFace {
-    @include transition(background, 300ms);
     position: relative;
     width: $baseSize * 4;
     height: $baseSize * 2;
     margin: 0 2px;
+    transition: background 300ms;
     border-radius: 50px;
     background: $cHintText;
 
     &::before {
+      content: '';
       position: absolute;
       top: 2px;
       left: 2px;
@@ -53,7 +64,6 @@
       border-radius: 50%;
       background: $cWhite;
       box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.48);
-      content: '';
     }
   }
 
@@ -69,4 +79,5 @@
 
 .Toggle .is-disabled {
   opacity: 0.24;
+  pointer-events: none;
 }