Disable "Refetch" button for offline hosts (#799)

- Disable "Refetch" button if the host is offline
- Disable the refetch tooltip if the host is in the `refetch_requested` state.

frontend/components/LoginRoutes/_styles.scss

@@ -5,5 +5,5 @@
   justify-content: center;
   position: relative;
   min-height: 100vh;
-  background-color: $gradients-dark-gradient;
+  background-color: $gradients-dark-gradient-vertical;
 }

frontend/components/packs/PacksList/Row/_styles.scss

@@ -3,7 +3,7 @@
   cursor: pointer;
 
   &--selected {
-    background-color: $ui-vibrant-blue-10;
+    background-color: $ui-vibrant-blue-25;
   }
 
   &:focus {

frontend/components/queries/QueriesList/QueriesListRow/_styles.scss

@@ -11,7 +11,7 @@
   }
 
   &--selected {
-    background-color: $ui-vibrant-blue-10;
+    background-color: $ui-vibrant-blue-25;
   }
 
   &:hover {

frontend/components/queries/ScheduledQueriesList/ScheduledQueriesListItem/_styles.scss

@@ -8,6 +8,6 @@
   }
 
   &--selected {
-    background-color: $ui-vibrant-blue-10;
+    background-color: $ui-vibrant-blue-25;
   }
 }

frontend/components/side_panels/HostSidePanel/PanelGroupItem/_styles.scss

@@ -13,7 +13,7 @@ $base-class: "panel-group-item";
 
   &.#{$base-class}--selected {
     font-weight: $bold;
-    background-color: $ui-vibrant-blue-10;
+    background-color: $ui-vibrant-blue-25;
 
     .#{$base-class}__count {
       font-weight: $bold;

frontend/pages/hosts/HostDetailsPage/HostDetailsPage.jsx

@@ -218,7 +218,7 @@ export class HostDetailsPage extends Component {
           backgroundColor="#3e4771"
         >
           <span className={`${baseClass}__tooltip-text`}>
-            You can’t query <br /> a offline host.
+            You can’t query <br /> an offline host.
           </span>
         </ReactTooltip>
         <Button onClick={toggleDeleteHostModal()} variant="active">
@@ -380,7 +380,7 @@ export class HostDetailsPage extends Component {
           className="refetch"
           data-tip
           data-for="refetch-tooltip"
-          data-tip-disable={isOnline}
+          data-tip-disable={isOnline || showRefetchLoadingSpinner}
         >
           <Button
             className={`
@@ -389,6 +389,7 @@ export class HostDetailsPage extends Component {
               ${isOffline ? "refetch-offline" : ""} 
               ${showRefetchLoadingSpinner ? "refetch-spinner" : "refetch-btn"}
             `}
+            disabled={isOffline}
             onClick={onRefetchHost}
           >
             {showRefetchLoadingSpinner
@@ -527,7 +528,7 @@ export class HostDetailsPage extends Component {
                 </span>
                 <span className="info__header">Updated at</span>
                 <span className="info__data">
-                  {humanHostLastSeen(aboutData.seen_time)}
+                  {humanHostLastSeen(titleData.detail_updated_at)}
                 </span>
                 <span className="info__header">Uptime</span>
                 <span className="info__data">

frontend/styles/global/_global.scss

@@ -46,7 +46,7 @@ a {
 }
 
 .wrapper {
-  background: $gradients-dark-gradient;
+  background: $gradients-dark-gradient-vertical;
   margin: 0;
 }