jason
60 lines
4.4 KiB
Plaintext
60 lines
4.4 KiB
Plaintext
<aside class="fixed inset-y-0 left-0 w-56 bg-surface-900 border-r border-gray-800 flex flex-col z-20">
|
|
<!-- Brand -->
|
|
<div class="flex items-center gap-3 px-5 py-5 border-b border-gray-800">
|
|
<% if (brand.brand_logo_path) { %>
|
|
<img src="/brand/logo" alt="<%= brand.brand_name %>" class="h-7 w-auto object-contain" />
|
|
<% } else { %>
|
|
<div class="h-7 w-7 rounded-md btn-accent flex items-center justify-center shrink-0">
|
|
<svg class="w-4 h-4 text-white" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="M21 7.5l-9-5.25L3 7.5m18 0l-9 5.25m9-5.25v9l-9 5.25M3 7.5l9 5.25M3 7.5v9l9 5.25m0-9v9" />
|
|
</svg>
|
|
</div>
|
|
<% } %>
|
|
<div class="overflow-hidden">
|
|
<p class="text-sm font-semibold text-white truncate"><%= brand.brand_name %></p>
|
|
<p class="text-xs text-gray-500 truncate">Admin</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Nav links -->
|
|
<nav class="flex-1 py-4 px-3 space-y-1 overflow-y-auto">
|
|
<%
|
|
const navItems = [
|
|
{ href: '/admin', label: 'Models', icon: 'cube' },
|
|
{ href: '/admin/upload', label: 'Upload', icon: 'upload' },
|
|
{ href: '/admin/categories', label: 'Categories', icon: 'folder' },
|
|
{ href: '/admin/settings', label: 'Settings', icon: 'settings' },
|
|
]
|
|
const icons = {
|
|
cube: '<path stroke-linecap="round" stroke-linejoin="round" d="M21 7.5l-9-5.25L3 7.5m18 0l-9 5.25m9-5.25v9l-9 5.25M3 7.5l9 5.25M3 7.5v9l9 5.25m0-9v9" />',
|
|
upload: '<path stroke-linecap="round" stroke-linejoin="round" d="M3 16.5v2.25A2.25 2.25 0 005.25 21h13.5A2.25 2.25 0 0021 18.75V16.5m-13.5-9L12 3m0 0l4.5 4.5M12 3v13.5" />',
|
|
folder: '<path stroke-linecap="round" stroke-linejoin="round" d="M2.25 12.75V12A2.25 2.25 0 014.5 9.75h15A2.25 2.25 0 0121.75 12v.75m-8.69-6.44l-2.12-2.12a1.5 1.5 0 00-1.061-.44H4.5A2.25 2.25 0 002.25 6v12a2.25 2.25 0 002.25 2.25h15A2.25 2.25 0 0021.75 18V9a2.25 2.25 0 00-2.25-2.25h-5.379a1.5 1.5 0 01-1.06-.44z" />',
|
|
settings: '<path stroke-linecap="round" stroke-linejoin="round" d="M9.594 3.94c.09-.542.56-.94 1.11-.94h2.593c.55 0 1.02.398 1.11.94l.213 1.281c.063.374.313.686.645.87.074.04.147.083.22.127.325.196.72.257 1.075.124l1.217-.456a1.125 1.125 0 011.37.49l1.296 2.247a1.125 1.125 0 01-.26 1.431l-1.003.827c-.293.241-.438.613-.43.992a7.723 7.723 0 010 .255c-.008.378.137.75.43.991l1.004.827c.424.35.534.955.26 1.43l-1.298 2.247a1.125 1.125 0 01-1.369.491l-1.217-.456c-.355-.133-.75-.072-1.076.124a6.47 6.47 0 01-.22.128c-.331.183-.581.495-.644.869l-.213 1.281c-.09.543-.56.94-1.11.94h-2.594c-.55 0-1.019-.398-1.11-.94l-.213-1.281c-.062-.374-.312-.686-.644-.87a6.52 6.52 0 01-.22-.127c-.325-.196-.72-.257-1.076-.124l-1.217.456a1.125 1.125 0 01-1.369-.49l-1.297-2.247a1.125 1.125 0 01.26-1.431l1.004-.827c.292-.24.437-.613.43-.991a6.932 6.932 0 010-.255c.007-.38-.138-.751-.43-.992l-1.004-.827a1.125 1.125 0 01-.26-1.43l1.297-2.247a1.125 1.125 0 011.37-.491l1.216.456c.356.133.751.072 1.076-.124.072-.044.146-.086.22-.128.332-.183.582-.495.644-.869l.214-1.28z" /><path stroke-linecap="round" stroke-linejoin="round" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z" />',
|
|
}
|
|
%>
|
|
<% navItems.forEach(item => {
|
|
const active = currentPath && (currentPath === item.href || (item.href !== '/admin' && currentPath.startsWith(item.href)))
|
|
%>
|
|
<a href="<%= item.href %>"
|
|
class="flex items-center gap-3 px-3 py-2 rounded-lg text-sm transition-colors <%= active ? 'btn-accent text-white font-medium' : 'text-gray-400 hover:text-white hover:bg-surface-800' %>">
|
|
<svg class="w-4 h-4 shrink-0" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.75">
|
|
<%- icons[item.icon] %>
|
|
</svg>
|
|
<%= item.label %>
|
|
</a>
|
|
<% }) %>
|
|
</nav>
|
|
|
|
<!-- Logout -->
|
|
<div class="p-3 border-t border-gray-800">
|
|
<form method="POST" action="/admin/logout">
|
|
<button type="submit" class="w-full flex items-center gap-3 px-3 py-2 rounded-lg text-sm text-gray-400 hover:text-white hover:bg-surface-800 transition-colors">
|
|
<svg class="w-4 h-4 shrink-0" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="1.75">
|
|
<path stroke-linecap="round" stroke-linejoin="round" d="M15.75 9V5.25A2.25 2.25 0 0013.5 3h-6a2.25 2.25 0 00-2.25 2.25v13.5A2.25 2.25 0 007.5 21h6a2.25 2.25 0 002.25-2.25V15M12 9l-3 3m0 0l3 3m-3-3h12.75" />
|
|
</svg>
|
|
Sign out
|
|
</button>
|
|
</form>
|
|
</div>
|
|
</aside>
|