Commit 1ccdf119 authored by Kruyff,D.L.W. (Dylan)'s avatar Kruyff,D.L.W. (Dylan)
Browse files

Adjustable dividers


Former-commit-id: 1a4dfea3
parent 6d109146
......@@ -7,7 +7,8 @@
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
"e2e": "ng e2e",
"postinstall": "ngcc"
},
"private": true,
"dependencies": {
......
......@@ -34,7 +34,6 @@
.channel_header {
height: 20px;
padding: 10px;
border-bottom: 1px solid lightgray;
color: black;
font-weight: 500;
text-align: center;
......
<div class="container">
<div class="left">
<div class="top">
<app-overview-window style="z-index: 10"></app-overview-window>
</div>
<div class="bot">
<div class="channel_header">
Feedback
</div>
<div class="progress">
<app-training-window></app-training-window>
</div>
</div>
</div>
<div class="right">
<div class="top">
<div class="channel_header">
Query
</div>
<div class="progress">
<app-query-window></app-query-window>
</div>
</div>
<div class="bot">
<div class="channel_header">
Results
</div>
<div class="progress">
<app-progress-view></app-progress-view>
</div>
</div>
</div>
<as-split direction="vertical">
<as-split-area [size]="30">
<as-split direction="horizontal">
<as-split-area [size]="70">
<app-overview-window style="z-index: 10"></app-overview-window>
</as-split-area>
<as-split-area [size]="30">
<div class="channel_header">
Query
</div>
<div class="progress">
<app-query-window></app-query-window>
</div>
</as-split-area>
</as-split>
</as-split-area>
<as-split-area [size]="70">
<as-split direction="horizontal">
<as-split-area [size]="70">
<div class="channel_header">
Feedback
</div>
<div class="progress">
<app-training-window></app-training-window>
</div>
</as-split-area>
<as-split-area [size]="30">
<div class="channel_header">
Results
</div>
<div class="progress">
<app-progress-view></app-progress-view>
</div>
</as-split-area>
</as-split>
</as-split-area>
</as-split>
</div>
<div class="overlay" [class.show]="greyOut" *ngIf="loadingProgress != 100"></div>
<div class="loading-progress" *ngIf="loadingProgress != 100">
......
......@@ -8,12 +8,15 @@
.left {
width: 15%;
display: flex;
flex-direction: column;
}
.list {
padding-top: 10px;
margin-left: 5px;
overflow-y: scroll;
flex-grow: 1;
}
.right {
......
......@@ -24,7 +24,6 @@
.main-container {
overflow-y: scroll;
height: 100%;
}
.container {
......
.query-container {
height: 100%;
margin: auto;
display: flex;
justify-content: center;
......
......@@ -10,7 +10,7 @@
.subplot {
margin: 20px;
height: max-content;
border: 2px solid;
border: 2px solid lightblue;
border-radius: 25px;
padding: 20px;
}
......
.container {
height: 100%;
position: relative;
}
.top {
height: 50%;
overflow-y: scroll;
border-bottom: groove;
}
.bot {
height: 50%;
overflow-y: scroll;
}
.train-button:hover {
background-color: white;
color: black;
......@@ -45,10 +33,3 @@ button {
transition-duration: 0.4s;
cursor: pointer;
}
::ng-deep mat-tab-group{
height: 100%;
}
::ng-deep .mat-tab-body {
flex-grow: 1;
}
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment