fix sites toggle hover states

src/components/ToolbarBottomActions.jsx

@@ -14,7 +14,7 @@ function ToolbarBottomActions (props) {
           {/*   isEnabled={this.props.viewFilters.routes} */}
           {/* /> */}
           <SitesIcon
-            isEnabled={props.sites.enabled}
+            isActive={props.sites.enabled}
             onClickHandler={props.sites.toggle}
           />
           {/* <CoeventIcon */}

src/components/presentational/Icons/SitesIcon.js

@@ -1,7 +1,10 @@
 import React from 'react';
 
-const SitesIcon = ({ isEnabled, onClickHandler }) => {
-  const classes = (isEnabled) ? 'action-button enabled' : 'action-button disabled';
+const SitesIcon = ({ isActive, isDisabled, onClickHandler }) => {
+  let classes = (isActive) ? 'action-button enabled' : 'action-button';
+  if (isDisabled) {
+    classes = 'action-button disabled'
+  }
 
   return (
     <button

src/scss/toolbar.scss

@@ -96,6 +96,10 @@
           }
         }
 
+        &:hover {
+          cursor: pointer;
+        }
+
         &:hover:not(.disabled) {
           transition: 0.2s ease;
           border: 1px solid $offwhite;