aboutsummaryrefslogtreecommitdiff
path: root/frontend/src/app/_elements
diff options
context:
space:
mode:
Diffstat (limited to 'frontend/src/app/_elements')
-rw-r--r--frontend/src/app/_elements/folder/folder.component.css9
-rw-r--r--frontend/src/app/_elements/folder/folder.component.ts4
-rw-r--r--frontend/src/app/_elements/form-model/form-model.component.css34
-rw-r--r--frontend/src/app/_elements/form-model/form-model.component.html37
-rw-r--r--frontend/src/app/_elements/graph/graph.component.html2
5 files changed, 61 insertions, 25 deletions
diff --git a/frontend/src/app/_elements/folder/folder.component.css b/frontend/src/app/_elements/folder/folder.component.css
index 3ecba343..4a06faa4 100644
--- a/frontend/src/app/_elements/folder/folder.component.css
+++ b/frontend/src/app/_elements/folder/folder.component.css
@@ -1,7 +1,5 @@
#folder {
- /*position: absolute;
- left: 50%;
- transform: translateX(-50%);*/
+ width: 100%;
}
#tabs {
@@ -167,12 +165,13 @@
align-items: center;
flex-grow: 1;
height: 100%;
+ padding: 50px;
}
.folder-inside {
width: 100%;
- height: 40rem;
- overflow-y: auto;
+ min-height: 40rem;
+ max-height: 100%;
}
.file-content {
diff --git a/frontend/src/app/_elements/folder/folder.component.ts b/frontend/src/app/_elements/folder/folder.component.ts
index b09cb543..735bfdaa 100644
--- a/frontend/src/app/_elements/folder/folder.component.ts
+++ b/frontend/src/app/_elements/folder/folder.component.ts
@@ -434,7 +434,9 @@ export class FolderComponent implements AfterViewInit {
updateExperiment() {
if (this.formModel) {
- this.formModel.updateGraph();
+ setTimeout(() => {
+ this.formModel.updateGraph();
+ });
}
}
diff --git a/frontend/src/app/_elements/form-model/form-model.component.css b/frontend/src/app/_elements/form-model/form-model.component.css
index 95ace1ef..34c1a5c5 100644
--- a/frontend/src/app/_elements/form-model/form-model.component.css
+++ b/frontend/src/app/_elements/form-model/form-model.component.css
@@ -86,12 +86,12 @@ hr {
max-height: 20 rem;
}
-mat-slider {
- width: 50%;
-}
-
.slider {
background-color: transparent;
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ justify-content: center;
}
.center-center {
@@ -102,3 +102,29 @@ mat-slider {
font-size: 20px !important;
font-weight: 600;
}
+
+.slider-pad {
+ min-width: 10%;
+ background-color: gray;
+ height: 2px;
+}
+
+.slider-pad:first-child {
+ margin-right: -8px;
+}
+
+.slider-pad:last-child {
+ margin-left: -8px;
+}
+
+.slider-extended {
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ justify-content: center;
+ width: 95%;
+}
+
+.slide {
+ width: 80%;
+} \ No newline at end of file
diff --git a/frontend/src/app/_elements/form-model/form-model.component.html b/frontend/src/app/_elements/form-model/form-model.component.html
index 1b4eb834..c7a9d5ca 100644
--- a/frontend/src/app/_elements/form-model/form-model.component.html
+++ b/frontend/src/app/_elements/form-model/form-model.component.html
@@ -91,24 +91,33 @@
<div class="m-2">
<div class="row">
- <div class="col-sm-3 rounded" style="border:1px solid var(--ns-primary);margin-top: 10px;">
- <div class="row slider rounded" style="margin-left: 10px;margin-bottom: 0;">
+ <div class="col-sm-3 rounded" style="border:1px solid var(--ns-primary);margin-top: 10px; width: fit-content;">
+ <!-- <label>Veličina skupa za validaciju: </label><b>{{validationSize}} %</b>
<div class="text-center pt-3 pb-0 mb-0"><b>{{testSetDistribution}}%</b> : <b>{{100-testSetDistribution}}%</b></div>
- <div class="text-center pt-0 mt-0 p-0">Trening
- <mat-slider min="10" max="90" step="5" [(ngModel)]="testSetDistribution" (input)="updateTestSet($event)"></mat-slider>
- Test</div>
- </div>
- <div class="row p-0" style="margin-left: 10px;margin-bottom: 0; padding: 0;">
- <mat-checkbox color="accent">Nasumični redosled podataka</mat-checkbox>
+ <div class="text-center pt-0 mt-0 p-0">Trening ////slider////// Test</div>
+ -->
+ <div class="slider mt-2">
+ <div>
+ Trening {{testSetDistribution}}% : Test i validacija {{100-testSetDistribution}}%
+ </div>
+ <div class="slider-extended">
+ <div class="slider-pad"></div>
+ <mat-slider class="slide" min="10" max="90" step="5" [(ngModel)]="testSetDistribution" (input)="updateTestSet($event)"></mat-slider>
+ <div class="slider-pad"></div>
+ </div>
+ <div>
+ Test {{validationSize}}% : Validacija {{100-validationSize}}%
+ </div>
+ <div class="slider-extended">
+ <div class="slider-pad"></div>
+ <mat-slider class="slide" min="10" max="90" step="5" [(ngModel)]="validationSize" (input)="updateValidation($event)"></mat-slider>
+ <div class="slider-pad"></div>
+ </div>
</div>
- <hr style="color:accent;">
- <div class="row ">
- <label>Veličina skupa za validaciju: </label><b>{{validationSize}} %</b>
- <mat-slider class="text-center justify-content-center " style="margin-left:80px;" min="10" max="90" step="5" [(ngModel)]="validationSize" (input)="updateValidation($event)"></mat-slider>
+ <div class="d-flex justify-content-center mt-3">
+ <mat-checkbox color="accent">Nasumični redosled podataka</mat-checkbox>
</div>
-
-
</div>
<div class="col-sm-9">
diff --git a/frontend/src/app/_elements/graph/graph.component.html b/frontend/src/app/_elements/graph/graph.component.html
index 35753d40..411e8b53 100644
--- a/frontend/src/app/_elements/graph/graph.component.html
+++ b/frontend/src/app/_elements/graph/graph.component.html
@@ -1,4 +1,4 @@
-<div #graphWrapper class="w-100 position-relative" style="height: 14rem;">
+<div #graphWrapper class="position-relative" style="height: 14rem; width: 100%;">
<!-- <ng-container *ngFor="let layer of layers; let i = index">
<div [ngClass]="{'inputs': i==0}" class="node-text" *ngFor="let node of layer; let j = index" [style.left.%]="node.x * 99.4" [style.top.%]="node.y * 100">
{{ i == 0 ? (inputColumns && inputColumns.length >= j ? inputColumns[j] : 'nepoznato') : (i > 0 && i