update styling

2021-03-21 20:29:20 +01:00
parent 1cf8175907
commit 7a9e2395ef
3 changed files with 42 additions and 9 deletions
@@ -1,11 +1,20 @@
-<button (click)="login()">Login</button>
+<button mat-raised-button (click)="gotoBackend()">Call Backend</button>
+<span id="loginBtnWrapper">
+  <button *ngIf="!parsedToken"
+          mat-raised-button color="primary"
+          (click)="login()">Login</button>
+</span>
 <br>
-<button (click)="logout()">Logout</button>
-<br>
-<button (click)="gotoBackend()">Call Backend</button>
+<div *ngIf="parsedToken" id="userComp">
+  <span style="display: inline-grid">
+    <img alt="Profile picture" [src]="parsedToken.picture" style="height:100px;">
+    <span style="margin: auto">{{parsedToken.given_name}} {{parsedToken.family_name}}</span>
+  </span>
+  <button mat-raised-button color="warn" id="logoutBtn"
+          (click)="logout()">Logout</button>
+
+</div>
+
 <br>
 <p *ngIf="errorMessage">Error on login: {{errorMessage}}</p>
-<div *ngIf="parsedToken">
-  {{parsedToken.given_name}} {{parsedToken.family_name}}
-  <img alt="Profile picture" [src]="parsedToken.picture" style="height:100px;">
-</div>
+