toolbar is really fixed now
Max
5 years ago
parent
7f384ec926
commit
6b260594e1
@ -1,105 +1,107 @@
|
|||||||
<mat-toolbar color="primary">Profile</mat-toolbar>
|
<div id="profile-page">
|
||||||
<div id="profile">
|
<mat-toolbar color="primary">Profile</mat-toolbar>
|
||||||
<div id="profilecontainer" [hidden]="profileNotFound">
|
<div id="profile">
|
||||||
<div id="profile-card-container">
|
<div id="profilecontainer" [hidden]="profileNotFound">
|
||||||
<mat-card class="mat-elevation-z8">
|
<div id="profile-card-container">
|
||||||
<mat-card-header>
|
<mat-card class="mat-elevation-z8">
|
||||||
<div mat-card-avatar class="profile-picture"></div>
|
<mat-card-header>
|
||||||
<mat-card-title>{{user.username}}</mat-card-title>
|
<div mat-card-avatar class="profile-picture"></div>
|
||||||
<mat-card-subtitle>{{user.handle}}</mat-card-subtitle>
|
<mat-card-title>{{user.username}}</mat-card-title>
|
||||||
</mat-card-header>
|
<mat-card-subtitle>{{user.handle}}</mat-card-subtitle>
|
||||||
<mat-card-content>
|
</mat-card-header>
|
||||||
<table id="profile-table">
|
<mat-card-content>
|
||||||
<tr>
|
<table id="profile-table">
|
||||||
<div class="mat-header-cell">name: </div>
|
<tr>
|
||||||
<td>{{user.username}}</td>
|
<div class="mat-header-cell">name: </div>
|
||||||
</tr>
|
<td>{{user.username}}</td>
|
||||||
<mat-divider></mat-divider>
|
</tr>
|
||||||
<tr>
|
<mat-divider></mat-divider>
|
||||||
<div class="mat-header-cell">handle: </div>
|
<tr>
|
||||||
<td>{{user.handle}}</td>
|
<div class="mat-header-cell">handle: </div>
|
||||||
</tr>
|
<td>{{user.handle}}</td>
|
||||||
<mat-divider></mat-divider>
|
</tr>
|
||||||
<tr>
|
<mat-divider></mat-divider>
|
||||||
<div class="mat-header-cell">profileID: </div>
|
<tr>
|
||||||
<td>{{user.userID}}</td>
|
<div class="mat-header-cell">profileID: </div>
|
||||||
</tr>
|
<td>{{user.userID}}</td>
|
||||||
<mat-divider></mat-divider>
|
</tr>
|
||||||
<tr>
|
<mat-divider></mat-divider>
|
||||||
<div class="mat-header-cell">points: </div>
|
<tr>
|
||||||
<td>{{user.points}}</td>
|
<div class="mat-header-cell">points: </div>
|
||||||
</tr>
|
<td>{{user.points}}</td>
|
||||||
<mat-divider></mat-divider>
|
</tr>
|
||||||
<tr>
|
<mat-divider></mat-divider>
|
||||||
<div class="mat-header-cell">level: </div>
|
<tr>
|
||||||
<td>{{user.level}}</td>
|
<div class="mat-header-cell">level: </div>
|
||||||
</tr>
|
<td>{{user.level}}</td>
|
||||||
<mat-divider></mat-divider>
|
</tr>
|
||||||
<tr>
|
<mat-divider></mat-divider>
|
||||||
<div class="mat-header-cell">level name: </div>
|
<tr>
|
||||||
<td>{{rankname}}</td>
|
<div class="mat-header-cell">level name: </div>
|
||||||
</tr>
|
<td>{{rankname}}</td>
|
||||||
</table>
|
</tr>
|
||||||
</mat-card-content>
|
</table>
|
||||||
</mat-card>
|
</mat-card-content>
|
||||||
</div>
|
</mat-card>
|
||||||
<br>
|
</div>
|
||||||
<h1>What does the level mean?</h1>
|
|
||||||
<p>There are different levels you can reach through green behaviour.
|
|
||||||
Collect 100 points to level up! The levels are called:
|
|
||||||
</p>
|
|
||||||
<table mat-table [dataSource]="levelSource" class="mat-elevation-z8">
|
|
||||||
<ng-container matColumnDef="level">
|
|
||||||
<th mat-header-cell *matHeaderCellDef> level </th>
|
|
||||||
<td mat-cell *matCellDef="let level"> {{level.level}} </td>
|
|
||||||
</ng-container>
|
|
||||||
<ng-container matColumnDef="name">
|
|
||||||
<th mat-header-cell *matHeaderCellDef> level name </th>
|
|
||||||
<td mat-cell *matCellDef="let level"> {{level.name}} </td>
|
|
||||||
</ng-container>
|
|
||||||
<tr mat-header-row *matHeaderRowDef="displayedLevelColumns"></tr>
|
|
||||||
<tr mat-row *matRowDef="let row; columns: displayedLevelColumns;"></tr>
|
|
||||||
</table>
|
|
||||||
<br>
|
<br>
|
||||||
<h1>How to level up?</h1>
|
<h1>What does the level mean?</h1>
|
||||||
<p>There is an always growing list of things you can do,
|
<p>There are different levels you can reach through green behaviour.
|
||||||
to support your environment
|
Collect 100 points to level up! The levels are called:
|
||||||
and earn points to level up at the same time.
|
</p>
|
||||||
You can get a different amount of points
|
<table mat-table [dataSource]="levelSource" class="mat-elevation-z8">
|
||||||
for differnet actions you can see in the list below:
|
<ng-container matColumnDef="level">
|
||||||
</p>
|
<th mat-header-cell *matHeaderCellDef> level </th>
|
||||||
<table mat-table [dataSource]="dataSource" matSort class="mat-elevation-z8">
|
<td mat-cell *matCellDef="let level"> {{level.level}} </td>
|
||||||
<!--- Note that these columns can be defined in any order.
|
</ng-container>
|
||||||
The actual rendered columns are set as a property on the row definition" -->
|
<ng-container matColumnDef="name">
|
||||||
|
<th mat-header-cell *matHeaderCellDef> level name </th>
|
||||||
<!-- Position Column -->
|
<td mat-cell *matCellDef="let level"> {{level.name}} </td>
|
||||||
<ng-container matColumnDef="points">
|
</ng-container>
|
||||||
<th mat-header-cell *matHeaderCellDef mat-sort-header> points </th>
|
<tr mat-header-row *matHeaderRowDef="displayedLevelColumns"></tr>
|
||||||
<td mat-cell *matCellDef="let action"> {{action.points}} </td>
|
<tr mat-row *matRowDef="let row; columns: displayedLevelColumns;"></tr>
|
||||||
</ng-container>
|
</table>
|
||||||
|
<br>
|
||||||
|
<h1>How to level up?</h1>
|
||||||
|
<p>There is an always growing list of things you can do,
|
||||||
|
to support your environment
|
||||||
|
and earn points to level up at the same time.
|
||||||
|
You can get a different amount of points
|
||||||
|
for differnet actions you can see in the list below:
|
||||||
|
</p>
|
||||||
|
<table mat-table [dataSource]="dataSource" matSort class="mat-elevation-z8">
|
||||||
|
<!--- Note that these columns can be defined in any order.
|
||||||
|
The actual rendered columns are set as a property on the row definition" -->
|
||||||
|
|
||||||
|
<!-- Position Column -->
|
||||||
|
<ng-container matColumnDef="points">
|
||||||
|
<th mat-header-cell *matHeaderCellDef mat-sort-header> points </th>
|
||||||
|
<td mat-cell *matCellDef="let action"> {{action.points}} </td>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
<!-- Name Column -->
|
<!-- Name Column -->
|
||||||
<ng-container matColumnDef="name">
|
<ng-container matColumnDef="name">
|
||||||
<th mat-header-cell *matHeaderCellDef mat-sort-header> action </th>
|
<th mat-header-cell *matHeaderCellDef mat-sort-header> action </th>
|
||||||
<td mat-cell *matCellDef="let action"> {{action.name}} </td>
|
<td mat-cell *matCellDef="let action"> {{action.name}} </td>
|
||||||
</ng-container>
|
</ng-container>
|
||||||
|
|
||||||
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
|
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
|
||||||
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
|
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
|
||||||
</table>
|
</table>
|
||||||
<!--<table style="width:100%">
|
<!--<table style="width:100%">
|
||||||
<tr>
|
<tr>
|
||||||
<th>points </th>
|
<th>points </th>
|
||||||
<th>action</th>
|
<th>action</th>
|
||||||
</tr>
|
</tr>
|
||||||
<tr *ngFor= "let action of actionlist.actions">
|
<tr *ngFor= "let action of actionlist.actions">
|
||||||
<td>{{action.points}}</td>
|
<td>{{action.points}}</td>
|
||||||
<td>{{action.name}}</td>
|
<td>{{action.name}}</td>
|
||||||
</tr>
|
</tr>
|
||||||
</table>-->
|
</table>-->
|
||||||
|
</div>
|
||||||
|
<div id="profilecontainer" *ngIf="profileNotFound">
|
||||||
|
<h1>Profile not found :(</h1>
|
||||||
</div>
|
</div>
|
||||||
<div id="profilecontainer" *ngIf="profileNotFound">
|
|
||||||
<h1>Profile not found :(</h1>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
Loading…
Reference in New Issue