Minor style fixes in frontend (#2084)

- Fix padding in query editor autocomplete box
- Hide cursor in read-only query editor
- Remove styling of active line in query editor (which does not update
  properly and is therefore distracting)
- Fix padding and reorder buttons in delete label modal

frontend/components/KolideAce/theme.css

@@ -20,6 +20,10 @@
   border-bottom: solid 1px #c38dec;
 }
 
+.ace-kolide.ace_autocomplete .ace_content {
+    padding-left: 0px;
+}
+
 .ace-kolide .ace_content {
   padding-left: 6px;
   height: 100% !important;
@@ -54,6 +58,11 @@
   color: #aeafad
 }
 
+/* Hide cursor in read-only mode */
+.ace-kolide .ace_hidden-cursors {
+  opacity:0
+}
+
 .ace-kolide .ace_marker-layer .ace_selection {
   background: rgba(74, 144, 226, 0.13);
 }
@@ -71,15 +80,6 @@
   border: 1px solid #d1d1d1
 }
 
-.ace-kolide .ace_marker-layer .ace_active-line {
-  background: #eaedfb;
-  border-radius: 2px;
-  top: 2px !important;
-  right: 2px !important;
-  left: 2px !important;
-  height: 20px !important;
-}
-
 .ace-kolide .ace_marker-layer .ace_selected-word {
   border: 1px solid #d6d6d6
 }
@@ -88,11 +88,6 @@
   color: #d1d1d1
 }
 
-.ace-kolide .ace_line {
-  /*line-height: 24px;*/
-  /*height: auto !important;*/
-}
-
 .ace-kolide .ace_keyword {
   color: #ae6ddf;
   font-weight: 600;
@@ -183,4 +178,3 @@
 .ace-kolide .ace_indent-guide {
   background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAACCAYAAACZgbYnAAAAE0lEQVQImWP4////f4bdu3f/BwAlfgctduB85QAAAABJRU5ErkJggg==) right repeat-y
 }
-

frontend/pages/hosts/ManageHostsPage/ManageHostsPage.jsx

@@ -414,12 +414,12 @@ export class ManageHostsPage extends PureComponent {
       <Modal
         title="Delete Label"
         onExit={toggleDeleteLabelModal}
-        className={`${baseClass}__modal`}
+        className={`${baseClass}_delete-label__modal`}
       >
         <p>Are you sure you wish to delete this label?</p>
-        <div>
-          <Button onClick={toggleDeleteLabelModal} variant="inverse">Cancel</Button>
+        <div className={`${baseClass}__modal-buttons`}>
           <Button onClick={onDeleteLabel} variant="alert">Delete</Button>
+          <Button onClick={toggleDeleteLabelModal} variant="inverse">Cancel</Button>
         </div>
       </Modal>
     );

frontend/pages/hosts/ManageHostsPage/_styles.scss

@@ -89,7 +89,7 @@
     flex-direction: row-reverse;
 
     .button--alert {
-      margin-left: 10px;
+      margin-left: 15px;
     }
   }