<div class="navbar navbar-default navbar-fixed-top" role="navigation">
	<div class="container">
		<div class="navbar-header navbar-desk">
			<a class="navbar-brand toggle-sidebar visible-xs visible-sm">
				<i class="octicon octicon-three-bars"></i>
			</a>
			<a class="navbar-brand navbar-home hidden-xs hidden-sm" href="#">
				<img class="app-logo" src="{{ frappe.app.logo_url }}">
			</a>
			<ul class="nav navbar-nav" id="navbar-breadcrumbs">
			</ul>
		</div>
		<div class="navbar-center ellipsis" style="display: none;"></div>

		<ul class="nav navbar-nav navbar-right">
			<li class="visible-xs">
				<a class="navbar-search-button" href="#" data-toggle="modal" data-target="#search-modal"><i class="octicon octicon-search"></i></a>
			</li>
			<li class="dropdown dropdown-navbar-user dropdown-mobile">
				<a class="dropdown-toggle" data-toggle="dropdown" href="#"
					onclick="return false;">
				{{ avatar }}
				<span class="ellipsis toolbar-user-fullname hidden-xs hidden-sm">
					{%= __("Settings") %}</span>
				<b class="caret hidden-xs hidden-sm"></b></a>
				<ul class="dropdown-menu" id="toolbar-user" role="menu">
					<li><a href="#user-profile">
						{%= __("My Profile") %}</a></li>
					<li><a href="#Form/User/{%= encodeURIComponent(frappe.session.user) %}">
						{%= __("My Settings") %}</a></li>
					<li><a href="#" onclick="return frappe.ui.toolbar.setup_session_defaults();">
							{%= __("Session Defaults") %}</a></li>
					<li class="navbar-reload">
						<a href="" onclick="return frappe.ui.toolbar.clear_cache();">
						{%= __("Reload") %}</a></li>
					<li><a href="/index" target="_blank" rel="noopener noreferrer">
						{%= __("View Website") %}</a></li>
					<li class="navbar-toggle-full-width">
						<a href="#" onclick="return false">{%= __("Toggle Full Width") %}</a>
					</li>
					<li><a href="#background_jobs">
						{%= __("Background Jobs") %}</a></li>
					<li class="divider"></li>
					<li><a href="#" onclick="return frappe.app.logout();">
						{%= __("Logout") %}</a></li>
				</ul>
			</li>

			<li class="dropdown dropdown-help dropdown-mobile">
				<a class="dropdown-toggle" data-toggle="dropdown" href="#"
					onclick="return false;"  style="height: 40px;">
					<span class="hidden-xs hidden-sm" style="line-height: 24px;">{{ __("Help") }} <b class="caret"></b></span>
					<span class="visible-xs visible-sm standard-image help-icon">?</span>
				</a>
				<ul class="dropdown-menu" id="toolbar-help" role="menu">
					<li id="help-links"></li>
					<li class="divider"></li>
					<li class="divider documentation-links"></li>
					<li><a href="#" onclick="return frappe.ui.toolbar.show_about();">
						{%= __("About") %}</a></li>
					<li><a href="#" onclick="return frappe.ui.toolbar.show_shortcuts(event);">
						{%= __("Keyboard Shortcuts") %}</a></li>
				</ul>
			</li>

			<!-- frappe.chat -->
			<!-- "placeholder, to display or not to display." -->
			<li class="frappe-chat-dropdown"></li>
			<!-- end frappe.chat -->

			<li class="dropdown dropdown-notifications dropdown-mobile">
				<span class="notifications-indicator"><i class="fa fa-circle"></i></span>
				<a
					class="dropdown-toggle notifications-icon"
					data-toggle="dropdown"
					aria-haspopup="true"
					aria-expanded="true"
					href="#"
					onclick="return false;">
					<span><i class="fa fa-bell" aria-hidden="true"></i></span>
				</a>
				<ul
					class="dropdown-menu notifications-list"
					role="menu">
				</ul>
			</li>
		</ul>

		<div id="search-modal" class="modal fade" role="dialog">
			<div class="modal-dialog" style="height: 50px;">
				<div class="modal-content">
					<div class="modal-header">
						<form role="search" onsubmit="return false;">
							<div class="input-group" style="width: 100%">
								<input id="modal-search" type="text" class="form-control"
								placeholder="{%= __("Search or type a command") %}" aria-haspopup="true">
								<button type="reset" class="close" data-dismiss="modal"><i class="octicon octicon-x"></i></button>
							</div>
						</form>
					</div>
				</div>
			</div>
		</div>

		<div class="hidden-xs">
			<form class="navbar-form navbar-right" role="search" onsubmit="return false;">
			  <div class="form-group form-group-sm ui-front">
				<input id="navbar-search" type="text" class="form-control"
					placeholder="{%= __("Search or type a command") %} {%= __("(Ctrl + G)") %}" aria-haspopup="true">
				<span class="octicon octicon-search navbar-search-icon"></span>
			  </div>
			</form>
		</div>
	</div>
</div>
