fix accessibility issues
This commit is contained in:
parent
d02461f8ea
commit
918b02a714
6 changed files with 86 additions and 78 deletions
|
|
@ -232,61 +232,64 @@ defmodule MvWeb.LinkOidcAccountLive do
|
|||
~H"""
|
||||
<div class="mx-auto max-w-sm mt-16">
|
||||
<%!-- Language Selector --%>
|
||||
<div class="flex justify-center mb-4">
|
||||
<nav aria-label={dgettext("auth", "Language selection")} class="flex justify-center mb-4">
|
||||
<form method="post" action="/set_locale" class="text-sm">
|
||||
<input type="hidden" name="_csrf_token" value={Plug.CSRFProtection.get_csrf_token()} />
|
||||
<select
|
||||
name="locale"
|
||||
onchange="this.form.submit()"
|
||||
class="select select-sm select-bordered"
|
||||
aria-label={dgettext("auth", "Select language")}
|
||||
>
|
||||
<option value="de" selected={Gettext.get_locale() == "de"}>🇩🇪 Deutsch</option>
|
||||
<option value="en" selected={Gettext.get_locale() == "en"}>🇬🇧 English</option>
|
||||
</select>
|
||||
</form>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<.header class="text-center">
|
||||
{dgettext("auth", "Link OIDC Account")}
|
||||
<:subtitle>
|
||||
{dgettext(
|
||||
"auth",
|
||||
"An account with email %{email} already exists. Please enter your password to link your OIDC account.",
|
||||
email: @user.email
|
||||
)}
|
||||
</:subtitle>
|
||||
</.header>
|
||||
<main>
|
||||
<.header class="text-center">
|
||||
{dgettext("auth", "Link OIDC Account")}
|
||||
<:subtitle>
|
||||
{dgettext(
|
||||
"auth",
|
||||
"An account with email %{email} already exists. Please enter your password to link your OIDC account.",
|
||||
email: @user.email
|
||||
)}
|
||||
</:subtitle>
|
||||
</.header>
|
||||
|
||||
<.form for={@form} id="link-oidc-form" phx-submit="submit" phx-change="validate" class="mt-8">
|
||||
<div class="space-y-6">
|
||||
<div>
|
||||
<.input
|
||||
field={@form[:password]}
|
||||
type="password"
|
||||
label={dgettext("auth", "Password")}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
|
||||
<%= if @error do %>
|
||||
<div class="rounded-md bg-red-50 p-4">
|
||||
<p class="text-sm text-red-800">{@error}</p>
|
||||
<.form for={@form} id="link-oidc-form" phx-submit="submit" phx-change="validate" class="mt-8">
|
||||
<div class="space-y-6">
|
||||
<div>
|
||||
<.input
|
||||
field={@form[:password]}
|
||||
type="password"
|
||||
label={dgettext("auth", "Password")}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<div>
|
||||
<.button phx-disable-with={dgettext("auth", "Linking...")} class="w-full">
|
||||
{dgettext("auth", "Link Account")}
|
||||
</.button>
|
||||
<%= if @error do %>
|
||||
<div class="rounded-md bg-red-50 p-4">
|
||||
<p class="text-sm text-red-800">{@error}</p>
|
||||
</div>
|
||||
<% end %>
|
||||
|
||||
<div>
|
||||
<.button phx-disable-with={dgettext("auth", "Linking...")} class="w-full">
|
||||
{dgettext("auth", "Link Account")}
|
||||
</.button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</.form>
|
||||
</.form>
|
||||
|
||||
<div class="mt-4 text-center text-sm">
|
||||
<.link navigate={~p"/sign-in"} class="text-brand hover:underline">
|
||||
{dgettext("auth", "Cancel")}
|
||||
</.link>
|
||||
</div>
|
||||
<div class="mt-4 text-center text-sm">
|
||||
<.link navigate={~p"/sign-in"} class="text-brand hover:underline">
|
||||
{dgettext("auth", "Cancel")}
|
||||
</.link>
|
||||
</div>
|
||||
</main>
|
||||
</div>
|
||||
"""
|
||||
end
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue