Merge pull request #35844 from iamejaaz/mobile-nav-merge
fix: spacing fixes on navbar
This commit is contained in:
commit
e365ee8c39
4 changed files with 53 additions and 48 deletions
|
|
@ -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>
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -125,6 +125,7 @@ body[data-route^="Form"] {
|
|||
.page-head-content {
|
||||
height: var(--page-head-height);
|
||||
padding: 8px 0px;
|
||||
gap: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue