From c4627d5429d025a089846ab8f48f942c78bbcf8e Mon Sep 17 00:00:00 2001
From: Constance Chen <constance.chen.3@gmail.com>
Date: Fri, 9 Apr 2021 09:36:38 -0700
Subject: [PATCH] CSS cleanup

---
 .../app_search/components/result/result.scss  | 31 +++----------------
 .../components/result/result_header.scss      | 25 +--------------
 .../components/result/result_header.tsx       | 10 ++++--
 .../components/result/result_header_item.scss | 10 +++---
 4 files changed, 18 insertions(+), 58 deletions(-)

diff --git a/x-pack/plugins/enterprise_search/public/applications/app_search/components/result/result.scss b/x-pack/plugins/enterprise_search/public/applications/app_search/components/result/result.scss
index 3132894ddc7a14..93bace1d77775c 100644
--- a/x-pack/plugins/enterprise_search/public/applications/app_search/components/result/result.scss
+++ b/x-pack/plugins/enterprise_search/public/applications/app_search/components/result/result.scss
@@ -1,10 +1,10 @@
 .appSearchResult {
   display: grid;
-  grid-template-columns: auto 1fr auto;
-  grid-template-rows: auto 1fr auto;
+  grid-template-columns: auto 1fr;
+  grid-template-rows: auto 1fr;
   grid-template-areas:
-    'drag content actions'
-    'drag toggle actions';
+    'drag content'
+    'drag toggle';
   overflow: hidden; // Prevents child background-colors from clipping outside of panel border-radius
   border: $euiBorderThin; // TODO: Remove after EUI version is bumped beyond 31.8.0
 
@@ -35,29 +35,6 @@
     }
   }
 
-  &__actionButtons {
-    grid-area: actions;
-    display: flex;
-    flex-wrap: no-wrap;
-  }
-
-  &__actionButton {
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    width: $euiSize * 2;
-    border-left: $euiBorderThin;
-
-    &:first-child {
-      border-left: none;
-    }
-
-    &:hover,
-    &:focus {
-      background-color: $euiPageBackgroundColor;
-    }
-  }
-
   &__dragHandle {
     grid-area: drag;
     display: flex;
diff --git a/x-pack/plugins/enterprise_search/public/applications/app_search/components/result/result_header.scss b/x-pack/plugins/enterprise_search/public/applications/app_search/components/result/result_header.scss
index cd1042998dd347..ebae11ee8ad330 100644
--- a/x-pack/plugins/enterprise_search/public/applications/app_search/components/result/result_header.scss
+++ b/x-pack/plugins/enterprise_search/public/applications/app_search/components/result/result_header.scss
@@ -1,26 +1,3 @@
 .appSearchResultHeader {
-  display: flex;
-  margin-bottom: $euiSizeS;
-
-  @include euiBreakpoint('xs') {
-    flex-direction: column;
-  }
-
-  &__column {
-    display: flex;
-    flex-wrap: wrap;
-
-    @include euiBreakpoint('xs') {
-      flex-direction: column;
-    }
-
-    & + &,
-    .appSearchResultHeaderItem + .appSearchResultHeaderItem {
-      margin-left: $euiSizeL;
-
-      @include euiBreakpoint('xs') {
-        margin-left: 0;
-      }
-    }
-  }
+  margin-bottom: $euiSizeM;
 }
diff --git a/x-pack/plugins/enterprise_search/public/applications/app_search/components/result/result_header.tsx b/x-pack/plugins/enterprise_search/public/applications/app_search/components/result/result_header.tsx
index 93a684b1968a2e..6f95c166153dff 100644
--- a/x-pack/plugins/enterprise_search/public/applications/app_search/components/result/result_header.tsx
+++ b/x-pack/plugins/enterprise_search/public/applications/app_search/components/result/result_header.tsx
@@ -38,8 +38,14 @@ export const ResultHeader: React.FC<Props> = ({
   });
 
   return (
-    <header style={{ margin: '0 0 .75rem 0' }}>
-      <EuiFlexGroup alignItems="center" gutterSize="s" justifyContent="spaceBetween">
+    <header className="appSearchResultHeader">
+      <EuiFlexGroup
+        alignItems="center"
+        gutterSize="s"
+        justifyContent="spaceBetween"
+        responsive={false}
+        wrap
+      >
         <EuiFlexItem grow>
           <ResultHeaderItem
             href={shouldLinkToDetailPage ? documentLink : undefined}
diff --git a/x-pack/plugins/enterprise_search/public/applications/app_search/components/result/result_header_item.scss b/x-pack/plugins/enterprise_search/public/applications/app_search/components/result/result_header_item.scss
index df3e2ec2411065..94367ae634b7c8 100644
--- a/x-pack/plugins/enterprise_search/public/applications/app_search/components/result/result_header_item.scss
+++ b/x-pack/plugins/enterprise_search/public/applications/app_search/components/result/result_header_item.scss
@@ -1,12 +1,12 @@
-.euiFlexItem:not(:first-child):not(:last-child) .appSearchResultHeaderItem {
-  padding-right: .75rem;
-  box-shadow: inset -1px 0 0 0 $euiBorderColor;
-}
-
 .appSearchResultHeaderItem {
   @include euiCodeFont;
 
   &__score {
     color: $euiColorSuccessText;
   }
+
+  .euiFlexItem:not(:first-child):not(:last-child) & {
+    padding-right: $euiSizeS;
+    box-shadow: inset (-$euiBorderWidthThin) 0 0 0 $euiBorderColor;
+  }
 }