Merge pull request #35844 from iamejaaz/mobile-nav-merge

fix: spacing fixes on navbar
This commit is contained in:
Ejaaz Khan 2026-01-12 13:35:34 +05:30 committed by GitHub
commit e365ee8c39
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 53 additions and 48 deletions

View file

@ -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>

View file

@ -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;
}
}
}

View file

@ -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;
}
}

View file

@ -125,6 +125,7 @@ body[data-route^="Form"] {
.page-head-content {
height: var(--page-head-height);
padding: 8px 0px;
gap: 10px;
}
}