diff options
3 files changed, 54 insertions, 39 deletions
diff --git a/frontend/src/app/_elements/column-table/column-table.component.css b/frontend/src/app/_elements/column-table/column-table.component.css index 4dfb32ee..fdf69dbc 100644 --- a/frontend/src/app/_elements/column-table/column-table.component.css +++ b/frontend/src/app/_elements/column-table/column-table.component.css @@ -8,9 +8,15 @@ table.fixed { border-radius: 4px; } +#divTable { + height: 100%; + overflow-y: auto; +} + table.fixed td { overflow: hidden; max-width: 200px; + min-width: 200px; vertical-align: middle; background-color: var(--ns-bg-dark-100); margin: 4px; @@ -18,7 +24,8 @@ table.fixed td { table.fixed th { overflow: hidden; - max-width: 350px; + max-width: 120px; + min-width: 120px; vertical-align: middle; background-color: var(--ns-bg-dark-100); font-size: 14px; @@ -43,32 +50,11 @@ table.fixed th:first-child { } mat-slider { - width: 150px; -} - -.belowColumn { - background-color: transparent; + width: 300px; } .slider { - background-color: var(--ns-bg-dark-50); -} - -.bottom-button { - font-size: large; - position: relative; - background-color: var(--ns-primary); - width: 10rem; - height: 2.3rem; - border-color: var(--ns-primary); - border-style: solid; - border-width: 0px 1px 1px 1px; -} - -#footer { - display: flex; - flex-direction: row; - justify-content: center; + background-color: var(--ns-bg-dark-100); } #missingValuesHeader { @@ -85,9 +71,14 @@ mat-slider { flex-direction: row; justify-content: space-between; align-items: center; + vertical-align: middle; height: 100%; } +.text-left { + text-align: left !important; +} + table ::ng-deep .mat-form-field-wrapper { margin-top: -2rem; } @@ -125,6 +116,7 @@ table ::ng-deep .mat-form-field-wrapper { #folder-table { border: 1px solid var(--ns-primary); border-radius: 4px; + height: 70%; } #tabs { @@ -201,4 +193,21 @@ table ::ng-deep .mat-form-field-wrapper { .hidden { display: none; +} + +.bottom-button { + font-size: large; + position: relative; + background-color: var(--ns-primary); + width: 10rem; + height: 2.3rem; + border-color: var(--ns-primary); + border-style: solid; + border-width: 0px 1px 1px 1px; +} + +#footer { + display: flex; + flex-direction: row; + justify-content: center; }
\ No newline at end of file diff --git a/frontend/src/app/_elements/column-table/column-table.component.html b/frontend/src/app/_elements/column-table/column-table.component.html index 0c33786e..811df4bd 100644 --- a/frontend/src/app/_elements/column-table/column-table.component.html +++ b/frontend/src/app/_elements/column-table/column-table.component.html @@ -12,7 +12,7 @@ </div> <div id="folder-table" *ngIf="dataset && experiment"> <!--<div [ngSwitch]="tabToDisplay">--> - <div> + <div id="divTable"> <div [ngClass]="{'hidden': tabToDisplay != Table.Data}"> <table class="table text-offwhite fixed bg-blur"> @@ -20,8 +20,10 @@ <tr> <th>#</th> <th class="columnNames" *ngFor="let colInfo of dataset.columnInfo; let i = index"> - #{{i + 1}} {{colInfo.columnName}} - <mat-checkbox checked (change)="changeInputColumns($event, colInfo.columnName)"></mat-checkbox> + <div class="cell-align"> + #{{i + 1}} {{colInfo.columnName}} + <mat-checkbox color="primary" checked (change)="changeInputColumns($event, colInfo.columnName)"></mat-checkbox> + </div> </th> </tr> </thead> @@ -50,7 +52,11 @@ </thead> <tbody> <tr *ngFor="let colInfo of dataset.columnInfo; let i = index"> - <th>#{{i + 1}} {{colInfo.columnName}}</th> + <th> + <div class="text-left"> + {{colInfo.columnName}} + </div> + </th> <td *ngFor="let colInfo of dataset.columnInfo; let j = index"> <div class="text-overflow"> 0.1 @@ -69,7 +75,7 @@ <th class="columnNames" *ngFor="let colInfo of dataset.columnInfo; let i = index"> <div class="cell-align"> #{{i + 1}} {{colInfo.columnName}} - <mat-checkbox checked (change)="changeInputColumns($event, colInfo.columnName)"></mat-checkbox> + <mat-checkbox color="primary" checked (change)="changeInputColumns($event, colInfo.columnName)"></mat-checkbox> </div> </th> </tr> @@ -185,7 +191,7 @@ </div> </div> -<div class="container-fluid text-offwhite belowColumn"> +<div class="container-fluid text-offwhite belowColumn mt-3"> <div class="ns-row"> <div class="ns-col slider rounded" style="border:1px solid var(--ns-primary)"> 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 33ec85de..2139a1c0 100644 --- a/frontend/src/app/_elements/form-model/form-model.component.html +++ b/frontend/src/app/_elements/form-model/form-model.component.html @@ -94,8 +94,8 @@ <app-graph [model]="newModel" [inputCols]="newModel.inputColNum"></app-graph> </div> <div class="ns-row"> - - <div class ="ns-col" id="layers-control"> + + <div class="ns-col" id="layers-control"> <div>Broj Skrivenih Slojeva</div> <button class="btn-clear btn-icon" (click)="addLayer()"> <mat-icon>add</mat-icon> @@ -104,21 +104,21 @@ <button class="btn-clear btn-icon" (click)="removeLayer()"> <mat-icon>remove</mat-icon> </button> - + </div> <div class="break-1"></div> <div class="ns-col"> <mat-form-field appearance="fill"> <mat-label>Aktivaciona funkcija svih slojeva</mat-label> - - <mat-select [(ngModel)]="selectedActivation" (selectionChange)="changeAllActivation()" > + + <mat-select [(ngModel)]="selectedActivation" (selectionChange)="changeAllActivation()"> <mat-option *ngFor="let option of Object.keys(ActivationFunction); let optionName of Object.values(ActivationFunction)" [value]="option"> {{ optionName }} </mat-option> </mat-select> </mat-form-field> </div> - + <div class="ns-col"> <mat-form-field appearance="fill"> <mat-label>Broj Neurona svih slojeva</mat-label> @@ -136,7 +136,7 @@ </mat-select> </mat-form-field> </div> - + <div class="ns-col"> <mat-form-field appearance="fill"> <mat-label>Stopa regularizacije svih slojeva</mat-label> @@ -146,7 +146,7 @@ </mat-option> </mat-select> </mat-form-field> - </div> + </div> </div> @@ -177,7 +177,7 @@ <button class="btn-clear btn-icon" (click)="addNeuron(i)"> <mat-icon>add</mat-icon> </button> - <div class="col-2 text-center" >{{newModel.layers[i].neurons}}</div> + <div class="col-2 text-center">{{newModel.layers[i].neurons}}</div> <button class="btn-clear btn-icon" (click)="removeNeuron(i)"> <mat-icon>remove</mat-icon> </button> |