Host Details Page: Spiffier vertically centered header (#2566)

frontend/pages/hosts/HostDetailsPage/_styles.scss

@@ -150,7 +150,7 @@
 
     .hostname-container {
       display: flex;
-      align-items: flex-end;
+      align-items: center;
     }
 
     .hostname {
@@ -167,13 +167,14 @@
 
     .refetch {
       display: flex;
+      margin-right: $pad-small;
 
       .refetch-btn {
         color: $core-vibrant-blue;
         cursor: default;
         font-size: $x-small;
-        display: inline;
-        margin: 9px 0 0 0; // aligns with spinner
+        height: 38px;
+        margin-right: $pad-small;
 
         &::before {
           display: inline-block;
@@ -181,8 +182,7 @@
           padding: 5px 0 0 0; // centers spin
           content: url(../assets/images/icon-refetch-12x12@2x.png);
           transform: scale(0.5);
-          vertical-align: bottom;
-          height: 20px;
+          height: 28px;
         }
 
         &:hover {
@@ -202,14 +202,13 @@
         color: $core-vibrant-blue;
         cursor: default;
         font-size: $x-small;
-        display: inline;
+        height: 38px;
         opacity: 50%;
         filter: saturate(100%);
 
         &::before {
           display: inline-block;
           position: relative;
-          top: 7px; // aligns with text
           padding: 5px 0 0 0; // centers spin
           display: inline-block;
           content: url(../assets/images/icon-refetch-12x12@2x.png);
@@ -304,7 +303,7 @@
 
   &__action-button-container {
     display: flex;
-    align-items: flex-start;
+    align-items: center;
   }
 
   &__query-button,