[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"> <ng-container *ngFor="let link of links">
<a appNestedMenuPosition mat-list-item #appMenuTrigger *ngIf="link.children" [attr.data-automation-id]="link.title | translate" <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}"> [matMenuTriggerData]="{links: link.children}">
<mat-icon matListIcon class="adf-sidenav-menu-icon">{{link.icon}}</mat-icon> <mat-icon matListIcon class="adf-sidenav-menu-icon">{{link.icon}}</mat-icon>

View File

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

View File

@@ -41,10 +41,12 @@ export class AboutComponent implements OnInit {
extensions$: Observable<ExtensionRef[]>; extensions$: Observable<ExtensionRef[]>;
/** Commit corresponding to the version of ADF to be used. */ /** Commit corresponding to the version of ADF to be used. */
@Input() githubUrlCommitAlpha = 'https://github.com/Alfresco/alfresco-ng2-components/commits/'; @Input()
githubUrlCommitAlpha = 'https://github.com/Alfresco/alfresco-ng2-components/commits/';
/** Toggles showing/hiding of extensions block. */ /** Toggles showing/hiding of extensions block. */
@Input() showExtensions = true; @Input()
showExtensions = true;
/** Regular expression for filtering dependencies packages. */ /** Regular expression for filtering dependencies packages. */
@Input() regexp = '^(@alfresco)'; @Input() regexp = '^(@alfresco)';