mirror of
https://github.com/livebook-dev/livebook.git
synced 2025-10-28 22:37:32 +08:00
72 lines
2.5 KiB
Text
72 lines
2.5 KiB
Text
<div class="h-screen w-full px-4 py-8 bg-gray-900 flex justify-center items-center">
|
|
<div class="max-w-[400px] w-full flex flex-col">
|
|
<a href={~p"/"} class="mb-2 -ml-2">
|
|
<img src={~p"/images/logo.png"} height="96" width="96" alt="livebook" />
|
|
</a>
|
|
<div class="mb-2 text-xl text-gray-100 font-medium">
|
|
Authentication required
|
|
</div>
|
|
|
|
<div class="mb-8 text-sm text-gray-200 space-y-2">
|
|
<p :if={@authentication_mode == :password}>
|
|
Type password to access the Livebook.
|
|
</p>
|
|
<p :if={@authentication_mode == :token}>
|
|
Please check out the console for authentication URL or type the token directly
|
|
here.
|
|
</p>
|
|
<p :if={@authentication_mode == :token}>
|
|
To use password authentication, set the <code>LIVEBOOK_PASSWORD</code>
|
|
environment variable.
|
|
</p>
|
|
</div>
|
|
|
|
<div class="text-gray-50 w-full">
|
|
<form method="post" class="flex flex-col w-full">
|
|
<input type="hidden" value={Phoenix.Controller.get_csrf_token()} name="_csrf_token" />
|
|
<div>
|
|
<input
|
|
:if={@authentication_mode == :password}
|
|
type="password"
|
|
name="password"
|
|
class={[
|
|
"px-4 py-2 w-full border rounded-lg bg-transparent",
|
|
if @errors == [] do
|
|
"border-gray-500 text-gray-300 placeholder-gray-400"
|
|
else
|
|
"border-red-600 text-red-600 placeholder-red-600"
|
|
end
|
|
]}
|
|
placeholder="Password"
|
|
autofocus
|
|
/>
|
|
<input
|
|
:if={@authentication_mode == :token}
|
|
type="text"
|
|
name="token"
|
|
class={[
|
|
"px-4 py-2 w-full border rounded-lg bg-transparent",
|
|
if @errors == [] do
|
|
"border-gray-500 text-gray-300 placeholder-gray-400"
|
|
else
|
|
"border-red-600 text-red-600 placeholder-red-600"
|
|
end
|
|
]}
|
|
placeholder="Token"
|
|
autofocus
|
|
/>
|
|
<span :for={error <- @errors} class="mt-1 text-red-600 text-sm">
|
|
<%= translate_error(error) %>
|
|
</span>
|
|
</div>
|
|
<button
|
|
type="submit"
|
|
class="mt-4 py-2 w-full rounded-lg text-gray-200 bg-blue-600 hover:bg-blue-700 focus:bg-blue-700"
|
|
>
|
|
<span>Authenticate</span>
|
|
<.remix_icon icon="arrow-right-line" class="ml-1 align-middle" />
|
|
</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|