diff --git a/modules/ui/src/app/pages/devices/components/device-qualification-from/device-qualification-from.component.scss b/modules/ui/src/app/pages/devices/components/device-qualification-from/device-qualification-from.component.scss index da55327a8..9a5231a29 100644 --- a/modules/ui/src/app/pages/devices/components/device-qualification-from/device-qualification-from.component.scss +++ b/modules/ui/src/app/pages/devices/components/device-qualification-from/device-qualification-from.component.scss @@ -18,7 +18,6 @@ @import 'src/theming/variables'; $form-min-width: 732px; -$form-height: 993px; :host { container-type: size; diff --git a/modules/ui/src/app/pages/devices/components/device-qualification-from/device-qualification-from.component.ts b/modules/ui/src/app/pages/devices/components/device-qualification-from/device-qualification-from.component.ts index 00bddbf4f..fd14688f7 100644 --- a/modules/ui/src/app/pages/devices/components/device-qualification-from/device-qualification-from.component.ts +++ b/modules/ui/src/app/pages/devices/components/device-qualification-from/device-qualification-from.component.ts @@ -17,6 +17,7 @@ import { AfterViewInit, Component, ElementRef, + HostListener, Inject, OnDestroy, OnInit, @@ -115,6 +116,7 @@ interface DialogData { export class DeviceQualificationFromComponent implements OnInit, AfterViewInit, OnDestroy { + readonly FORM_HEIGHT = 993; readonly TestingType = TestingType; readonly DeviceView = DeviceView; readonly ProgramType = ProgramType; @@ -179,6 +181,11 @@ export class DeviceQualificationFromComponent return device1 && device2 && this.compareDevices(device1, device2); } + @HostListener('window:resize', ['$event']) + onResize() { + this.setDialogHeight(); + } + constructor( private fb: FormBuilder, private deviceValidators: DeviceValidators, @@ -556,4 +563,13 @@ export class DeviceQualificationFromComponent } return true; } + + private setDialogHeight(): void { + const windowHeight = window.innerHeight; + if (windowHeight < this.FORM_HEIGHT) { + this.element.nativeElement.style.height = '100vh'; + } else { + this.element.nativeElement.style.height = this.FORM_HEIGHT + 'px'; + } + } }