Custom Navigation Bar v2 Components
Navigation Bar
<![CDATA[
<nav class="navbar py-4" style="position:fixed; width: 100%; top:0; left:0; z-index: 9999;">
<a href="#" class="navbar-brand">
<img src="../../images/logo.png" />
</a>
<div class="navbar-center">
<div class="btn-group">
<button class="btn-search">
<i data-lucide="search"></i> Search ...
</button>
</div>
</div>
<div class="navbar-right">
<a href="{% url 'plan-list' %}">
<button class="btn btn-pumpkin btn--md">
<i data-lucide="clock-arrow-up"></i> Upgrade
</button>
</a>
<div class="d-flex align-items-center">
<button class="btn btn--ghost btn-icon btn-icon--xl">
<i data-lucide="bell"></i>
</button>
<button class="btn btn--ghost btn-icon btn-icon--xl">
<i data-lucide="grip"></i>
</button>
<div class="user-dropdown">
<div class="dropdown dropdown--right">
<div class="dropdown__header">
<div class="avatar avatar--circular avatar--sm">
<img class="avatar__img"
src="https://images.unsplash.com/photo-1472099645785-5658abf4ff4e"
alt="User avatar">
<span
class="avatar__notification avatar__notification--bottom avatar__notification--success"></span>
</div>
<i data-lucide="chevron-down" class="dropdown__chevron"></i>
</div>
<div class="dropdown__content py-2">
<div class="dropdown__section">
<div class="dropdown__item">
<div class="d-d-flex">
<div class="avatar avatar--circular avatar--md">
<img class="avatar__img"
src="https://images.unsplash.com/photo-1472099645785-5658abf4ff4e"
alt="User avatar">
</div>
</div>
<div>
<div class="dropdown__item-text">Signed in as</div>
<div class="dropdown__item-subtext font-bold">
johndoe@gmail.com</div>
</div>
</div>
</div>
<div class="dropdown__section">
<div class="dropdown__item"
onclick="window.location.href='{% url 'organization_update' %}'">
<div class="dropdown__item-icon">
<i data-lucide="settings"></i>
</div>
<span class="dropdown__item-text">Settings</span>
</div>
<div class="dropdown__item"
onclick="window.location.href='{% url 'app_list' %}'">
<div class="dropdown__item-icon">
<i data-lucide="layout-grid"></i>
</div>
<span class="dropdown__item-text">Manage Apps</span>
</div>
<div class="dropdown__item"
onclick="window.location.href='{% url 'logout-users' %}'">
<div class="dropdown__item-icon">
<i data-lucide="log-out"></i>
</div>
<span class="dropdown__item-text">Sign Out</span>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</nav>
<div style="height: 65px;"></div>
]]>