WIP: Responsive header menu 2
This commit is contained in:
parent
0c10e46d1a
commit
d0c485c0e9
|
@ -12,6 +12,5 @@ export class AppComponent {
|
||||||
user?: Player;
|
user?: Player;
|
||||||
|
|
||||||
ngOnInit() {
|
ngOnInit() {
|
||||||
// Load player data
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -14,5 +14,5 @@
|
||||||
<p>{{getUserName()}}</p>
|
<p>{{getUserName()}}</p>
|
||||||
<img src="assets/images/user.png" alt="User Icon" (click)="openProfile()">
|
<img src="assets/images/user.png" alt="User Icon" (click)="openProfile()">
|
||||||
</span>
|
</span>
|
||||||
<app-profile (showProfilePopoverChange)="closeProfile()" *ngIf="showProfilePopover" [user]="this.user"></app-profile>
|
<app-profile (showProfilePopOverChange)="closeProfile()" *ngIf="showProfilePopOver" [user]="this.user"></app-profile>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -9,7 +9,7 @@ import {StorageService} from '../../services/storage.service';
|
||||||
})
|
})
|
||||||
export class HeaderComponent implements OnInit {
|
export class HeaderComponent implements OnInit {
|
||||||
|
|
||||||
showProfilePopover: boolean = false;
|
showProfilePopOver: boolean = false;
|
||||||
user?: User;
|
user?: User;
|
||||||
|
|
||||||
constructor() {
|
constructor() {
|
||||||
|
@ -20,11 +20,11 @@ export class HeaderComponent implements OnInit {
|
||||||
}
|
}
|
||||||
|
|
||||||
openProfile(): void {
|
openProfile(): void {
|
||||||
this.showProfilePopover = true;
|
this.showProfilePopOver = true;
|
||||||
}
|
}
|
||||||
|
|
||||||
closeProfile(): void {
|
closeProfile(): void {
|
||||||
this.showProfilePopover = false;
|
this.showProfilePopOver = false;
|
||||||
}
|
}
|
||||||
|
|
||||||
getUserName(): string {
|
getUserName(): string {
|
||||||
|
|
|
@ -10,7 +10,7 @@ export class ProfileComponent implements OnInit {
|
||||||
|
|
||||||
initialClick = true;
|
initialClick = true;
|
||||||
@Input() user?: User;
|
@Input() user?: User;
|
||||||
@Output() showProfilePopoverChange = new EventEmitter<boolean>();
|
@Output() showProfilePopOverChange = new EventEmitter<boolean>();
|
||||||
|
|
||||||
constructor(private eRef: ElementRef) {
|
constructor(private eRef: ElementRef) {
|
||||||
}
|
}
|
||||||
|
@ -31,7 +31,7 @@ export class ProfileComponent implements OnInit {
|
||||||
}
|
}
|
||||||
|
|
||||||
if (!this.eRef.nativeElement.contains(event.target)) {
|
if (!this.eRef.nativeElement.contains(event.target)) {
|
||||||
this.showProfilePopoverChange.emit(false);
|
this.showProfilePopOverChange.emit(false);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue
Block a user