Merge pull request elastic#8412 from elastic/jasper/backport/8351/5.x

[backport] PR elastic#8351 to 5.x - Prevents lengend from expanding page
airow · Sep 21, 2016 · 9876c88 · 9876c88
2 parents 64f9f1b + fbf3048
commit 9876c88
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 3 deletions.
diff --git a/src/core_plugins/kibana/public/visualize/editor/styles/_editor.less b/src/core_plugins/kibana/public/visualize/editor/styles/_editor.less
@@ -7,6 +7,12 @@
 .vis-editor {
   .flex-parent();
 
+  @media (min-width: @screen-md-min) {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+  }
+
   .btn-xs {
     line-height: 1.3;
   }

diff --git a/src/core_plugins/metric_vis/public/metric_vis.less b/src/core_plugins/metric_vis/public/metric_vis.less
@@ -7,7 +7,6 @@
   flex-wrap: wrap;
   justify-content: space-around;
   align-items: center;
-  align-content: space-around;
 
   .metric-value {
     font-weight: bold;

diff --git a/src/ui/public/visualize/visualize.less b/src/ui/public/visualize/visualize.less
@@ -15,11 +15,19 @@ visualize {
   .vis-container {
     display: flex;
     flex-direction: row;
-
-    flex: 1 0;
     overflow: auto;
     -webkit-transition: opacity 0.01s;
     transition: opacity 0.01s;
+    flex: 1 1 0;
+
+    // IE11 Hack
+    //
+    // Normally we would just set flex: 1 1 0%, which works as expected in IE11.
+    // Unfortunately, a recent bug in Firefox causes this rule to be ignored, so we
+    // have to use an IE-specific hack instead.
+    _:-ms-fullscreen, :root  & {
+      flex: 1 0;
+    }
 
     &.vis-container--legend-left {
       flex-direction: row-reverse;