130 lines
6.6 KiB
Plaintext
130 lines
6.6 KiB
Plaintext
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title><%= content_for(:title) || "Admin Dashboard" %> - Sanasto Wiki</title>
|
|
<meta name="viewport" content="width=device-width,initial-scale=1">
|
|
<%= csrf_meta_tags %>
|
|
<%= csp_meta_tag %>
|
|
<%= stylesheet_link_tag :app, "data-turbo-track": "reload" %>
|
|
<%= javascript_importmap_tags %>
|
|
<script src="https://cdn.tailwindcss.com"></script>
|
|
</head>
|
|
|
|
<body class="bg-slate-50 text-gray-900 font-sans antialiased">
|
|
<div class="min-h-screen flex flex-col">
|
|
<!-- Header -->
|
|
<header class="bg-white border-b border-slate-200">
|
|
<div class="max-w-7xl mx-auto px-4">
|
|
<div class="h-16 flex items-center justify-between">
|
|
<%= link_to admin_dashboard_path, class: "flex items-center gap-2" do %>
|
|
<span class="text-xl font-bold tracking-tight text-indigo-600">Sanasto</span>
|
|
<span class="text-xl font-light text-slate-400">Admin</span>
|
|
<% end %>
|
|
|
|
<!-- Desktop Navigation -->
|
|
<nav class="hidden md:flex items-center gap-3">
|
|
<%= link_to "Dashboard", admin_dashboard_path, class: "text-sm font-medium text-slate-600 hover:text-indigo-600 transition" %>
|
|
<%= link_to "Users", admin_users_path, class: "text-sm font-medium text-slate-600 hover:text-indigo-600 transition" %>
|
|
<%= link_to "Invitations", admin_invitations_path, class: "text-sm font-medium text-slate-600 hover:text-indigo-600 transition" %>
|
|
<% requested_count = Entry.requested.count %>
|
|
<% gap = requested_count.zero? ? '' : 'pr-4' %>
|
|
<%= link_to admin_requests_path, class: "text-sm font-medium text-slate-600 hover:text-indigo-600 transition relative #{gap}" do %>
|
|
Requests
|
|
<% if requested_count > 0 %>
|
|
<span class="absolute -top-1 -right-1 bg-red-500 text-white text-xs font-bold rounded-full h-5 w-5 flex items-center justify-center">
|
|
<%= requested_count %>
|
|
</span>
|
|
<% end %>
|
|
<% end %>
|
|
<%= link_to "Back to Site", root_path, class: "text-sm font-medium text-slate-600 hover:text-indigo-600 transition" %>
|
|
<%= button_to "Log Out", logout_path, method: :delete, data: { turbo: false }, form: { style: "display: inline-block;" }, class: "bg-indigo-600 text-white px-4 py-2 rounded-lg text-sm font-semibold hover:bg-indigo-700 transition cursor-pointer" %>
|
|
</nav>
|
|
|
|
<!-- Mobile Navigation -->
|
|
<div class="flex md:hidden items-center gap-3">
|
|
<span class="text-sm text-slate-600">
|
|
<%= current_user.name.split.first %>
|
|
</span>
|
|
<button type="button" id="admin-mobile-menu-button" class="p-2 text-slate-600 hover:text-indigo-600 focus:outline-none">
|
|
<svg class="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
|
<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M4 6h16M4 12h16M4 18h16"/>
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Mobile Menu Dropdown -->
|
|
<div id="admin-mobile-menu" class="hidden md:hidden border-t border-slate-200 py-3">
|
|
<div class="py-2 px-2 border-b border-slate-200 mb-2">
|
|
<span class="text-sm font-medium text-slate-900">
|
|
<%= current_user.name %>
|
|
</span>
|
|
</div>
|
|
|
|
<nav class="flex flex-col space-y-1">
|
|
<%= link_to "Dashboard", admin_dashboard_path, class: "px-2 py-2 text-sm font-medium text-slate-700 hover:bg-slate-50 rounded transition" %>
|
|
<%= link_to "Users", admin_users_path, class: "px-2 py-2 text-sm font-medium text-slate-700 hover:bg-slate-50 rounded transition" %>
|
|
<%= link_to "Invitations", admin_invitations_path, class: "px-2 py-2 text-sm font-medium text-slate-700 hover:bg-slate-50 rounded transition" %>
|
|
<% requested_count = Entry.requested.count %>
|
|
<%= link_to admin_requests_path, class: "px-2 py-2 text-sm font-medium text-slate-700 hover:bg-slate-50 rounded transition flex items-center justify-between" do %>
|
|
<span>Requests</span>
|
|
<% if requested_count > 0 %>
|
|
<span class="bg-red-500 text-white text-xs font-bold rounded-full h-5 w-5 flex items-center justify-center">
|
|
<%= requested_count %>
|
|
</span>
|
|
<% end %>
|
|
<% end %>
|
|
<%= link_to "Back to Site", root_path, class: "px-2 py-2 text-sm font-medium text-slate-700 hover:bg-slate-50 rounded transition" %>
|
|
<%= button_to "Log Out", logout_path, method: :delete, data: { turbo: false }, form: { class: "w-full" }, class: "w-full text-left px-2 py-2 text-sm font-medium text-red-600 hover:bg-red-50 rounded transition cursor-pointer" %>
|
|
</nav>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
<script>
|
|
function setupAdminMobileMenu() {
|
|
const menuButton = document.getElementById('admin-mobile-menu-button');
|
|
const mobileMenu = document.getElementById('admin-mobile-menu');
|
|
|
|
if (menuButton && mobileMenu) {
|
|
// Remove existing listeners to avoid duplicates
|
|
const newMenuButton = menuButton.cloneNode(true);
|
|
menuButton.parentNode.replaceChild(newMenuButton, menuButton);
|
|
|
|
newMenuButton.addEventListener('click', function(e) {
|
|
e.stopPropagation();
|
|
mobileMenu.classList.toggle('hidden');
|
|
});
|
|
|
|
// Close menu when clicking outside
|
|
document.addEventListener('click', function(event) {
|
|
const isClickInside = newMenuButton.contains(event.target) || mobileMenu.contains(event.target);
|
|
if (!isClickInside && !mobileMenu.classList.contains('hidden')) {
|
|
mobileMenu.classList.add('hidden');
|
|
}
|
|
});
|
|
|
|
// Close menu when navigating with Turbo
|
|
document.addEventListener('turbo:click', function() {
|
|
if (mobileMenu && !mobileMenu.classList.contains('hidden')) {
|
|
mobileMenu.classList.add('hidden');
|
|
}
|
|
});
|
|
}
|
|
}
|
|
|
|
// Run on initial load and on Turbo navigation
|
|
document.addEventListener('DOMContentLoaded', setupAdminMobileMenu);
|
|
document.addEventListener('turbo:load', setupAdminMobileMenu);
|
|
</script>
|
|
|
|
<%= render "shared/notifications" %>
|
|
|
|
<!-- Main content -->
|
|
<main class="flex-1 max-w-7xl w-full mx-auto px-4 py-8">
|
|
<%= yield %>
|
|
</main>
|
|
</div>
|
|
</body>
|
|
</html>
|