From d2e621bcad03482518c95dc92aa845bdc268d1b0 Mon Sep 17 00:00:00 2001
From: Ashwin P Chandran <ashwinpc@amazon.com>
Date: Tue, 5 Jul 2022 16:25:03 -0700
Subject: [PATCH] chore: Updates Field selector (#1845)

Signed-off-by: Ashwin Pc <ashwinpc@amazon.com>
---
 .../data_tab/field_selector_field.scss        | 19 +++++++++++++++----
 .../data_tab/field_selector_field.tsx         |  3 +--
 2 files changed, 16 insertions(+), 6 deletions(-)

diff --git a/src/plugins/wizard/public/application/components/data_tab/field_selector_field.scss b/src/plugins/wizard/public/application/components/data_tab/field_selector_field.scss
index e2f9919af3a..ef163b2f084 100644
--- a/src/plugins/wizard/public/application/components/data_tab/field_selector_field.scss
+++ b/src/plugins/wizard/public/application/components/data_tab/field_selector_field.scss
@@ -1,13 +1,24 @@
 .wizFieldSelectorField {
   @include euiBottomShadowSmall;
 
-  padding: $euiSizeXS;
   background-color: $euiColorEmptyShade;
   border: $euiBorderThin;
-  margin-top: $euiSizeS;
+  margin-top: $euiSizeXS;
+
+  & > .osdFieldButton__button {
+    padding: 0;
+  }
+
+  & .osdFieldButton__name {
+    padding: $euiSizeS $euiSizeS $euiSizeS 0;
+  }
 
   & > button {
-    align-items: center;
-    gap: 4px;
+    align-items: stretch;
+  }
+
+  & .osdFieldIcon {
+    box-shadow: none;
+    height: 100%;
   }
 }
diff --git a/src/plugins/wizard/public/application/components/data_tab/field_selector_field.tsx b/src/plugins/wizard/public/application/components/data_tab/field_selector_field.tsx
index cfa2220eed6..963660d8eb8 100644
--- a/src/plugins/wizard/public/application/components/data_tab/field_selector_field.tsx
+++ b/src/plugins/wizard/public/application/components/data_tab/field_selector_field.tsx
@@ -79,12 +79,11 @@ export const FieldSelectorField = ({ field }: FieldSelectorFieldProps) => {
 
   return (
     <FieldButton
-      size="s"
       className="wizFieldSelectorField"
       isActive={infoIsOpen}
       onClick={togglePopover}
       dataTestSubj={`field-${field.name}-showDetails`}
-      fieldIcon={<FieldIcon type={field.type} scripted={field.scripted} />}
+      fieldIcon={<FieldIcon type={field.type} scripted={field.scripted} size="l" />}
       // fieldAction={actionButton}
       fieldName={fieldName}
       {...dragProps}