aboutsummaryrefslogtreecommitdiff
path: root/frontend/src/app/_elements
diff options
context:
space:
mode:
authorDanijel Anđelković <adanijel99@gmail.com>2022-04-23 18:59:27 +0200
committerDanijel Anđelković <adanijel99@gmail.com>2022-04-23 18:59:27 +0200
commitc71ced076e4e0b713d428eca304f541f02c8ee6f (patch)
tree8d5a40d1d08355cfe1fa51d42fa0105949d845f4 /frontend/src/app/_elements
parent2cf5c882b130b00ea906cfaafc7fef2e4eeefa6c (diff)
Doterao stil za playlist komponentu, i tabelu podataka. Dodao arhivu u navbar i obrisao neke stare rute.
Diffstat (limited to 'frontend/src/app/_elements')
-rw-r--r--frontend/src/app/_elements/datatable/datatable.component.html34
-rw-r--r--frontend/src/app/_elements/navbar/navbar.component.html6
-rw-r--r--frontend/src/app/_elements/playlist/playlist.component.css10
-rw-r--r--frontend/src/app/_elements/playlist/playlist.component.html10
4 files changed, 27 insertions, 33 deletions
diff --git a/frontend/src/app/_elements/datatable/datatable.component.html b/frontend/src/app/_elements/datatable/datatable.component.html
index 8db62aff..fe359db0 100644
--- a/frontend/src/app/_elements/datatable/datatable.component.html
+++ b/frontend/src/app/_elements/datatable/datatable.component.html
@@ -1,18 +1,16 @@
<div *ngIf="tableData.hasInput">
- <div>
- <div *ngIf="!tableData.loaded" backgroundColor="secondary" style="width: 100%; height: 100%;"
- class="d-flex justify-content-center align-items-center">
+ <div class="text-white">
+ <div *ngIf="!tableData.loaded" style="width: 100%; height: 100%;" class="d-flex justify-content-center align-items-center">
<app-loading></app-loading>
</div>
<div *ngIf="tableData.loaded && tableData.data">
- <div id="info" *ngIf="tableData.data.length > 0 && tableData.data[0].length > 0"
- class="d-flex flex-row justify-content-center align-items-center">
+ <div id="info" *ngIf="tableData.data.length > 0 && tableData.data[0].length > 0" class="d-flex flex-row justify-content-center align-items-center">
<div class="fs-5 mb-3">
Tabela {{tableData.numCols}}x{{tableData.numRows}}
</div>
</div>
- <div class="table-responsive" style="overflow: auto; border-radius: 5px;">
- <table *ngIf="tableData.data.length > 0 && tableData.hasHeader && tableData.data[0].length > 0" class="table table-bordered table-light">
+ <div style="border-radius: 5px; overflow-x: auto; overflow-y: hidden;">
+ <table *ngIf="tableData.data.length && tableData.data[0].length > 0" class="table table-responsive table-sm text-offwhite row-height">
<thead>
<tr>
<th *ngFor="let item of tableData.data[0]; let i = index">{{item}}</th>
@@ -22,21 +20,17 @@
<tr *ngFor="let row of tableData.data | slice:1">
<td *ngFor="let col of row">{{col}}</td>
</tr>
- <tr>
- <td colspan="100" class="text-lg-center fs-6">+ {{tableData.numRows - 11}} redova...</td>
- </tr>
- </tbody>
- </table>
- <table *ngIf="tableData.data.length > 0 && !tableData.hasHeader && tableData.data[0].length > 0" class="table table-bordered table-light">
- <tbody>
- <tr *ngFor="let row of tableData.data">
- <td *ngFor="let col of row">{{col}}</td>
- </tr>
- <tr>
- <td colspan="100" class="text-lg-center fs-6">+ {{tableData.numRows - 10}} redova...</td>
- </tr>
</tbody>
</table>
+ <tfoot>
+ <tr>
+ <td colspan="100" class="fs-6">
+ <div class="footer-center">
+ <div>+ {{tableData.numRows - 11}} redova...</div>
+ </div>
+ </td>
+ </tr>
+ </tfoot>
</div>
</div>
</div>
diff --git a/frontend/src/app/_elements/navbar/navbar.component.html b/frontend/src/app/_elements/navbar/navbar.component.html
index 41105405..5390136d 100644
--- a/frontend/src/app/_elements/navbar/navbar.component.html
+++ b/frontend/src/app/_elements/navbar/navbar.component.html
@@ -9,9 +9,7 @@
<li><a routerLink="" class="nav-link px-2" [class]="(currentUrl === '') ? 'text-secondary' : 'text-white'">Početna</a></li>
<li><a routerLink="experiment" class="nav-link px-2" [class]="(currentUrl === '/experiment') ? 'text-secondary' : 'text-white'">Napravi eksperiment</a>
</li>
- <li><a routerLink="training" class="nav-link px-2" [class]="(currentUrl === '/training') ? 'text-secondary' : 'text-white'">Treniraj model</a>
- </li>
- <li><a routerLink="my-predictors" class="nav-link px-2" [class]="(currentUrl === '/my-predictors') ? 'text-secondary' : 'text-white' + (shared.loggedIn) ? '' : 'disabled'">Predvidi</a>
+ <li><a routerLink="archive" class="nav-link px-2" [class]="(currentUrl === '/archive') ? 'text-secondary' : 'text-white'">Arhiva</a>
</li>
</ul>
@@ -20,8 +18,6 @@
<img [src]="'/assets/profilePictures/'+ shared.photoId +'.png'" alt="mdo" width="32" height="32" class="rounded-circle">
</a>
<ul class="dropdown-menu text-small" aria-labelledby="dropdownUser1" style="position: absolute; inset: 0px 0px auto auto; margin: 0px; transform: translate(0px, 34px);" data-popper-placement="bottom-end">
- <li><a class="dropdown-item" routerLink="add-model">Nov model...</a></li>
- <li><a class="dropdown-item" routerLink="settings">Podešavanja</a></li>
<li><a class="dropdown-item" routerLink="profile">Moj profil</a></li>
<li>
<hr class="dropdown-divider">
diff --git a/frontend/src/app/_elements/playlist/playlist.component.css b/frontend/src/app/_elements/playlist/playlist.component.css
index 7ce320d9..83448e51 100644
--- a/frontend/src/app/_elements/playlist/playlist.component.css
+++ b/frontend/src/app/_elements/playlist/playlist.component.css
@@ -13,7 +13,7 @@
.ns-cards {
position: relative;
width: 300%;
- height: 36rem;
+ height: 26rem;
margin-bottom: 20px;
}
@@ -28,6 +28,10 @@
cursor: pointer;
}
+.ns-card:hover {
+ opacity: 1 !important;
+}
+
input[type=radio] {
display: none;
}
@@ -36,7 +40,7 @@ input[type=radio] {
#item-2:checked~.ns-cards #view-item-1,
#item-3:checked~.ns-cards #view-item-2 {
transform: translatex(-40%) scale(0.8);
- opacity: 0.4;
+ opacity: 0.5;
z-index: 0;
}
@@ -44,7 +48,7 @@ input[type=radio] {
#item-2:checked~.ns-cards #view-item-3,
#item-3:checked~.ns-cards #view-item-1 {
transform: translatex(40%) scale(0.8);
- opacity: 0.4;
+ opacity: 0.5;
z-index: 0;
}
diff --git a/frontend/src/app/_elements/playlist/playlist.component.html b/frontend/src/app/_elements/playlist/playlist.component.html
index fdb426ed..97ebe6a5 100644
--- a/frontend/src/app/_elements/playlist/playlist.component.html
+++ b/frontend/src/app/_elements/playlist/playlist.component.html
@@ -3,17 +3,17 @@
<input type="radio" name="slider" id="item-2" value="1" [(ngModel)]="selectedId">
<input type="radio" name="slider" id="item-3" value="2" [(ngModel)]="selectedId">
<div class="ns-cards">
- <label class="ns-card bg-light overflow-auto" for="item-1" id="view-item-1">
+ <label class="ns-card ns-bg-dark-100 overflow-x-auto overflow-y-none" for="item-1" id="view-item-1">
<app-datatable [tableData]="tableDatas[0]"></app-datatable>
</label>
- <label class="ns-card bg-light overflow-auto" for="item-2" id="view-item-2">
+ <label class="ns-card ns-bg-dark-100 overflow-x-auto overflow-y-none" for="item-2" id="view-item-2">
<app-datatable [tableData]="tableDatas[1]"></app-datatable>
</label>
- <label class="ns-card bg-light overflow-auto" for="item-3" id="view-item-3">
+ <label class="ns-card ns-bg-dark-100 overflow-x-auto overflow-y-none" for="item-3" id="view-item-3">
<app-datatable [tableData]="tableDatas[2]"></app-datatable>
</label>
</div>
- <div class="ns-infobox">
- <app-item-dataset [dataset]="datasets[getIndex(selectedId)]"></app-item-dataset>
+ <div class="ns-infobox text-offwhite">
+ <h2>{{datasets[getIndex(selectedId)].name}}</h2>
</div>
</div> \ No newline at end of file