diff options
Diffstat (limited to '')
| -rw-r--r-- | ufund-ui/src/app/components/dashboard/dashboard.component.html | 30 |
1 files changed, 21 insertions, 9 deletions
diff --git a/ufund-ui/src/app/components/dashboard/dashboard.component.html b/ufund-ui/src/app/components/dashboard/dashboard.component.html index 074ca76..233096a 100644 --- a/ufund-ui/src/app/components/dashboard/dashboard.component.html +++ b/ufund-ui/src/app/components/dashboard/dashboard.component.html @@ -1,15 +1,27 @@ <div id="box"> @if ((authService.getCurrentUserSubject() | async)?.type === userType.MANAGER) { <h1>Admin Dashboard</h1> - <span>_ Registered users</span> - <span *ngIf="count"> {{count | async}} </span> - <span>_ Fulfilled needs</span> - <app-mini-need-list [needList]="fulfilledNeeds.getValue()" label="Fulfilled needs"> </app-mini-need-list> - <span>_ Most fulfilled needs</span> - <app-mini-need-list [needList]="mostFulfilledNeeds.getValue()" label="Most fulfilled"> </app-mini-need-list> - <span>_ Total monetary contributions</span> - <span *ngIf="totalDonations">${{totalDonations | async}} </span> - <span>_ </span> + <div id="stats"> + <div class="card"> + <span>Registered users</span> + <h1 class="content" *ngIf="count"> {{count | async}} </h1> + </div> + + <div class="card"> + <span>Total monetary contributions</span> + <h1 class="content" *ngIf="totalDonations"> ${{totalDonations | async}} </h1> + </div> + </div> + + <div class="listCard"> + <span>Fulfilled needs</span> + <app-mini-need-list [needList]="fulfilledNeeds.getValue()" label="Fulfilled needs"> </app-mini-need-list> + </div> + <div class="listCard"> + <span>Most fulfilled needs</span> + <app-mini-need-list [needList]="mostFulfilledNeeds.getValue()" label="Most fulfilled"> </app-mini-need-list> + </div> + } @else { <h1>Unauthorized</h1> <span>This page requires you to be logged in as an admin! <a routerLink="/login">Log In</a></span> |