add search bar on landscape view

src/app/shared/topmenu/top-menu.component.html

@@ -157,6 +157,39 @@
               </a>
             </div>
 
+            <div class="uk-navbar-center">
+
+              <div class="uk-autocomplete uk-form uk-search uk-search-default searchForCountry">
+                <span id="search-icon" uk-search-icon></span>
+                <ng-autocomplete
+                  [data]="countriesCollection"
+                  [searchKeyword]="keyword"
+                  placeHolder="Search for a country..."
+                  (selected)='selectCountryFromAutocompleteEvent($event)'
+                  (inputChanged)='onChangeSearch($event)'
+                  (inputFocused)='onFocused($event)'
+                  historyIdentifier="countriesCollection"
+                  [itemTemplate]="itemTemplate"
+                  [notFoundTemplate]="notFoundTemplate">
+                </ng-autocomplete>
+
+                <ng-template #itemTemplate let-item>
+                  <a [innerHTML]="item.name"></a>
+                </ng-template>
+
+                <ng-template #notFoundTemplate let-notFound>
+                  <div [innerHTML]="notFound"></div>
+                </ng-template>
+              </div>
+
+              <!--<div class="uk-autocomplete uk-form uk-search uk-search-default searchForCountry" data-uk-autocomplete="{source:'https://getuikit.com/v2/tests/components/_autocomplete.json'}">-->
+              <!--<span uk-search-icon></span>-->
+              <!--<input class="uk-search-input" type="search" placeholder="Search for a country...">-->
+              <!--&lt;!&ndash;<input type="text">&ndash;&gt;-->
+              <!--</div>-->
+
+            </div>
+
             <div class="uk-navbar-right">
 
               <ul class="uk-navbar-nav" >