From d8204643fe537b7e2d09301b9d36d853b4e92430 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Alejandro=20Fern=C3=A1ndez?=
 <alejandro.fernandez@elastic.co>
Date: Tue, 14 Jul 2020 13:28:35 +0200
Subject: [PATCH] [Logs UI] Refine log entry row context button (#71260)

Co-authored-by: Elastic Machine <elasticmachine@users.noreply.github.com>
---
 .../log_entry_context_menu.tsx                | 24 ++++++++++++-------
 1 file changed, 15 insertions(+), 9 deletions(-)

diff --git a/x-pack/plugins/infra/public/components/logging/log_text_stream/log_entry_context_menu.tsx b/x-pack/plugins/infra/public/components/logging/log_text_stream/log_entry_context_menu.tsx
index adc1ce4d8c9f..be140a810f16 100644
--- a/x-pack/plugins/infra/public/components/logging/log_text_stream/log_entry_context_menu.tsx
+++ b/x-pack/plugins/infra/public/components/logging/log_text_stream/log_entry_context_menu.tsx
@@ -6,7 +6,13 @@
 
 import React, { useMemo } from 'react';
 import { i18n } from '@kbn/i18n';
-import { EuiButtonIcon, EuiPopover, EuiContextMenuPanel, EuiContextMenuItem } from '@elastic/eui';
+import {
+  EuiButton,
+  EuiIcon,
+  EuiPopover,
+  EuiContextMenuPanel,
+  EuiContextMenuItem,
+} from '@elastic/eui';
 
 import { euiStyled } from '../../../../../observability/public';
 import { LogEntryColumnContent } from './log_entry_column';
@@ -50,12 +56,15 @@ export const LogEntryContextMenu: React.FC<LogEntryContextMenuProps> = ({
 
   const button = (
     <ButtonWrapper>
-      <EuiButtonIcon
+      <EuiButton
+        size="s"
+        fill
         aria-label={ariaLabel || DEFAULT_MENU_LABEL}
-        color="ghost"
-        iconType="boxesHorizontal"
         onClick={onOpen}
-      />
+        style={{ minWidth: 'auto' }}
+      >
+        <EuiIcon type="boxesHorizontal" />
+      </EuiButton>
     </ButtonWrapper>
   );
 
@@ -88,8 +97,5 @@ const AbsoluteWrapper = euiStyled.div`
 `;
 
 const ButtonWrapper = euiStyled.div`
-  background: ${(props) => props.theme.eui.euiColorPrimary};
-  border-radius: 50%;
-  padding: 4px;
-  transform: translateY(-6px);
+  transform: translate(-6px, -6px);
 `;