diff --git a/static/panels.less b/static/panels.less index 66ea373c4..5b338913a 100644 --- a/static/panels.less +++ b/static/panels.less @@ -46,30 +46,29 @@ atom-panel-container.left, atom-panel-container.right { - display: -webkit-flex; - -webkit-flex-direction: row; - -webkit-align-items: stretch; - height: 100%; - atom-panel { - height: 100%; - } + display: flex; } +.tool-panel, // deprecated atom-panel { - display: block; + display: flex; + position: relative; + background-color: @tool-panel-background-color; } atom-panel.top, -atom-panel.bottom, -atom-panel.left, -atom-panel.right { - background-color: @tool-panel-background-color; +atom-panel.bottom { + flex-direction: column; } -// deprecated -.tool-panel { - position: relative; - background-color: @tool-panel-background-color; +atom-panel.left, +atom-panel.right { + flex-direction: row; + + // TODO: Remove in tree-view package + .tree-view-resizer { + height: initial; + } } // Modal panels @@ -77,6 +76,7 @@ atom-panel.right { .overlay, // deprecated .overlay atom-panel.modal { position: absolute; + display: block; left: 50%; width: 500px; margin-left: -250px; diff --git a/static/workspace-view.less b/static/workspace-view.less index b478ca8dd..29255f8ae 100644 --- a/static/workspace-view.less +++ b/static/workspace-view.less @@ -16,7 +16,8 @@ body { } atom-workspace { - display: block; + display: flex; + flex-direction: column; height: 100%; overflow: hidden; position: relative; @@ -25,13 +26,13 @@ atom-workspace { font-family: @font-family; atom-workspace-axis.horizontal { - display: -webkit-flex; - height: 100%; + display: flex; + flex: 1; } atom-workspace-axis.vertical { - display: -webkit-flex; - -webkit-flex: 1; - -webkit-flex-flow: column; + display: flex; + flex: 1; + flex-direction: column; } }