Merge branch 'max_dev' of Software_Engineering_I/greenvironment-frontend into master
commit
e8c38d14f9
@ -1,105 +1,107 @@
|
||||
<mat-toolbar color="primary">Profile</mat-toolbar>
|
||||
<div id="profile">
|
||||
<div id="profilecontainer" [hidden]="profileNotFound">
|
||||
<div id="profile-card-container">
|
||||
<mat-card class="mat-elevation-z8">
|
||||
<mat-card-header>
|
||||
<div mat-card-avatar class="profile-picture"></div>
|
||||
<mat-card-title>{{user.username}}</mat-card-title>
|
||||
<mat-card-subtitle>{{user.handle}}</mat-card-subtitle>
|
||||
</mat-card-header>
|
||||
<mat-card-content>
|
||||
<table id="profile-table">
|
||||
<tr>
|
||||
<div class="mat-header-cell">name: </div>
|
||||
<td>{{user.username}}</td>
|
||||
</tr>
|
||||
<mat-divider></mat-divider>
|
||||
<tr>
|
||||
<div class="mat-header-cell">handle: </div>
|
||||
<td>{{user.handle}}</td>
|
||||
</tr>
|
||||
<mat-divider></mat-divider>
|
||||
<tr>
|
||||
<div class="mat-header-cell">profileID: </div>
|
||||
<td>{{user.userID}}</td>
|
||||
</tr>
|
||||
<mat-divider></mat-divider>
|
||||
<tr>
|
||||
<div class="mat-header-cell">points: </div>
|
||||
<td>{{user.points}}</td>
|
||||
</tr>
|
||||
<mat-divider></mat-divider>
|
||||
<tr>
|
||||
<div class="mat-header-cell">level: </div>
|
||||
<td>{{user.level}}</td>
|
||||
</tr>
|
||||
<mat-divider></mat-divider>
|
||||
<tr>
|
||||
<div class="mat-header-cell">level name: </div>
|
||||
<td>{{rankname}}</td>
|
||||
</tr>
|
||||
</table>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
</div>
|
||||
<br>
|
||||
<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>
|
||||
<div id="profile-page">
|
||||
<mat-toolbar color="primary">Profile</mat-toolbar>
|
||||
<div id="profile">
|
||||
<div id="profilecontainer" [hidden]="profileNotFound">
|
||||
<div id="profile-card-container">
|
||||
<mat-card class="mat-elevation-z8">
|
||||
<mat-card-header>
|
||||
<div mat-card-avatar class="profile-picture"></div>
|
||||
<mat-card-title>{{user.username}}</mat-card-title>
|
||||
<mat-card-subtitle>{{user.handle}}</mat-card-subtitle>
|
||||
</mat-card-header>
|
||||
<mat-card-content>
|
||||
<table id="profile-table">
|
||||
<tr>
|
||||
<div class="mat-header-cell">name: </div>
|
||||
<td>{{user.username}}</td>
|
||||
</tr>
|
||||
<mat-divider></mat-divider>
|
||||
<tr>
|
||||
<div class="mat-header-cell">handle: </div>
|
||||
<td>{{user.handle}}</td>
|
||||
</tr>
|
||||
<mat-divider></mat-divider>
|
||||
<tr>
|
||||
<div class="mat-header-cell">profileID: </div>
|
||||
<td>{{user.userID}}</td>
|
||||
</tr>
|
||||
<mat-divider></mat-divider>
|
||||
<tr>
|
||||
<div class="mat-header-cell">points: </div>
|
||||
<td>{{user.points}}</td>
|
||||
</tr>
|
||||
<mat-divider></mat-divider>
|
||||
<tr>
|
||||
<div class="mat-header-cell">level: </div>
|
||||
<td>{{user.level}}</td>
|
||||
</tr>
|
||||
<mat-divider></mat-divider>
|
||||
<tr>
|
||||
<div class="mat-header-cell">level name: </div>
|
||||
<td>{{rankname}}</td>
|
||||
</tr>
|
||||
</table>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
</div>
|
||||
<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>
|
||||
<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>
|
||||
<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 -->
|
||||
<ng-container matColumnDef="name">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header> action </th>
|
||||
<td mat-cell *matCellDef="let action"> {{action.name}} </td>
|
||||
</ng-container>
|
||||
<!-- Name Column -->
|
||||
<ng-container matColumnDef="name">
|
||||
<th mat-header-cell *matHeaderCellDef mat-sort-header> action </th>
|
||||
<td mat-cell *matCellDef="let action"> {{action.name}} </td>
|
||||
</ng-container>
|
||||
|
||||
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
|
||||
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
|
||||
</table>
|
||||
<!--<table style="width:100%">
|
||||
<tr>
|
||||
<th>points </th>
|
||||
<th>action</th>
|
||||
</tr>
|
||||
<tr *ngFor= "let action of actionlist.actions">
|
||||
<td>{{action.points}}</td>
|
||||
<td>{{action.name}}</td>
|
||||
</tr>
|
||||
</table>-->
|
||||
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
|
||||
<tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
|
||||
</table>
|
||||
<!--<table style="width:100%">
|
||||
<tr>
|
||||
<th>points </th>
|
||||
<th>action</th>
|
||||
</tr>
|
||||
<tr *ngFor= "let action of actionlist.actions">
|
||||
<td>{{action.points}}</td>
|
||||
<td>{{action.name}}</td>
|
||||
</tr>
|
||||
</table>-->
|
||||
</div>
|
||||
<div id="profilecontainer" *ngIf="profileNotFound">
|
||||
<h1>Profile not found :(</h1>
|
||||
</div>
|
||||
<div id="profilecontainer" *ngIf="profileNotFound">
|
||||
<h1>Profile not found :(</h1>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -0,0 +1,76 @@
|
||||
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
||||
<!-- Created with Inkscape (http://www.inkscape.org/) -->
|
||||
|
||||
<svg
|
||||
xmlns:dc="http://purl.org/dc/elements/1.1/"
|
||||
xmlns:cc="http://creativecommons.org/ns#"
|
||||
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
|
||||
xmlns:svg="http://www.w3.org/2000/svg"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
|
||||
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
|
||||
width="64px"
|
||||
height="64px"
|
||||
viewBox="0 0 64 64"
|
||||
version="1.1"
|
||||
id="SVGRoot"
|
||||
inkscape:version="0.92.4 5da689c313, 2019-01-14"
|
||||
sodipodi:docname="gv-new-logo-white.svg">
|
||||
<defs
|
||||
id="defs3412" />
|
||||
<sodipodi:namedview
|
||||
id="base"
|
||||
pagecolor="#ffffff"
|
||||
bordercolor="#666666"
|
||||
borderopacity="1.0"
|
||||
inkscape:pageopacity="0.0"
|
||||
inkscape:pageshadow="2"
|
||||
inkscape:zoom="5.656854"
|
||||
inkscape:cx="-16.580479"
|
||||
inkscape:cy="40.712852"
|
||||
inkscape:document-units="px"
|
||||
inkscape:current-layer="layer2"
|
||||
showgrid="false"
|
||||
inkscape:window-width="1920"
|
||||
inkscape:window-height="1003"
|
||||
inkscape:window-x="0"
|
||||
inkscape:window-y="0"
|
||||
inkscape:window-maximized="1"
|
||||
inkscape:grid-bbox="true" />
|
||||
<metadata
|
||||
id="metadata3415">
|
||||
<rdf:RDF>
|
||||
<cc:Work
|
||||
rdf:about="">
|
||||
<dc:format>image/svg+xml</dc:format>
|
||||
<dc:type
|
||||
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
|
||||
<dc:title />
|
||||
</cc:Work>
|
||||
</rdf:RDF>
|
||||
</metadata>
|
||||
<g
|
||||
inkscape:groupmode="layer"
|
||||
id="layer2"
|
||||
inkscape:label="Layer 2"
|
||||
style="display:inline">
|
||||
<path
|
||||
style="fill:none;stroke:#ffffff;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
|
||||
d="m 59.638425,10.982918 c -2.598034,1.65974 -5.164767,1.536797 -6.79245,1.598268 -1.627684,0.06147 -7.89147,-0.248912 -10.548644,-0.307359 -2.031158,-0.04467 -10.408921,-0.634292 -18.029729,3.227272 -6.189793,3.136452 -10.030686,7.78418 -11.299883,11.09567 -1.095556,2.858442 -1.721588,5.317315 -1.095556,9.896969 0.334798,2.449172 0.916715,4.631314 0.829032,5.615672 -0.07744,0.869314 0.04741,1.638006 -2.331509,4.035408 -2.3789231,2.397403 -7.5630585,6.702992 -7.5630585,6.702992"
|
||||
id="path3986"
|
||||
inkscape:connector-curvature="0"
|
||||
sodipodi:nodetypes="csssssssc" />
|
||||
<path
|
||||
style="fill:none;stroke:#ffffff;stroke-width:2.81999993;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
|
||||
d="m 17.040936,45.75125 c 0,0 5.71124,1.10058 9.863991,0.923511 4.152753,-0.177069 10.503177,-1.963537 14.640251,-4.074381 2.654809,-1.354554 8.010685,-4.452479 10.623857,-9.671077 1.545586,-3.086589 2.392221,-6.933871 2.615983,-8.836099 0.374688,-3.185266 0.215574,-5.492636 0.858958,-6.968217"
|
||||
id="path3988"
|
||||
inkscape:connector-curvature="0"
|
||||
sodipodi:nodetypes="cssssc" />
|
||||
<path
|
||||
style="fill:none;stroke:#ffffff;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1"
|
||||
d="m 16.515165,41.68934 c 0,0 3.942744,-4.483925 8.75,-9 3.732038,-3.505984 5.757466,-5.519577 10.967068,-8.580806 3.85598,-2.265823 12.426015,-6.277728 15.87316,-7.736136"
|
||||
id="path3990"
|
||||
inkscape:connector-curvature="0"
|
||||
sodipodi:nodetypes="cssc" />
|
||||
</g>
|
||||
</svg>
|
After Width: | Height: | Size: 3.4 KiB |
@ -0,0 +1,4 @@
|
||||
declare module '*.svg' {
|
||||
const svg: string;
|
||||
export default svg;
|
||||
}
|
Loading…
Reference in New Issue