[Discover] Show doc viewer action buttons on focus

elastic · Apr 30, 2020 · 2ad073c · 2ad073c
1 parent d75328c
commit 2ad073c
Showing 1 changed file with 13 additions and 0 deletions.
diff --git a/src/plugins/discover/public/components/doc_viewer/_doc_viewer.scss b/src/plugins/discover/public/components/doc_viewer/_doc_viewer.scss
@@ -43,6 +43,14 @@
 }
 .kbnDocViewer__buttons {
   width: 60px;
+
+  // Show all icons if one is focused,
+  // IE doesn't support, but the fallback is just the focused button becomes visible
+  &:focus-within {
+    .kbnDocViewer__actionButton {
+      opacity: 1;
+    }
+  }
 }
 
 .kbnDocViewer__field {
@@ -51,7 +59,12 @@
 
 .kbnDocViewer__actionButton {
   opacity: 0;
+
+  &:focus {
+    opacity: 1;
+  }
 }
+
 .kbnDocViewer__warning {
   margin-right: $euiSizeS;
 }