From 64545a834b881d9b49d84f99119070f356b93e24 Mon Sep 17 00:00:00 2001 From: Chocobozzz <me@florianbigard.com> Date: Fri, 26 Apr 2019 11:39:03 +0200 Subject: Fix top menu dropdown --- client/src/app/shared/menu/top-menu-dropdown.component.html | 2 +- client/src/app/shared/menu/top-menu-dropdown.component.ts | 13 ++++++++++++- 2 files changed, 13 insertions(+), 2 deletions(-) (limited to 'client/src') diff --git a/client/src/app/shared/menu/top-menu-dropdown.component.html b/client/src/app/shared/menu/top-menu-dropdown.component.html index 54a8f9e80..35511ee62 100644 --- a/client/src/app/shared/menu/top-menu-dropdown.component.html +++ b/client/src/app/shared/menu/top-menu-dropdown.component.html @@ -3,7 +3,7 @@ <a *ngIf="menuEntry.routerLink" [routerLink]="menuEntry.routerLink" routerLinkActive="active" class="title-page">{{ menuEntry.label }}</a> - <div *ngIf="!menuEntry.routerLink" ngbDropdown container="body" class="parent-entry" #dropdown="ngbDropdown" (mouseleave)="closeDropdownIfHovered(dropdown)"> + <div *ngIf="!menuEntry.routerLink" ngbDropdown [container]="container" class="parent-entry" #dropdown="ngbDropdown" (mouseleave)="closeDropdownIfHovered(dropdown)"> <span (mouseenter)="openDropdownOnHover(dropdown)" [ngClass]="{ active: !!suffixLabels[menuEntry.label] }" ngbDropdownAnchor (click)="dropdownAnchorClicked(dropdown)" role="button" class="title-page" diff --git a/client/src/app/shared/menu/top-menu-dropdown.component.ts b/client/src/app/shared/menu/top-menu-dropdown.component.ts index e951ea236..5ccdafb54 100644 --- a/client/src/app/shared/menu/top-menu-dropdown.component.ts +++ b/client/src/app/shared/menu/top-menu-dropdown.component.ts @@ -4,6 +4,7 @@ import { NavigationEnd, Router } from '@angular/router' import { Subscription } from 'rxjs' import { NgbDropdown } from '@ng-bootstrap/ng-bootstrap' import { GlobalIconName } from '@app/shared/images/global-icon.component' +import { ScreenService } from '@app/shared/misc/screen.service' export type TopMenuDropdownParam = { label: string @@ -27,11 +28,15 @@ export class TopMenuDropdownComponent implements OnInit, OnDestroy { suffixLabels: { [ parentLabel: string ]: string } hasIcons = false + container: undefined | 'body' = undefined private openedOnHover = false private routeSub: Subscription - constructor (private router: Router) {} + constructor ( + private router: Router, + private screen: ScreenService + ) {} ngOnInit () { this.updateChildLabels(window.location.pathname) @@ -43,6 +48,12 @@ export class TopMenuDropdownComponent implements OnInit, OnDestroy { this.hasIcons = this.menuEntries.some( e => e.children && e.children.some(c => !!c.iconName) ) + + // FIXME: We have to set body for the container to avoid because of scroll overflow on mobile view + // But this break our hovering system + if (this.screen.isInMobileView()) { + this.container = 'body' + } } ngOnDestroy () { -- cgit v1.2.3