Browse Source

fix(admin-ui): Make dropdowns scrollable

Fixes #824
Michael Bromley 4 years ago
parent
commit
e887a2bc2e

+ 5 - 0
packages/admin-ui/src/lib/core/src/shared/components/dropdown/dropdown-menu.component.scss

@@ -2,9 +2,14 @@
     background-color: hotpink;
 }
 
+.dropdown-content-wrapper {
+}
+
 .dropdown.open > .dropdown-menu {
     position: relative;
     top: 0;
+    height: 100%;
+    overflow-y: auto;
 }
 
 :host {

+ 4 - 1
packages/admin-ui/src/lib/core/src/shared/components/dropdown/dropdown-menu.component.ts

@@ -42,7 +42,9 @@ export type DropdownPosition = 'top-left' | 'top-right' | 'bottom-left' | 'botto
         <ng-template #menu>
             <div class="dropdown open">
                 <div class="dropdown-menu">
-                    <ng-content></ng-content>
+                    <div class="dropdown-content-wrapper">
+                        <ng-content></ng-content>
+                    </div>
                 </div>
             </div>
         </ng-template>
@@ -78,6 +80,7 @@ export class DropdownMenuComponent implements AfterViewInit, OnInit, OnDestroy {
             hasBackdrop: true,
             backdropClass: 'clear-backdrop',
             positionStrategy: this.getPositionStrategy(),
+            maxHeight: '70vh',
         });
         this.menuPortal = new TemplatePortal(this.menuTemplate, this.viewContainerRef);
         this.backdropClickSub = this.overlayRef.backdropClick().subscribe(() => {