[Logs UI] Fix minimap tooltip (#67294)

elastic · May 27, 2020 · 909d418 · 909d418
1 parent 3b10a8c
commit 909d418
Showing 1 changed file with 8 additions and 2 deletions.
diff --git a/x-pack/plugins/infra/public/components/logging/log_minimap/search_marker_tooltip.tsx b/x-pack/plugins/infra/public/components/logging/log_minimap/search_marker_tooltip.tsx
@@ -9,6 +9,8 @@ import * as React from 'react';
 
 import { AutoSizer } from '../../auto_sizer';
 
+const POPOVER_ARROW_SIZE = 12; // px, to position it later
+
 interface SearchMarkerTooltipProps {
   markerPosition: ClientRect;
 }
@@ -19,7 +21,7 @@ export class SearchMarkerTooltip extends React.PureComponent<SearchMarkerTooltip
 
     return (
       <EuiPortal>
-        <div style={{ position: 'relative' }}>
+        <div>
           <AutoSizer content={false} bounds>
             {({ measureRef, bounds: { width, height } }) => {
               const { top, left } =
@@ -41,7 +43,11 @@ export class SearchMarkerTooltip extends React.PureComponent<SearchMarkerTooltip
                   }}
                   ref={measureRef}
                 >
-                  {children}
+                  <div
+                    className="euiToolTip__arrow"
+                    style={{ left: width || 0, top: (height || 0) / 2 - POPOVER_ARROW_SIZE / 2 }}
+                  />
+                  <div>{children}</div>
                 </div>
               );
             }}