Merge branch 'redesign' of http://gitlab.pmf.kg.ac.rs/igrannonica/neuronstellar into redesign

# Conflicts:
#	backend/api/api/appsettings.json

3 files changed, 22 insertions, 14 deletions

diff --git a/frontend/src/app/_pages/experiment/experiment.component.css b/frontend/src/app/_pages/experiment/experiment.component.css
index 2298ae48..a8bc1248 100644
--- a/frontend/src/app/_pages/experiment/experiment.component.css
+++ b/frontend/src/app/_pages/experiment/experiment.component.css
@@ -48,6 +48,7 @@ mat-stepper {
     flex-direction: row;
     justify-content: center;
     align-items: center;
+    margin-bottom: 100px;
 }
 
 .step-content-inside {
@@ -66,4 +67,11 @@ mat-stepper {
 
 .text-overflow {
     overflow-wrap: break-word;
+    width: 170px;
+    display: inline-block;
+    text-align: left;
+}
+
+.text-overflow-experiment-name {
+    overflow-wrap: break-word;
 }
\ No newline at end of file
diff --git a/frontend/src/app/_pages/experiment/experiment.component.html b/frontend/src/app/_pages/experiment/experiment.component.html
index 8f462f86..e807dd06 100644
--- a/frontend/src/app/_pages/experiment/experiment.component.html
+++ b/frontend/src/app/_pages/experiment/experiment.component.html
@@ -2,10 +2,10 @@
     <div class="d-flex flex-colum align-items-center sidenav">
         <div>
             <div class="ekspName " style="width: 250px;">
-                <div class="text-overflow" *ngIf="experiment.name=='exp1'" style="width: 250px;">
+                <div class="text-overflow-experiment-name" *ngIf="experiment.name=='exp1'" style="width: 250px;">
                     Novi Eksperiment
                 </div>
-                <div class="text-overflow" *ngIf="experiment.name!='exp1'" style="width: 250px;">
+                <div class="text-overflow-experiment-name" *ngIf="experiment.name!='exp1'" style="width: 250px;">
                     {{experiment.name}}
                 </div>
 
@@ -14,37 +14,37 @@
                 <mat-step [completed]="this.step1">
                     <!--editable="false"-->
                     <ng-template matStepLabel>
-                        <span class="label" *ngIf="dataset==undefined">Izvor podataka </span>
-                        <span class="label addedElement" *ngIf="dataset!=undefined">{{dataset.name}}</span>
+                        <span class="label text-overflow" *ngIf="dataset==undefined">Izvor podataka </span>
+                        <span class="label addedElement text-overflow" *ngIf="dataset!=undefined">{{dataset.name}}</span>
                     </ng-template>
                     <ng-template matStepContent>
-                        <p class="text-left">Izaberite izvor podataka</p>
+                        <p class="text-left text-overflow">Izaberite izvor podataka</p>
                     </ng-template>
                 </mat-step>
                 <mat-step [completed]="experiment._id!=''">
                     <ng-template matStepLabel>
-                        <span class="label addedElement" *ngIf="experiment._id!=''">Predvideti:{{experiment.outputColumn}}</span>
+                        <span class="label addedElement text-overflow" *ngIf="experiment._id!=''">Predvideti:{{experiment.outputColumn}}</span>
                         <span *ngIf="!this.step1" class="align-middle"><mat-icon>lock</mat-icon></span>
-                        <span class="label" *ngIf="experiment._id==''">Odabir kolona </span>
+                        <span class="label text-overflow" *ngIf="experiment._id==''">Odabir kolona </span>
                     </ng-template>
                     <ng-template matStepContent>
-                        <p class="text-left">Pripremite podatke i izaberite izlazne kolone</p>
+                        <p class="text-left text-overflow">Pripremite podatke i izaberite izlazne kolone</p>
                     </ng-template>
                 </mat-step>
                 <mat-step [completed]="this.step3">
                     <ng-template matStepLabel>
                         <span *ngIf="experiment._id==''" class="align-middle"><mat-icon>lock</mat-icon></span>
-                        <span class="label addedElement" *ngIf="modelToTrain!=undefined">{{modelToTrain.name}}</span>
-                        <span class="label" *ngIf="modelToTrain==undefined">Treniranje</span>
+                        <span class="label addedElement text-overflow" *ngIf="modelToTrain!=undefined">{{modelToTrain.name}}</span>
+                        <span class="label text-overflow" *ngIf="modelToTrain==undefined">Treniranje</span>
                     </ng-template>
-                    <p class="text-left">Odaberite parametre i trenirajte model</p>
+                    <p class="text-left text-overflow">Odaberite parametre i trenirajte model</p>
                 </mat-step>
                 <mat-step [completed]="this.step4">
                     <ng-template matStepLabel>
                         <span *ngIf="!this.step3" class="align-middle"><mat-icon>lock</mat-icon></span>
-                        <span class="label">Pregled rezultata<br> treniranja</span>
+                        <span class="label text-overflow">Pregled rezultata<br> treniranja</span>
                     </ng-template>
-                    <p class="text-left">Pregledajte tok treniranja i<br> grafički prikaz rezultata</p>
+                    <p class="text-left text-overflow">Pregledajte tok treniranja i<br> grafički prikaz rezultata</p>
                 </mat-step>
             </mat-stepper>
         </div>
diff --git a/frontend/src/app/_pages/experiment/experiment.component.ts b/frontend/src/app/_pages/experiment/experiment.component.ts
index 22894131..6c8e96b3 100644
--- a/frontend/src/app/_pages/experiment/experiment.component.ts
+++ b/frontend/src/app/_pages/experiment/experiment.component.ts
@@ -57,7 +57,7 @@ export class ExperimentComponent implements AfterViewInit, OnInit {
             this.dataset = response;
             this.folderDataset.forExperiment = this.experiment;
             this.folderDataset.selectFile(this.dataset); //sad 3. i 4. korak da se ucitaju
-
+  
             //this.predictorsService.getPredictor(predictorId!).subscribe((response) => {
               let predictor = response;
               //this.modelsService.getModelById(predictor.modelId).subscribe((response) => {