39 lines
No EOL
2.1 KiB
Text
39 lines
No EOL
2.1 KiB
Text
<div class="relative group">
|
|
<input type="checkbox" id="user-dropdown" class="peer hidden" />
|
|
<label for="user-dropdown"
|
|
class="flex items-center space-x-2 text-white hover:text-gray-300 focus:outline-none focus:ring-2 focus:ring-gray-300 rounded-lg p-2 cursor-pointer"
|
|
>
|
|
<div class="w-8 h-8 bg-blue-500 rounded-full flex items-center justify-center text-white font-semibold text-sm flex-shrink-0">
|
|
<%= Current.user.email.first.upcase %>
|
|
</div>
|
|
<span class="hidden xl:block font-medium truncate max-w-48"><%= Current.user.email %></span>
|
|
<svg class="w-4 h-4 transform transition-transform duration-200 flex-shrink-0 peer-checked:rotate-180" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path>
|
|
</svg>
|
|
</label>
|
|
|
|
<!-- Invisible overlay to close dropdown when clicking outside -->
|
|
<label for="user-dropdown" class="fixed inset-0 z-40 hidden peer-checked:block cursor-default"></label>
|
|
|
|
<div
|
|
class="absolute right-0 mt-2 w-48 bg-white rounded-lg shadow-lg border border-gray-200 z-50 hidden peer-checked:block"
|
|
>
|
|
<div class="py-1">
|
|
<%= link_to user_path(Current.user), class: "flex items-center px-4 py-2 text-sm text-gray-700 hover:bg-gray-100" do %>
|
|
<svg class="w-4 h-4 mr-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M16 7a4 4 0 11-8 0 4 4 0 018 0zM12 14a7 7 0 00-7 7h14a7 7 0 00-7-7z"></path>
|
|
</svg>
|
|
Profile
|
|
<% end %>
|
|
<hr class="my-1 border-gray-200">
|
|
<%= link_to session_path,
|
|
data: {turbo_method: :delete},
|
|
class: "flex items-center px-4 py-2 text-sm text-gray-700 hover:bg-gray-100" do %>
|
|
<svg class="w-4 h-4 mr-3" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M17 16l4-4m0 0l-4-4m4 4H7m6 4v1a3 3 0 01-3 3H6a3 3 0 01-3-3V7a3 3 0 013-3h4a3 3 0 013 3v1"></path>
|
|
</svg>
|
|
Log out
|
|
<% end %>
|
|
</div>
|
|
</div>
|
|
</div> |