diff options
Diffstat (limited to 'frontend/src/app/_pages')
| -rw-r--r-- | frontend/src/app/_pages/experiment/experiment.component.html | 82 | ||||
| -rw-r--r-- | frontend/src/app/_pages/home/home.component.css | 10 | ||||
| -rw-r--r-- | frontend/src/app/_pages/home/home.component.html | 8 |
3 files changed, 55 insertions, 45 deletions
diff --git a/frontend/src/app/_pages/experiment/experiment.component.html b/frontend/src/app/_pages/experiment/experiment.component.html index 4c9d0222..20ff33d1 100644 --- a/frontend/src/app/_pages/experiment/experiment.component.html +++ b/frontend/src/app/_pages/experiment/experiment.component.html @@ -1,47 +1,47 @@ <div class="container-fluid p-0 text-offwhite holder" style="height: calc(100vh - 64px); text-align: center;"> <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;"> - Novi Eksperiment - </div> - <div class="text-overflow" *ngIf="experiment.name!='exp1'" style="width: 250px;"> - {{experiment.name}} - </div> + <div class="ekspName " style="width: 250px;"> + <div class="text-overflow" *ngIf="experiment.name=='exp1'" style="width: 250px;"> + Novi Eksperiment + </div> + <div class="text-overflow" *ngIf="experiment.name!='exp1'" style="width: 250px;"> + {{experiment.name}} + </div> - </div> - <mat-stepper orientation="vertical" (selectionChange)="changePage($event)"> - <mat-step> - <!--editable="false"--> - <ng-template matStepLabel> - <span class="label" *ngIf="dataset==undefined">Izvor podataka</span> - <span class="label addedElement" *ngIf="dataset!=undefined">{{dataset.name}}</span> - </ng-template> - <ng-template matStepContent> - <p class="text-left">Izaberite vas izvor podataka</p> - </ng-template> - </mat-step> - <mat-step> - <ng-template matStepLabel> - <span class="label addedElement" *ngIf="experiment.name!='exp1'">Predvideti:{{experiment.outputColumn}}</span> - <span class="label" *ngIf="experiment.name=='exp1'">Odabir kolona</span> - </ng-template> - <ng-template matStepContent> - <p class="text-left">Pripremite podatke i izaberite izlazne kolone</p> - </ng-template> - </mat-step> - <mat-step> - <ng-template matStepLabel> - <span class="label addedElement" *ngIf="modelToTrain!=undefined">{{modelToTrain.name}}</span> - <span class="label" *ngIf="modelToTrain==undefined">Treniranje</span> - </ng-template> - <p class="text-left">Odaberite parametre i trenirajte model</p> - </mat-step> - <mat-step> - <ng-template matStepLabel><span class="label">Pregled rezultata<br> treniranja</span></ng-template> - <p class="text-left">Pregledajte tok treniranja i<br> grafički prikaz rezultata</p> - </mat-step> - </mat-stepper> + </div> + <mat-stepper orientation="vertical" (selectionChange)="changePage($event)"> + <mat-step> + <!--editable="false"--> + <ng-template matStepLabel> + <span class="label" *ngIf="dataset==undefined">Izvor podataka</span> + <span class="label addedElement" *ngIf="dataset!=undefined">{{dataset.name}}</span> + </ng-template> + <ng-template matStepContent> + <p class="text-left">Izaberite izvor podataka</p> + </ng-template> + </mat-step> + <mat-step> + <ng-template matStepLabel> + <span class="label addedElement" *ngIf="experiment.name!='exp1'">Predvideti:{{experiment.outputColumn}}</span> + <span class="label" *ngIf="experiment.name=='exp1'">Odabir kolona</span> + </ng-template> + <ng-template matStepContent> + <p class="text-left">Pripremite podatke i izaberite izlazne kolone</p> + </ng-template> + </mat-step> + <mat-step> + <ng-template matStepLabel> + <span class="label addedElement" *ngIf="modelToTrain!=undefined">{{modelToTrain.name}}</span> + <span class="label" *ngIf="modelToTrain==undefined">Treniranje</span> + </ng-template> + <p class="text-left">Odaberite parametre i trenirajte model</p> + </mat-step> + <mat-step> + <ng-template matStepLabel><span class="label">Pregled rezultata<br> treniranja</span></ng-template> + <p class="text-left">Pregledajte tok treniranja i<br> grafički prikaz rezultata</p> + </mat-step> + </mat-stepper> </div> </div> <div #stepsContainer class="steps-container"> @@ -66,4 +66,4 @@ </div> </div> </div> -</div> +</div>
\ No newline at end of file diff --git a/frontend/src/app/_pages/home/home.component.css b/frontend/src/app/_pages/home/home.component.css index 906f5728..51f22320 100644 --- a/frontend/src/app/_pages/home/home.component.css +++ b/frontend/src/app/_pages/home/home.component.css @@ -11,10 +11,20 @@ h1 { font-weight: 900 !important; margin-top: 1rem; margin-bottom: 2.5rem; + font-family: /*'Garamond',*/ + 'Courier New', Courier, monospace; } .card { margin: 2.5rem !important; padding: 1.5rem; width: 26rem !important; +} + +a { + text-decoration: none; +} + +.subtitle-class { + letter-spacing: 0.2rem; }
\ No newline at end of file diff --git a/frontend/src/app/_pages/home/home.component.html b/frontend/src/app/_pages/home/home.component.html index 2825b3bf..9b559bc9 100644 --- a/frontend/src/app/_pages/home/home.component.html +++ b/frontend/src/app/_pages/home/home.component.html @@ -11,9 +11,9 @@ <div class="card shadowed bg-light text-light col-3 m-3" style="width: 18rem;"> <div class="card-body"> <mat-icon width="48px" height="48px" style="font-size: 48px; margin-left: 50%; transform: translateX(-100%);">model_training</mat-icon> - <h3 class="card-title my-2">Experimentiši</h3> + <h2 class="card-title my-2 subtitle-class">Eksperimentiši</h2> <p class="card-text"> - U tri koraka <a class="stretched-link" routerLink="experiment">napravite novu neuronsku mrežu</a>. Koristite postojeće izvore podataka, modele, itd. + U tri koraka <a class="stretched-link text-light" routerLink="experiment">napravite novu neuronsku mrežu</a>. Koristite postojeće izvore podataka, modele, itd. </p> </div> </div> @@ -21,9 +21,9 @@ <div class="card-body"> <mat-icon width="48px" height="48px" style="font-size: 48px; margin-left: 50%; transform: translateX(-100%);">storage </mat-icon> - <h3 class="card-title my-2">Arhiva</h3> + <h2 class="card-title my-2 subtitle-class">Arhiva</h2> <p class="card-text"> - <a class="stretched-link" routerLink="archive">Upravljajte</a> izvorima podataka, eksperimentima, modelima, i rezultatima treniranja. Pogledajte podatke koje su podelili drugi korisnici. + <a class="stretched-link text-light" routerLink="archive">Upravljajte</a> izvorima podataka, eksperimentima, modelima i rezultatima treniranja. Pogledajte podatke koje su podelili drugi korisnici. </p> </div> </div> |