exmr/lib/exmr_web/components/layouts/root.html.heex

67 lines
2.3 KiB
Text
Raw Normal View History

2024-11-14 23:33:29 +02:00
<!DOCTYPE html>
<html lang="en" class="[scrollbar-gutter:stable]">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="csrf-token" content={get_csrf_token()} />
<.live_title>
{assigns[:page_title] || "ExMR"}
2024-11-14 23:33:29 +02:00
</.live_title>
<link phx-track-static rel="stylesheet" href={~p"/assets/app.css"} />
2024-12-01 18:31:23 +02:00
<script>
if (localStorage.getItem('theme') === 'dark' || (!('theme' in localStorage) && window.matchMedia('(prefers-color-scheme: dark)').matches)) {
document.documentElement.classList.add('dark');
} else {
document.documentElement.classList.remove('dark')
}
</script>
2024-11-14 23:33:29 +02:00
<script defer phx-track-static type="text/javascript" src={~p"/assets/app.js"}>
</script>
</head>
2024-12-01 18:31:23 +02:00
<body class="bg-white dark:bg-zinc-950 dark:text-zinc-100">
2024-11-14 23:33:29 +02:00
<ul class="relative z-10 flex items-center gap-4 px-4 sm:px-6 lg:px-8 justify-end">
2024-12-01 18:31:23 +02:00
<DarkMode.button />
2024-11-14 23:33:29 +02:00
<%= if @current_user do %>
2024-12-01 18:31:23 +02:00
<li class="text-[0.8125rem] leading-6 text-zinc-900 dark:text-zinc-300">
2024-12-12 18:52:36 +02:00
{@current_user.email}
2024-11-14 23:33:29 +02:00
</li>
<li>
<.link
href={~p"/users/settings"}
2024-12-01 18:31:23 +02:00
class="text-[0.8125rem] leading-6 text-zinc-900 font-semibold hover:text-zinc-700 dark:text-zinc-300 dark:hover:text-zinc-100"
2024-11-14 23:33:29 +02:00
>
2024-12-12 18:52:36 +02:00
{gettext("Settings")}
2024-11-14 23:33:29 +02:00
</.link>
</li>
<li>
<.link
href={~p"/users/log_out"}
method="delete"
2024-12-01 18:31:23 +02:00
class="text-[0.8125rem] leading-6 text-zinc-900 font-semibold hover:text-zinc-700 dark:text-zinc-300 dark:hover:text-zinc-100"
2024-11-14 23:33:29 +02:00
>
2024-12-12 18:52:36 +02:00
{gettext("Log out")}
2024-11-14 23:33:29 +02:00
</.link>
</li>
<% else %>
<li>
<.link
href={~p"/users/register"}
2024-12-01 18:31:23 +02:00
class="text-[0.8125rem] leading-6 text-zinc-900 font-semibold hover:text-zinc-700 dark:text-zinc-300 dark:hover:text-zinc-100"
2024-11-14 23:33:29 +02:00
>
{gettext("Register")}
2024-11-14 23:33:29 +02:00
</.link>
</li>
<li>
<.link
href={~p"/users/log_in"}
2024-12-01 18:31:23 +02:00
class="text-[0.8125rem] leading-6 text-zinc-900 font-semibold hover:text-zinc-700 dark:text-zinc-300 dark:hover:text-zinc-100"
2024-11-14 23:33:29 +02:00
>
{gettext("Log in")}
2024-11-14 23:33:29 +02:00
</.link>
</li>
<% end %>
</ul>
2024-12-12 18:52:36 +02:00
{@inner_content}
2024-11-14 23:33:29 +02:00
</body>
</html>