src/app/navigation/user-profile/user-profile.component.ts
| selector | app-user-profile |
| styleUrls | ./user-profile.component.css |
| templateUrl | ./user-profile.component.html |
Methods |
constructor()
|
| ngOnInit |
ngOnInit()
|
|
Returns :
void
|
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-user-profile',
templateUrl: './user-profile.component.html',
styleUrls: ['./user-profile.component.css']
})
export class UserProfileComponent implements OnInit {
constructor() { }
ngOnInit() {
}
}
<div class="logo-ctn">
<i class="material-icons profile-icon important-color">
account_circle
</i>
</div>
<div class="user">ajrambo</div>
<button mat-menu-item>
<mat-icon>
settings</mat-icon> Settings
</button>
<button mat-menu-item [routerLink]="['/login']">
<mat-icon>exit_to_app</mat-icon> Sign Out
</button>
./user-profile.component.css
.logo-ctn {
text-align: center;
padding: 5px;
}
.profile-icon {
font-size: 60px;
}
.user {
text-align: center;
font-size: 14px;
padding: 0px 10px 10px 10px;
}
button {
border-top: 1px solid #ccc;
}