diff --git a/claims/linking/linkingGeneric.component.html b/claims/linking/linkingGeneric.component.html
index 9d0b1379..7f394dd2 100644
--- a/claims/linking/linkingGeneric.component.html
+++ b/claims/linking/linkingGeneric.component.html
@@ -45,7 +45,7 @@
       </a>
     </div>
   </div>
-  <div *ngIf="!inlineEntity" uk-sticky="offset: 65; bottom: #pageBottom; media: @m" class="uk-blur-background">
+  <div *ngIf="!inlineEntity" uk-sticky="offset: 65; end: #pageBottom; media: @m" class="uk-blur-background">
     <div class="uk-section-xsmall">
       <stepper>
         <step [status]="stepStatus('source')" stepId="source" stepNumber="1"
@@ -110,7 +110,7 @@
               </div>
               <!-- Basket-->
               <div *ngIf="showOptions.show != 'claim'" class="uk-width-1-3">
-                <div id="basket" uk-sticky="offset: 220; bottom: !*; media: @m" style="z-index: 0!important;">
+                <div id="basket" uk-sticky="offset: 220; end: !*; media: @m" style="z-index: 0!important;">
                   <div class="uk-card uk-card-default linkingBasket">
                     <div class="uk-card-body uk-padding-small">
                       <div class="uk-margin-right">
diff --git a/dashboard/sharedComponents/page-content/page-content.component.ts b/dashboard/sharedComponents/page-content/page-content.component.ts
index 54261153..654f82e6 100644
--- a/dashboard/sharedComponents/page-content/page-content.component.ts
+++ b/dashboard/sharedComponents/page-content/page-content.component.ts
@@ -80,9 +80,6 @@ export class PageContentComponent implements OnInit, AfterViewInit, OnDestroy {
   }
 
   ngOnInit() {
-    if(this.isBrowser) {
-      this.stickyBugWorkaround();
-    }
     this.subscriptions.push(this.layoutService.isMobile.subscribe(isMobile => {
       this.isMobile = isMobile;
       if(this.isBrowser) {
@@ -132,41 +129,7 @@ export class PageContentComponent implements OnInit, AfterViewInit, OnDestroy {
   
   initFooter() {
     let footer_offset = this.calcStickyFooterOffset(this.sticky_footer.nativeElement);
-    this.sticky.footer = UIkit.sticky(this.sticky_footer.nativeElement, {bottom: true, offset: footer_offset});
-  }
-
-  /**
-   * Workaround for sticky not update bug when sidebar is toggled.
-   * TODO when UIKit will be updated => remove
-   *
-   * */
-  stickyBugWorkaround() {
-    let sidebarOffset = Number.parseInt(getComputedStyle(document.documentElement).getPropertyValue('--dashboard-sidebar-width')) -
-      Number.parseInt(getComputedStyle(document.documentElement).getPropertyValue('--dashboard-sidebar-mini-width'));
-    let transitionDelay = Number.parseFloat(getComputedStyle(document.documentElement).getPropertyValue('--dashboard-transition-delay')) * 1000;
-    this.subscriptions.push(this.layoutService.isOpen.subscribe(isOpen => {
-      if (this.sticky.header) {
-        if (isOpen) {
-          this.sticky.header.$el.style.width = Number.parseInt(this.sticky.header.$el.style.width) - sidebarOffset + 'px';
-        } else {
-          this.sticky.header.$el.style.width = Number.parseInt(this.sticky.header.$el.style.width) + sidebarOffset + 'px';
-        }
-        setTimeout(() => {
-          this.sticky.header.$emit();
-        }, transitionDelay);
-      }
-      if (this.sticky.footer) {
-        if (isOpen) {
-          this.sticky.footer.$el.style.width = Number.parseInt(this.sticky.footer.$el.style.width) - sidebarOffset + 'px';
-        } else {
-          this.sticky.footer.$el.style.width = Number.parseInt(this.sticky.footer.$el.style.width) + sidebarOffset + 'px';
-        }
-        setTimeout(() => {
-          this.sticky.footer.$emit();
-        }, transitionDelay);
-      }
-      this.cdr.detectChanges();
-    }));
+    this.sticky.footer = UIkit.sticky(this.sticky_footer.nativeElement, {end: true, offset: footer_offset});
   }
 
   /**
diff --git a/dashboard/sharedComponents/sidebar/sideBar.component.html b/dashboard/sharedComponents/sidebar/sideBar.component.html
index 9bba0b18..35e20996 100644
--- a/dashboard/sharedComponents/sidebar/sideBar.component.html
+++ b/dashboard/sharedComponents/sidebar/sideBar.component.html
@@ -29,7 +29,7 @@
     </a>
   </div>
   <div *ngIf="items.length > 0" class="menu_section uk-margin-large-top" [class.mobile]="mobile" style="min-height: 30vh">
-    <ul #nav class="uk-list uk-nav uk-nav-parent-icon" [class.uk-list-large]="mobile"
+    <ul #nav class="uk-list uk-nav" [class.uk-list-large]="mobile"
         [class.uk-nav-default]="!mobile" [class.uk-nav-primary]="mobile" uk-nav="duration: 400">
       <ng-template ngFor [ngForOf]="items" let-item>
         <li [class.uk-active]="item.isActive" [ngClass]="item.customClass"
@@ -40,6 +40,7 @@
               <icon class="menu-icon" [customClass]="item.icon.class" [name]="item.icon.name" ratio="0.9" [svg]="item.icon.svg" [flex]="true"></icon>
             </div>
             <span [class.hide-on-close]="item.icon" class="uk-width-expand@l uk-text-truncate uk-margin-small-left">{{item.title}}</span>
+            <span *ngIf="item.items.length > 0" class="uk-nav-parent-icon hide-on-close"></span>
           </a>
           <ul *ngIf="item.items?.length > 0 && (isBrowser || item.isActive)" class="uk-nav-sub">
             <li *ngFor="let subItem of item.items" [ngClass]="subItem.customClass"
diff --git a/fos/fos.component.html b/fos/fos.component.html
index 70b3e068..e8a0c865 100644
--- a/fos/fos.component.html
+++ b/fos/fos.component.html
@@ -49,7 +49,7 @@
 		<div class="uk-margin-top uk-padding-small">
 			<div id="parentContainer" class="uk-grid uk-grid-large" uk-grid>
 				<div class="uk-width-1-4@m uk-visible@m">
-					<div class="uk-sticky" uk-sticky="bottom: !#parentContainer; offset: 200;">
+					<div class="uk-sticky" uk-sticky="end: !#parentContainer; offset: 200;">
 						<ul *ngIf="!keyword" class="uk-tab uk-tab-left">
 							<li *ngFor="let item of fos; index as i" [class.uk-active]="activeSection === item.id"
 								class="uk-margin-small-bottom uk-text-capitalize">
diff --git a/landingPages/dataProvider/dataProvider.component.html b/landingPages/dataProvider/dataProvider.component.html
index 376cbb87..4ec30f37 100644
--- a/landingPages/dataProvider/dataProvider.component.html
+++ b/landingPages/dataProvider/dataProvider.component.html
@@ -17,7 +17,7 @@
         <!-- left box - actions -->
         <!-- <div id="landing-left-sidebar" *ngIf="dataProviderInfo" class="uk-visible@s uk-padding-remove-horizontal">
           <div class="uk-flex uk-flex-column uk-flex-between uk-flex-center uk-sticky"
-              uk-sticky="bottom: true" [attr.offset]="offset">
+              uk-sticky="end: true" [attr.offset]="offset">
             <div class="uk-align-center uk-text-center uk-margin-medium-top uk-flex uk-flex-column uk-flex-between">
               <ng-container *ngIf="dataProviderInfo && hasMetrics">
                 <metrics [pageViews]="pageViews"
@@ -66,7 +66,7 @@
           </ng-template>
 
           <div #graph_and_feedback id="graph_and_feedback" class="uk-blur-background uk-text-xsmall uk-visible@m"
-              uk-sticky="bottom: true;" [attr.offset]="graph_offset">
+              uk-sticky="end: true;" [attr.offset]="graph_offset">
             <ng-container *ngTemplateOutlet="graph_and_feedback_template"></ng-container>
           </div>
 
@@ -229,7 +229,7 @@
                   </div>
                 </div>
                 <div id="main-tabs-div" class="uk-sticky uk-blur-background"
-                    uk-sticky="bottom: true; media: @m" [attr.offset]="offset">
+                    uk-sticky="end: true; media: @m" [attr.offset]="offset">
                   <div class="uk-padding uk-padding-remove-horizontal uk-padding-remove-bottom">
                     <landing-header [ngClass]="stickyHeader ? 'uk-visible@m' : 'uk-invisible'"
                                     [properties]="properties" [title]="dataProviderInfo.title.name"
diff --git a/landingPages/organization/organization.component.html b/landingPages/organization/organization.component.html
index 7224fe00..5e0e58fc 100644
--- a/landingPages/organization/organization.component.html
+++ b/landingPages/organization/organization.component.html
@@ -16,7 +16,7 @@
 				<!-- left column -->
 				<!-- <div id="landing-left-sidebar" *ngIf="organizationInfo" class="uk-visible@s uk-padding-remove-horizontal">
 					<div class="uk-flex uk-flex-column uk-flex-right uk-sticky"
-						uk-sticky="bottom: true" [attr.offset]="offset">
+						uk-sticky="end: true" [attr.offset]="offset">
 						<div class="uk-margin-large-bottom uk-align-center">
 							<div class="uk-text-meta uk-text-uppercase">Actions</div>
 							<ul class="uk-list">
@@ -65,7 +65,7 @@
           </ng-template>
 
           <div #graph_and_feedback id="graph_and_feedback" class="uk-blur-background uk-text-xsmall uk-visible@m"
-							uk-sticky="bottom: true;" [attr.offset]="graph_offset">
+							uk-sticky="end: true;" [attr.offset]="graph_offset">
             <ng-container *ngTemplateOutlet="graph_and_feedback_template"></ng-container>
           </div>
 
@@ -171,7 +171,7 @@
 								</div>
 								<!-- Tabs section -->
 								<div id="main-tabs-div" class="uk-sticky uk-blur-background"
-										 uk-sticky="bottom: true; media: @m"  [attr.offset]="offset">
+										 uk-sticky="end: true; media: @m"  [attr.offset]="offset">
 									<div class="uk-padding uk-padding-remove-horizontal uk-padding-remove-bottom">
 	<!--                  <showTitle *ngIf="stickyHeader" [titleName]="organizationInfo.title.name" classNames="uk-margin-remove-bottom" class="uk-visible@m"></showTitle>-->
 										<landing-header [ngClass]="stickyHeader ? 'uk-visible@m' : 'uk-invisible'"
diff --git a/landingPages/project/project.component.html b/landingPages/project/project.component.html
index 5ee9dd1d..f9100149 100644
--- a/landingPages/project/project.component.html
+++ b/landingPages/project/project.component.html
@@ -17,7 +17,7 @@
         <!-- left box - actions -->
         <!-- <div id="landing-left-sidebar" *ngIf="projectInfo" class="uk-visible@s uk-padding-remove-horizontal">
           <div class="uk-flex uk-flex-column uk-flex-between uk-flex-center uk-sticky"
-               uk-sticky="bottom: true" [attr.offset]="offset">
+               uk-sticky="end: true" [attr.offset]="offset">
             <div class="uk-align-center uk-text-center uk-margin-medium-top uk-flex uk-flex-column uk-flex-between">
               <ng-container *ngIf="projectInfo && hasMetrics">
                 <metrics [pageViews]="pageViews"
@@ -103,7 +103,7 @@
           </ng-template>
 
           <div #graph_and_feedback id="graph_and_feedback" class="uk-blur-background uk-text-xsmall uk-visible@m"
-              uk-sticky="bottom: true;" [attr.offset]="graph_offset">
+              uk-sticky="end: true;" [attr.offset]="graph_offset">
             <ng-container *ngTemplateOutlet="graph_and_feedback_template"></ng-container>
           </div>
 
@@ -363,7 +363,7 @@
                 </div>
   
                 <div id="main-tabs-div" class="uk-sticky uk-blur-background"
-                     uk-sticky="bottom: true; media: @m" [attr.offset]="offset">
+                     uk-sticky="end: true; media: @m" [attr.offset]="offset">
                   <div class="uk-padding uk-padding-remove-horizontal uk-padding-remove-bottom">
   <!--                  <showTitle *ngIf="stickyHeader" [titleName]="projectName" classNames="uk-margin-remove-bottom" class="uk-visible@m"></showTitle>-->
                     <landing-header [ngClass]="stickyHeader ? 'uk-visible@m' : 'uk-invisible'"
diff --git a/landingPages/result/resultLanding.component.html b/landingPages/result/resultLanding.component.html
index 3842aebf..73975e36 100644
--- a/landingPages/result/resultLanding.component.html
+++ b/landingPages/result/resultLanding.component.html
@@ -17,7 +17,7 @@
         <!-- left box/sidebar - actions -->
         <!-- <div id="landing-left-sidebar" *ngIf="resultLandingInfo" class="uk-visible@s uk-padding-remove-horizontal">
           <div class="uk-flex uk-flex-column uk-flex-between uk-flex-center uk-sticky"
-              uk-sticky="bottom: true" [attr.offset]="offset">
+              uk-sticky="end: true" [attr.offset]="offset">
             <div class="uk-align-center uk-text-center uk-margin-medium-top uk-flex uk-flex-column uk-flex-between">
               <ng-container *ngIf="resultLandingInfo && (hasAltMetrics || hasMetrics)">
                 <metrics *ngIf="hasMetrics" class="uk-margin-bottom"
@@ -99,7 +99,7 @@
           </ng-template>
 
           <div #graph_and_feedback id="graph_and_feedback" class="uk-blur-background uk-text-xsmall uk-visible@m"
-              uk-sticky="bottom: true;" [attr.offset]="graph_offset">
+              uk-sticky="end: true;" [attr.offset]="graph_offset">
             <ng-container *ngTemplateOutlet="graph_and_feedback_template"></ng-container>
           </div>
 
@@ -266,7 +266,7 @@
                 </div>
   
                 <div id="main-tabs-div" class="uk-sticky uk-blur-background"
-                    uk-sticky="bottom: true; media: @m" [attr.offset]="offset">
+                    uk-sticky="end: true; media: @m" [attr.offset]="offset">
                   <div class="uk-padding uk-padding-remove-horizontal uk-padding-remove-bottom">
                     <landing-header [ngClass]="stickyHeader ? 'uk-visible@m' : 'uk-invisible'"
                                     [properties]="properties" [title]="resultLandingInfo.title"
@@ -346,7 +346,7 @@
         <ng-container *ngIf="resultLandingInfo && hasRightSidebarInfo">
           <div id="landing-right-sidebar" *ngIf="!rightSidebarOffcanvasClicked" class="uk-width-1-3 uk-width-1-4@l uk-padding-remove uk-text-small uk-visible@m"
             [class.uk-animation-right]="viewAll">
-            <div class="uk-sticky" uk-sticky="bottom: true" [attr.offset]="offset">
+            <div class="uk-sticky" uk-sticky="end: true" [attr.offset]="offset">
               <div class="uk-overflow-auto uk-height-1-1">
                 <ng-container *ngTemplateOutlet="right_column"></ng-container>
               </div>
diff --git a/login/userMini.component.ts b/login/userMini.component.ts
index 4434a1e2..e8293086 100644
--- a/login/userMini.component.ts
+++ b/login/userMini.component.ts
@@ -83,12 +83,13 @@ declare var UIkit;
                   {{user.fullname}}
                 </h5>
               </div>
-              <ul class="uk-nav uk-nav-primary uk-list uk-margin-top uk-nav-parent-icon" uk-nav>
+              <ul class="uk-nav uk-nav-primary uk-list uk-margin-top" uk-nav>
                 <ng-container *ngFor="let item of userMenuItems ">
                   <li *ngIf="item.needsAuthorization && isAuthorized || !item.needsAuthorization" [ngClass]="item.customClass">
-                    <a *ngIf="item.route" [routerLink]="item.route" (click)="closeCanvas(account)">{{item.title}}</a>
+                    <a *ngIf="item.route" [routerLink]="item.route" (click)="closeCanvas(account)">
+                        {{item.title}}<span *ngIf="item.items.length > 0" class="uk-nav-parent-icon"></span></a>
                     <a *ngIf="!item.route && item.url" (click)="closeCanvas(account)" [href]="item.url" [class.custom-external]="item.target != '_self'"
-                       [target]="item.target">{{item.title}}</a>
+                       [target]="item.target">{{item.title}}<span *ngIf="item.items.length > 0" class="uk-nav-parent-icon"></span></a>
                   </li>
                 </ng-container>
                 <ng-container *ngIf="notificationConfiguration">
diff --git a/monitor/methodology/terminology.component.ts b/monitor/methodology/terminology.component.ts
index 0cf50f76..b01b2650 100644
--- a/monitor/methodology/terminology.component.ts
+++ b/monitor/methodology/terminology.component.ts
@@ -39,7 +39,7 @@ declare var ResizeObserver;
 				</div>
 			</div>
 			<div *ngIf="divContents" uk-scrollspy="target: [uk-scrollspy-class]; cls: uk-animation-fade; delay: 250">
-				<div id="graph_element" #graph_element class="uk-blur-background" uk-sticky="bottom: true"
+				<div id="graph_element" #graph_element class="uk-blur-background" uk-sticky="end: true"
 						 [attr.offset]="graph_offset">
 					<div class="uk-container uk-container-large uk-margin-small-top uk-margin-small-bottom">
             <a href="https://graph.openaire.eu" target="_blank" class="uk-width-1-1 uk-width-auto@m">
@@ -50,7 +50,7 @@ declare var ResizeObserver;
 				<div class="uk-section uk-container uk-container-large" uk-scrollspy-class>
 					<div id="parentContainer" class="uk-grid uk-grid-large" uk-grid>
 						<div class="uk-width-medium uk-margin-top">
-							<div class="uk-sticky" uk-sticky="bottom: !#parentContainer; offset: 100;">
+							<div class="uk-sticky" uk-sticky="end: !#parentContainer; offset: 100;">
 								<slider-tabs type="scrollable" position="left">
 									<slider-tab tabId="entities" tabTitle="1. Entities"></slider-tab>
 									<slider-tab tabId="inherited-and-inferred-attributes" tabTitle="2. Inherited and Inferred Attributes"></slider-tab>
diff --git a/sharedComponents/input/input.component.ts b/sharedComponents/input/input.component.ts
index 296622bb..d3a6722b 100644
--- a/sharedComponents/input/input.component.ts
+++ b/sharedComponents/input/input.component.ts
@@ -196,11 +196,11 @@ declare var UIkit;
               </div>
           </div>
           <div *ngIf="!mobile && type === 'date' && opened" class="uk-dropdown" #calendarBox 
-               uk-dropdown="pos: bottom-left; mode: none; boundary-align: true;" [attr.boundary]="'#' + id" (click)="$event.stopPropagation()">
+               uk-dropdown="pos: bottom-left; mode: none; flip: false ; shift: false" [attr.target]="'#' + id" [attr.boundary]="'#' + id" (click)="$event.stopPropagation()">
               <mat-calendar [selected]="selectedDate" [startAt]="selectedDate" (selectedChange)="dateChanged($event)"></mat-calendar>
           </div>
           <div *ngIf="!mobile && filteredOptions && filteredOptions.length > 0 && opened" class="options uk-dropdown" #optionBox
-               uk-dropdown="pos: bottom-justify; mode: none; boundary-align: true;" [attr.boundary]="'#' + id">
+               uk-dropdown="mode: none; stretch: true; flip: false; shift: false" [attr.boundary]="'#' + id">
               <ul class="uk-nav uk-dropdown-nav">
                   <li *ngFor="let option of filteredOptions; let i=index" [class.uk-hidden]="option.hidden"
                       [class.uk-active]="(formControl.value === option.value) || selectedIndex === i">
diff --git a/sharedComponents/navigationBar.component.html b/sharedComponents/navigationBar.component.html
index 3ebaf5d2..83f49b47 100644
--- a/sharedComponents/navigationBar.component.html
+++ b/sharedComponents/navigationBar.component.html
@@ -31,7 +31,7 @@
             <ng-container *ngTemplateOutlet="header_template; context: {mobile: true}"></ng-container>
           </div>
         </nav>
-        <ul class="uk-nav uk-nav-primary uk-list uk-list-large uk-margin-large-top uk-nav-parent-icon" uk-nav>
+        <ul class="uk-nav uk-nav-primary uk-list uk-list-large uk-margin-large-top" uk-nav>
             <ng-container *ngIf="!onlyTop">
               <li *ngIf="showHomeMenuItem && currentRoute.route !== '/'">
                 <a routerLink="/" (click)="closeCanvas(canvas)">Home</a>
@@ -40,17 +40,15 @@
                 <li [class.uk-active]="isTheActiveMenu(menu)" [class.uk-parent]="menu.items.length > 0" [ngClass]="menu.customClass"
                     *ngIf="isAtleastOneEnabled(menu.entitiesRequired,showEntity) && isAtleastOneEnabled(menu.routeRequired, showPage)">
                   <!--a routerLink="{{menu.rootItem.route}}"  [queryParams]=menu.rootItem.params class="uk-offcanvas-close custom-offcanvas-close">{{menu.rootItem.title}}</a-->
-                  <a *ngIf="menu.route && (isEnabled([menu.route], showPage) || !menu.routeRequired)"
-                     [routerLink]="menu.items.length === 0?menu.route:null" (click)="menu.items.length === 0?closeCanvas(canvas):null"
+                  <a *ngIf="!menu.url" [routerLink]="menu.route && (isEnabled([menu.route], showPage) || !menu.routeRequired) && menu.items.length === 0?menu.route:null"
+                     (click)="menu.items.length === 0?closeCanvas(canvas):null"
                      [queryParams]="menu.params"
-                     [fragment]="menu.fragment">{{menu.title}}</a>
-                  <a *ngIf="!menu.route && menu.url"
-                     [href]="menu.items.length === 0?menu.url:null" (click)="menu.items.length === 0?closeCanvas(canvas):null"
-                     [class.custom-external]="menu.target != '_self'" [target]="menu.target">{{menu.title}}</a>
-                  <a *ngIf="(!menu.route && !menu.url) ||
-                  (menu.route && menu.routeRequired && !isEnabled([menu.route], showPage)
-                  && isAtleastOneEnabled(menu.routeRequired, showPage))"
-                     (click)="menu.items.length === 0?closeCanvas(canvas):null">{{menu.title}}</a>
+                     [fragment]="menu.fragment">{{menu.title}}<span *ngIf="menu.items.length > 0" class="uk-nav-parent-icon"></span></a>
+                  <a *ngIf="menu.url"
+                     (click)="menu.items.length === 0?closeCanvas(canvas):null"
+                     [href]="menu.items.length === 0?menu.url:null"
+                     [class.custom-external]="menu.url && menu.target != '_self'" [target]="menu.url?menu.target:null">
+                    {{menu.title}}<span *ngIf="menu.items.length > 0" class="uk-nav-parent-icon"></span></a>
                   <ul *ngIf="menu.items.length > 0" class="uk-nav-sub">
                     <ng-container *ngFor="let submenu of menu.items">
                       <li [class.uk-active]="isTheActiveMenu(submenu)" [ngClass]="submenu.customClass"
@@ -270,11 +268,10 @@
                         <a *ngIf="menu.type == 'noAction'">
                           {{menu.title}}
                         </a>
-                        <div *ngIf="menu.items.length > 0" class="uk-navbar-dropdown uk-navbar-dropdown-bottom-left"
+                        <div *ngIf="menu.items.length > 0" class="uk-navbar-dropdown uk-navbar-dropdown-bottom-left uk-height-max-medium uk-overflow-auto"
                              style="top: 80px; left: 0px;" id="{{menu._id}}" uk-toggle>
-                          <div class="uk-navbar-dropdown-grid uk-child-width-1-1 uk-grid uk-grid-stack" uk-grid="">
-                            <div class="uk-first-column uk-height-max-medium uk-overflow-auto">
-                              <ul class="uk-nav uk-navbar-dropdown-nav">
+                          <div>
+                            <ul class="uk-nav uk-navbar-dropdown-nav">
                                 <ng-container *ngFor="let submenu of menu.items">
                                   <li [class.uk-active]="isTheActiveMenu(submenu)" [ngClass]="submenu.customClass">
                                     <a *ngIf="submenu.type == 'internal' && submenu.route && isEnabled([submenu.route], showPage)"
@@ -291,7 +288,6 @@
                                   </li>
                                 </ng-container>
                               </ul>
-                            </div>
                           </div>
                         </div>
                       </li>
diff --git a/sharedComponents/search-input/search-input.component.ts b/sharedComponents/search-input/search-input.component.ts
index ea7e87df..0b2a3e02 100644
--- a/sharedComponents/search-input/search-input.component.ts
+++ b/sharedComponents/search-input/search-input.component.ts
@@ -90,6 +90,7 @@ export class SearchInputComponent implements OnInit, AfterViewInit {
   ngAfterViewInit() {
     if(typeof document !== 'undefined') {
       this.ratio = Number.parseFloat(getComputedStyle(this.searchInput.nativeElement).getPropertyValue('--search-input-icon-ratio'));
+      this.cdr.detectChanges()
     }
   }
   
diff --git a/utils/entitiesAutoComplete/entitiesAutoComplete.component.ts b/utils/entitiesAutoComplete/entitiesAutoComplete.component.ts
index 9a3faee1..080f3dab 100644
--- a/utils/entitiesAutoComplete/entitiesAutoComplete.component.ts
+++ b/utils/entitiesAutoComplete/entitiesAutoComplete.component.ts
@@ -31,7 +31,7 @@ import {AutoCompleteValue} from "../../searchPages/searchUtils/searchHelperClass
           <!--span [style.display]="showLoading ? 'inline' : 'none'" class="uk-alert uk-alert-primary" data-uk-alert=""> <i class="uk-icon-spinner"></i> Loading... </span>
           <span *ngIf="warningMessage.length > 0" class="uk-alert uk-alert-warning" data-uk-alert=""> {{warningMessage}} <a href="" class="uk-alert-close uk-close"></a></span-->
           <div *ngIf="focus && showInput" class="options uk-dropdown uk-open"   #optionBox
-               uk-dropdown="pos: bottom-justify; mode: none; offset: 15; boundary-align: true;" [attr.boundary]="'#' + id">
+               uk-dropdown="pos: bottom-left; mode: none; stretch: true; offset: 15; flip: false; shift: false" [attr.target]="'#' + id" [attr.boundary]="'#' + id">
                 <ul class="uk-nav uk-nav-autocomplete uk-autocomplete-results" >
                       <li>
                           <span *ngIf="!_search.ready && warningMessage.length ==0" class="uk-padding-small"> Loading..... </span>
diff --git a/utils/staticAutoComplete/staticAutoComplete.component.ts b/utils/staticAutoComplete/staticAutoComplete.component.ts
index 91e215f7..55813c50 100644
--- a/utils/staticAutoComplete/staticAutoComplete.component.ts
+++ b/utils/staticAutoComplete/staticAutoComplete.component.ts
@@ -25,7 +25,7 @@ import{EnvProperties} from '../../utils/properties/env-properties';
             <!--span [style.display]="showLoading ? 'inline' : 'none'" class="uk-alert uk-alert-primary" data-uk-alert=""> <i class="uk-icon-spinner"></i> Loading... </span>
             <span *ngIf="warningMessage.length > 0" class="uk-alert uk-alert-warning" data-uk-alert=""> {{warningMessage}} <a href="" class="uk-alert-close uk-close"></a></span-->
             <div  *ngIf="focus && showInput"   class="options uk-dropdown uk-open"   #optionBox
-                  uk-dropdown="pos: bottom-justify; mode: none; offset: 15; boundary-align: true;" [attr.boundary]="'#' + id" >
+                  uk-dropdown="pos: bottom-left; mode: none; stretch: true; offset: 15; flip: false; shift: false" [attr.target]="'#' + id" [attr.boundary]="'#' + id">
                   <ul class="uk-nav uk-nav-autocomplete uk-autocomplete-results" >
                       <li>
                       <span [style.display]="showLoading ? 'inline' : 'none'" class="uk-padding-small uk-text-center"> <i class="uk-icon-spinner"></i> Loading... </span>
diff --git a/utils/theme/theme.component.html b/utils/theme/theme.component.html
index ca5ad8b8..bb6e9efd 100644
--- a/utils/theme/theme.component.html
+++ b/utils/theme/theme.component.html
@@ -226,18 +226,16 @@
 
           </div>
           <div class="uk-width-expand@m">
-
             <div class="uk-margin-medium-bottom">
               <form class="uk-search uk-search-default uk-width-1-1">
                 <span uk-search-icon="" class="uk-icon uk-search-icon"><svg width="20" height="20" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg" data-svg="search-icon"><circle fill="none" stroke="#000" stroke-width="1.1" cx="9" cy="9" r="7"></circle><path fill="none" stroke="#000" stroke-width="1.1" d="M14,14 L18,18 L14,14 Z"></path></svg></span>
                 <input class="uk-search-input" type="search" placeholder="Search...">
               </form>
             </div>
-
-            <ul class="uk-nav-default uk-nav-parent-icon uk-margin-medium uk-nav" uk-nav="">
+            <ul class="uk-nav-default uk-margin-medium uk-nav" uk-nav="">
               <li class="uk-active"><a href="#">Active</a></li>
               <li class="uk-parent">
-                <a href="#">Parent</a>
+                <a href="#">Parent<span class="uk-nav-parent-icon"></span></a>
                 <ul class="uk-nav-sub" aria-hidden="true" hidden="">
                   <li><a href="#">Sub item</a></li>
                   <li><a href="#">Sub item</a>
@@ -249,7 +247,7 @@
                 </ul>
               </li>
               <li class="uk-parent">
-                <a href="#">Parent</a>
+                <a href="#">Parent without icon</a>
                 <ul class="uk-nav-sub" aria-hidden="true" hidden="">
                   <li><a href="#">Sub item</a></li>
                   <li><a href="#">Sub item</a></li>