[ADF-4233] - fixed nested menu layout for minimized sidebar menu (#4459)

* [ADF-4233] - fix layout when side menu is minimized

* [ADF-4233] - lint

* [ADF-4233] - fixed nested menu layout for minimized sidebar menu
This commit is contained in:
Silviu Popa
2019-03-20 12:31:07 +02:00
committed by Eugenio Romano
parent bfc4205522
commit 997c53b47b
3 changed files with 14 additions and 7 deletions

View File

@@ -35,7 +35,7 @@
<ng-container *ngFor="let link of links">
<a appNestedMenuPosition mat-list-item #appMenuTrigger *ngIf="link.children" [attr.data-automation-id]="link.title | translate"
class="adf-sidenav-link" [matMenuTriggerFor]="nestedMenu"
class="adf-sidenav-link" [matMenuTriggerFor]="nestedMenu" [menuMinimized]="isMenuMinimized()"
[matMenuTriggerData]="{links: link.children}">
<mat-icon matListIcon class="adf-sidenav-menu-icon">{{link.icon}}</mat-icon>

View File

@@ -15,13 +15,16 @@
* limitations under the License.
*/
import { Directive, HostListener } from '@angular/core';
import { Directive, HostListener, Input } from '@angular/core';
@Directive({
selector: '[appNestedMenuPosition]'
})
export class NestedMenuPositionDirective {
@Input()
menuMinimized: string;
nestedMenuLeftPadding: string = '220px';
@HostListener('click', ['$event'])
@@ -30,9 +33,11 @@ export class NestedMenuPositionDirective {
let overlayContainer = (document.querySelector('.cdk-overlay-connected-position-bounding-box') as HTMLElement);
(document.querySelector('.cdk-overlay-pane') as HTMLElement).style.width = '100%';
setTimeout(() => {
overlayContainer.style.left = this.nestedMenuLeftPadding;
});
if (!this.menuMinimized) {
setTimeout(() => {
overlayContainer.style.left = this.nestedMenuLeftPadding;
});
}
}
}