rDrama/files/templates/dropdowns/NavbarProfile.html

54 lines
3.8 KiB
HTML

<div class="dropdown">
<button class="relative flex items-center px-3 py-2.5 rounded text-sm text-gray-500 hover:text-gray-400 focus:text-gray-200 focus:bg-gray-800 focus:shadow-inner focus:font-bold text-shadow focus:outline-none dropdown-toggle" type="button" id="dropdownProfileMenuButton" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<span class="sr-only">Open user menu</span>
<img class="h-9 w-9 bg-white p-[3px] border border-black" src="https://images.unsplash.com/photo-1472099645785-5658abf4ff4e?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80" alt="">
<span class="text-sm font-heading pl-2">{{ v.username }}</span>
</button>
<ul class="dropdown-menu w-56 bg-gray-900 rounded-md rounded-t-none shadow-lg" aria-labelledby="dropdownProfileMenuButton" x-placement="bottom-start">
<li>
<a class="dropdown-item block w-full text-left px-4 py-2 text-sm text-gray-200 bg-gradient-to-t hover:from-pink-800 hover:to-pink-700 hover:shadow-inner focus:shadow-inner focus:bg-gradient-to-t focus:from-pink-800 focus:to-pink-700" href="/shop">
<i class="fas fa-user fa-sm fa-fw mr-4"></i>Profile
</a>
</li>
<li>
<a class="dropdown-item block w-full text-left px-4 py-2 text-sm text-gray-200 bg-gradient-to-t hover:from-pink-800 hover:to-pink-700 hover:shadow-inner focus:shadow-inner focus:bg-gradient-to-t focus:from-pink-800 focus:to-pink-700" href="/notifications{% if v.notifications_count and v.notifications_count == v.post_notifications_count %}?posts=true{% endif %}">
<i class="fas fa-envelope fa-sm fa-fw mr-4"></i>Inbox
{% if v.notifications_count %}<span class="text-red-500">{{ v.notifications_count }}</span>{% endif %}
</a>
</li>
<li>
<hr class="mt-2 mb-1.5 border-t border-black h-1 shadow-inset-t-white-05"/>
</li>
<li>
<a class="dropdown-item block w-full text-left px-4 py-2 text-sm text-gray-200 bg-gradient-to-t hover:from-pink-800 hover:to-pink-700 hover:shadow-inner focus:shadow-inner focus:bg-gradient-to-t focus:from-pink-800 focus:to-pink-700" href="/@{{ v.username }}">
<i class="fas fa-pen fa-sm fa-fw mr-4"></i>Posts
</a>
</li>
<li>
<a class="dropdown-item block w-full text-left px-4 py-2 text-sm text-gray-200 bg-gradient-to-t hover:from-pink-800 hover:to-pink-700 hover:shadow-inner focus:shadow-inner focus:bg-gradient-to-t focus:from-pink-800 focus:to-pink-700" href="/@{{ v.username }}/comments">
<i class="fas fa-comments-alt fa-sm fa-fw mr-4"></i>Comments
</a>
</li>
<li>
<hr class="mt-2 mb-1.5 border-t border-black h-1 shadow-inset-t-white-05"/>
</li>
<li>
<a class="dropdown-item block w-full text-left px-4 py-2 text-sm text-gray-200 bg-gradient-to-t hover:from-pink-800 hover:to-pink-700 hover:shadow-inner focus:shadow-inner focus:bg-gradient-to-t focus:from-pink-800 focus:to-pink-700" href="https://marsey1.gumroad.com/l/tfcvri">
<i class="fas fa-arrow-alt-up fa-sm fa-fw mr-4"></i>Upgrade account
</a>
</li>
<li>
<a class="dropdown-item block w-full text-left px-4 py-2 text-sm text-gray-200 bg-gradient-to-t hover:from-pink-800 hover:to-pink-700 hover:shadow-inner focus:shadow-inner focus:bg-gradient-to-t focus:from-pink-800 focus:to-pink-700" href="/settings">
<i class="fas fa-cog fa-sm fa-fw mr-4"></i>Settings
</a>
</li>
<li>
<hr class="mt-2 mb-1.5 border-t border-black h-1 shadow-inset-t-white-05"/>
</li>
<li>
<button class="dropdown-item block w-full text-left px-4 py-2 text-sm text-gray-200 bg-gradient-to-t hover:from-pink-800 hover:to-pink-700 hover:shadow-inner focus:shadow-inner focus:bg-gradient-to-t focus:from-pink-800 focus:to-pink-700" onclick="post_toast('/logout', '1')">
<i class="fas fa-power-off fa-sm fa-fw mr-4"></i>Logout
</button>
</li>
</ul>
</div>