html, body, #container {
height: 100%;
margin: 0;
overflow: hidden;
}
#container {
display: flex;
flex-direction: column;
> header, > footer, > .eventlog {
flex: 0 0 auto;
}
}
.main-view {
flex: 1 1 auto;
display: flex;
flex-direction: row;
outline: 0;
&.vertical {
flex-direction: column;
}
.flow-detail, .flow-table {
flex: 1 1 auto;
}
}
.splitter {
flex: 0 0 1px;
background-color: #aaa;
position: relative;
> div {
position: absolute;
//debug: background-color: orange;
}
&.splitter-x {
cursor: col-resize;
> div {
margin-left: -1px;
width: 4px;
height: 100%;
}
}
&.splitter-y {
cursor: row-resize;
> div {
margin-top: -1px;
height: 4px;
width: 100%;
}
}
}