Merge pull request #21596 from opf/70352-global-search-box-in-small-devices-misses-the-drop-down-list

[70352] Fix bugs in global search box

Author: HDinger

frontend/src/app/core/global_search/input/global-search-input-mobile.component.sass

@@ -11,7 +11,6 @@ $search-input-height-mobile: 36px
         width: unset
         min-width: unset
         flex-basis: 100%
-        position: unset
         flex-grow: 1
 
         .scroll-host
@@ -34,11 +33,13 @@ $search-input-height-mobile: 36px
           width: 0 !important
           padding-left: 0.75rem !important
 
-        .ng-input input
+        .ng-input
           height: 36px
+          top: 0 !important
 
         .ng-dropdown-panel
           width: 100% !important
+          min-width: unset !important
 
     .top-menu-search--back-button
       @include unset-button-styles

frontend/src/app/core/global_search/input/global-search-input.component.html

@@ -34,6 +34,7 @@
     class="global-search"
     [placeholder]="effectivePlaceholder"
     [ariaLabel]="effectivePlaceholder"
+    [appendTo]="'#global-search-input'"
     [dropdownPosition]="'bottom'"
     [classes]="{'top-menu-search--input': true, '-markable': markable, '-expanded': expanded, 'ng-select--primerized': true }"
     [inputAttrs]="{ 'class': 'global-search--input', 'name': 'global-search--input', autocomplete: 'off'}"