From ed0346e250a17617bb4aa32d34e29d1616a96d0e Mon Sep 17 00:00:00 2001
From: Jacob Shandling <61553566+jacobshandling@users.noreply.github.com>
Date: Mon, 29 Jan 2024 11:12:21 -0800
Subject: [PATCH] =?UTF-8?q?UI=20=E2=80=93=20apply=20grid=20gap=20in=20both?=
 =?UTF-8?q?=20directions=20in=20'Edit=20column=20modal'=20(#16421)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

## Addresses #16418
<img width="808" alt="Screenshot 2024-01-29 at 10 55 40 AM"
src="https://github.com/fleetdm/fleet/assets/61553566/6142337f-b781-4670-a1b3-f2bb5d225e7a">


- [x] Manual QA for all new/changed functionality

Co-authored-by: Jacob Shandling <jacob@fleetdm.com>
---
 .../components/EditColumnsModal/EditColumnsModal.jsx          | 4 ++--
 .../ManageHostsPage/components/EditColumnsModal/_styles.scss  | 4 ++--
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/frontend/pages/hosts/ManageHostsPage/components/EditColumnsModal/EditColumnsModal.jsx b/frontend/pages/hosts/ManageHostsPage/components/EditColumnsModal/EditColumnsModal.jsx
index 56221cc833..883dcc64f3 100644
--- a/frontend/pages/hosts/ManageHostsPage/components/EditColumnsModal/EditColumnsModal.jsx
+++ b/frontend/pages/hosts/ManageHostsPage/components/EditColumnsModal/EditColumnsModal.jsx
@@ -61,7 +61,7 @@ const EditColumnsModal = ({
 
   return (
     <Modal title="Edit columns" onExit={onCancelColumns} className={baseClass}>
-      <>
+      <div className="form">
         <p>Choose which columns you see:</p>
         <div className={`${baseClass}__column-headers`}>
           {columnItems.map((column) => {
@@ -90,7 +90,7 @@ const EditColumnsModal = ({
             Cancel
           </Button>
         </div>
-      </>
+      </div>
     </Modal>
   );
 };
diff --git a/frontend/pages/hosts/ManageHostsPage/components/EditColumnsModal/_styles.scss b/frontend/pages/hosts/ManageHostsPage/components/EditColumnsModal/_styles.scss
index 9b17c6a3d3..aa487c38bf 100644
--- a/frontend/pages/hosts/ManageHostsPage/components/EditColumnsModal/_styles.scss
+++ b/frontend/pages/hosts/ManageHostsPage/components/EditColumnsModal/_styles.scss
@@ -1,7 +1,7 @@
 .edit-columns-modal {
   &__column-headers {
     display: grid;
-    grid-template-columns: 1fr 1fr ;
-    grid-column-gap: $pad-medium;
+    grid-template-columns: 1fr 1fr;
+    gap: $pad-medium;
   }
 }