diff --git a/frappe/public/js/frappe/ui/page.html b/frappe/public/js/frappe/ui/page.html
index 486a02b36a..50680684d0 100644
--- a/frappe/public/js/frappe/ui/page.html
+++ b/frappe/public/js/frappe/ui/page.html
@@ -3,8 +3,8 @@
 		<div class="row flex-nowrap align-center page-head-content justify-between">
 			<div class="page-title">
 				<button class="btn-reset sidebar-toggle-btn navbar-brand">
-					<svg class="es-icon icon-md sidebar-toggle-placeholder">
-						<use href="#es-line-align-justify"></use>
+					<svg class="icon icon-md sidebar-toggle-placeholder">
+						<use href="#icon-menu"></use>
 					</svg>
 					<span class="sidebar-toggle-icon">
 						<svg class="es-icon icon-md">
@@ -24,54 +24,56 @@
 					<span class="indicator-pill whitespace-nowrap"></span>
 				</div>
 			</div>
-			<div class="flex col page-actions justify-content-end {% if frappe.is_mobile() %} pr-0 {% endif %}">
-				<!-- buttons -->
-				<div class="filters flex"></div>
-				<div class="custom-actions hide hidden-xs hidden-md"></div>
-				<div class="standard-actions flex">
-					<span class="page-icon-group hide hidden-xs hidden-sm"></span>
-					<div class="menu-btn-group hide">
-						<button type="button" class="btn btn-default icon-btn menu-more-button" data-toggle="dropdown" aria-expanded="false" aria-label="{{ __("Menu") }}">
-							<span>
-								<span class="menu-btn-group-label">
-									<svg class="icon icon-sm">
-										<use href="#icon-dot-horizontal">
+			<div class="align-center flex standard-items-section">
+				{% if frappe.is_mobile() %}
+					<div class="search-bar text-muted hidden">
+						<div
+							class="navbar-modal-search-mobile"
+							placeholder="Search for type a command"
+						>
+							<span class="search-icon">
+								<svg class="icon icon-sm"><use href="#icon-search"></use></svg>
+							</span>
+						</div>
+					</div>
+				{% endif %}
+				<div class="flex col page-actions justify-content-end {% if frappe.is_mobile() %} pl-0 {% endif %}">
+					<!-- buttons -->
+					<div class="filters flex"></div>
+					<div class="custom-actions hide hidden-xs hidden-md"></div>
+					<div class="standard-actions flex">
+						<span class="page-icon-group hide hidden-xs hidden-sm"></span>
+						<div class="menu-btn-group hide">
+							<button type="button" class="btn btn-default icon-btn menu-more-button" data-toggle="dropdown" aria-expanded="false" aria-label="{{ __("Menu") }}">
+								<span>
+									<span class="menu-btn-group-label">
+										<svg class="icon icon-sm">
+											<use href="#icon-dot-horizontal">
+											</use>
+										</svg>
+									</span>
+								</span>
+							</button>
+							<ul class="dropdown-menu dropdown-menu-right" role="menu"></ul>
+						</div>
+						<button class="btn btn-secondary btn-default btn-sm hide"></button>
+						<div class="actions-btn-group hide">
+							<button type="button" class="btn btn-primary btn-sm justify-center" data-toggle="dropdown" aria-expanded="false">
+								<span>
+									<span class="hidden-xs actions-btn-group-label">{%= __("Actions") %}</span>
+									<svg class="icon icon-xs">
+										<use href="#icon-select">
 										</use>
 									</svg>
 								</span>
-							</span>
-						</button>
-						<ul class="dropdown-menu dropdown-menu-right" role="menu"></ul>
+							</button>
+							<ul class="dropdown-menu dropdown-menu-right" role="menu">
+							</ul>
+						</div>
+						<button class="btn btn-primary btn-sm hide primary-action"></button>
 					</div>
-					<button class="btn btn-secondary btn-default btn-sm hide"></button>
-					<div class="actions-btn-group hide">
-						<button type="button" class="btn btn-primary btn-sm justify-center" data-toggle="dropdown" aria-expanded="false">
-							<span>
-								<span class="hidden-xs actions-btn-group-label">{%= __("Actions") %}</span>
-								<svg class="icon icon-xs">
-									<use href="#icon-select">
-									</use>
-								</svg>
-							</span>
-						</button>
-						<ul class="dropdown-menu dropdown-menu-right" role="menu">
-						</ul>
-					</div>
-					<button class="btn btn-primary btn-sm hide primary-action"></button>
 				</div>
 			</div>
-			{% if frappe.is_mobile() %}
-				<div class="search-bar text-muted hidden ml-2 mr-3">
-					<div
-						class="navbar-modal-search-mobile"
-						placeholder="Search for type a command"
-					>
-						<span class="search-icon">
-							<svg class="icon icon-sm"><use href="#icon-search"></use></svg>
-						</span>
-					</div>
-				</div>
-			{% endif %}
 		</div>
 	</div>
 </div>
diff --git a/frappe/public/scss/desk/mobile.scss b/frappe/public/scss/desk/mobile.scss
index d130e5fb2f..d1dff7c4ad 100644
--- a/frappe/public/scss/desk/mobile.scss
+++ b/frappe/public/scss/desk/mobile.scss
@@ -331,8 +331,7 @@ body {
 					margin-left: 5px;
 				}
 				.mobile-no-divider li a {
-					font-size: 14px;
-					padding-bottom: 5px;
+					line-height: 20px;
 				}
 			}
 		}
@@ -343,6 +342,9 @@ body {
 				}
 			}
 		}
+		.standard-items-section .search-bar {
+			margin-right: 10px;
+		}
 	}
 }
 
diff --git a/frappe/public/scss/desk/navbar.scss b/frappe/public/scss/desk/navbar.scss
index b2edecab6c..4b0ea766a6 100644
--- a/frappe/public/scss/desk/navbar.scss
+++ b/frappe/public/scss/desk/navbar.scss
@@ -50,7 +50,7 @@
 .search-bar {
 	max-width: 300px;
 	svg {
-		stroke: var(--text-light);
+		stroke: var(--icon-stroke);
 		margin-bottom: 2px;
 	}
 	.awesomplete {
@@ -80,7 +80,7 @@
 	}
 	.search-icon {
 		background-color: var(--control-bg);
-		border-radius: 16px;
+		border-radius: 8px;
 		padding: 6px;
 	}
 }
diff --git a/frappe/public/scss/desk/page.scss b/frappe/public/scss/desk/page.scss
index eccaf6e5e3..35b451fd6f 100644
--- a/frappe/public/scss/desk/page.scss
+++ b/frappe/public/scss/desk/page.scss
@@ -124,6 +124,7 @@ body[data-route^="Form"] {
 	.page-head-content {
 		height: var(--page-head-height);
 		padding: 8px 0px;
+		gap: 10px;
 	}
 }