feat: add navigation and collapsible sidebar to theme editor

- Add "← View Shop" link on admin/theme page for easy navigation
- Add collapsible sidebar with chevron toggle button
- Include proper ARIA attributes for accessibility (aria-label,
  aria-expanded, aria-controls)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
2026-01-19 21:37:34 +00:00
parent 8eda40f175
commit 848c4ea146
3 changed files with 78 additions and 27 deletions

View File

@@ -34,29 +34,36 @@
</script>
</head>
<body>
<ul class="menu menu-horizontal w-full relative z-10 flex items-center gap-4 px-4 sm:px-6 lg:px-8 justify-end">
<%= if @current_scope do %>
<li>
{@current_scope.user.email}
</li>
<li>
<.link href={~p"/admin/theme"}>Theme</.link>
</li>
<li>
<.link href={~p"/users/settings"}>Settings</.link>
</li>
<li>
<.link href={~p"/users/log-out"} method="delete">Log out</.link>
</li>
<% else %>
<li>
<.link href={~p"/users/register"}>Register</.link>
</li>
<li>
<.link href={~p"/users/log-in"}>Log in</.link>
</li>
<% end %>
</ul>
<nav class="w-full relative z-10 flex items-center px-4 sm:px-6 lg:px-8 justify-between">
<div>
<%= if @current_scope && assigns[:conn] && @conn.request_path == "/admin/theme" do %>
<.link href={~p"/"} class="text-sm hover:underline">&larr; View Shop</.link>
<% end %>
</div>
<ul class="menu menu-horizontal flex items-center gap-4">
<%= if @current_scope do %>
<li>
{@current_scope.user.email}
</li>
<li>
<.link href={~p"/admin/theme"}>Theme</.link>
</li>
<li>
<.link href={~p"/users/settings"}>Settings</.link>
</li>
<li>
<.link href={~p"/users/log-out"} method="delete">Log out</.link>
</li>
<% else %>
<li>
<.link href={~p"/users/register"}>Register</.link>
</li>
<li>
<.link href={~p"/users/log-in"}>Log in</.link>
</li>
<% end %>
</ul>
</nav>
{@inner_content}
</body>
</html>