Mark required fields in UI
All checks were successful
continuous-integration/drone/push Build is passing

This commit is contained in:
Rafael Epplée 2025-12-02 09:56:54 +01:00
parent e803dbdf8b
commit 56173d423b
No known key found for this signature in database
GPG key ID: B4EFE6DC59FAE118
5 changed files with 86 additions and 30 deletions

View file

@ -56,7 +56,7 @@ defmodule MvWeb.CoreComponents do
id={@id}
phx-click={JS.push("lv:clear-flash", value: %{key: @kind}) |> hide("##{@id}")}
role="alert"
class="toast toast-top toast-end z-50"
class="z-50 toast toast-top toast-end"
{@rest}
>
<div class={[
@ -71,7 +71,7 @@ defmodule MvWeb.CoreComponents do
<p>{msg}</p>
</div>
<div class="flex-1" />
<button type="button" class="group self-start cursor-pointer" aria-label={gettext("close")}>
<button type="button" class="self-start cursor-pointer group" aria-label={gettext("close")}>
<.icon name="hero-x-mark" class="size-5 opacity-40 group-hover:opacity-70" />
</button>
</div>
@ -180,7 +180,7 @@ defmodule MvWeb.CoreComponents do
end)
~H"""
<fieldset class="fieldset mb-2">
<fieldset class="mb-2 fieldset">
<label>
<input type="hidden" name={@name} value="false" disabled={@rest[:disabled]} />
<span class="label">
@ -192,7 +192,11 @@ defmodule MvWeb.CoreComponents do
checked={@checked}
class={@class || "checkbox checkbox-sm"}
{@rest}
/>{@label}
/>{@label}<span
:if={@rest[:required]}
class="text-red-700 tooltip tooltip-right"
data-tip={gettext("This field cannot be empty")}
>*</span>
</span>
</label>
<.error :for={msg <- @errors}>{msg}</.error>
@ -202,9 +206,15 @@ defmodule MvWeb.CoreComponents do
def input(%{type: "select"} = assigns) do
~H"""
<fieldset class="fieldset mb-2">
<fieldset class="mb-2 fieldset">
<label>
<span :if={@label} class="label mb-1">{@label}</span>
<span :if={@label} class="mb-1 label">
{@label}<span
:if={@rest[:required]}
class="text-red-700 tooltip tooltip-right"
data-tip={gettext("This field cannot be empty")}
>*</span>
</span>
<select
id={@id}
name={@name}
@ -223,9 +233,15 @@ defmodule MvWeb.CoreComponents do
def input(%{type: "textarea"} = assigns) do
~H"""
<fieldset class="fieldset mb-2">
<fieldset class="mb-2 fieldset">
<label>
<span :if={@label} class="label mb-1">{@label}</span>
<span :if={@label} class="mb-1 label">
{@label}<span
:if={@rest[:required]}
class="text-red-700 tooltip tooltip-right"
data-tip={gettext("This field cannot be empty")}
>*</span>
</span>
<textarea
id={@id}
name={@name}
@ -244,9 +260,15 @@ defmodule MvWeb.CoreComponents do
# All other inputs text, datetime-local, url, password, etc. are handled here...
def input(assigns) do
~H"""
<fieldset class="fieldset mb-2">
<fieldset class="mb-2 fieldset">
<label>
<span :if={@label} class="label mb-1">{@label}</span>
<span :if={@label} class="mb-1 label">
{@label}<span
:if={@rest[:required]}
class="text-red-700 tooltip tooltip-right"
data-tip={gettext("This field cannot be empty")}
>*</span>
</span>
<input
type={@type}
name={@name}
@ -517,7 +539,7 @@ defmodule MvWeb.CoreComponents do
<div class="mt-14">
<dl class="-my-4 divide-y divide-zinc-100">
<div :for={{name, value} <- @items} class="flex gap-4 py-4 text-sm leading-6 sm:gap-8">
<dt class="w-1/4 flex-none text-zinc-500">{name}</dt>
<dt class="flex-none w-1/4 text-zinc-500">{name}</dt>
<dd class="text-zinc-700">{value}</dd>
</div>
</dl>

View file

@ -37,7 +37,7 @@ defmodule MvWeb.MemberLive.Form do
<.header>
{@page_title}
<:subtitle>
{gettext("Use this form to manage member records and their properties.")}
{gettext("Fields marked with an asterisk (*) cannot be empty.")}
</:subtitle>
</.header>

View file

@ -10,7 +10,7 @@ msgid ""
msgstr ""
"Language: en\n"
#: lib/mv_web/components/core_components.ex:356
#: lib/mv_web/components/core_components.ex:378
#, elixir-autogen, elixir-format
msgid "Actions"
msgstr "Aktionen"
@ -174,11 +174,6 @@ msgstr "Speichern..."
msgid "Street"
msgstr "Straße"
#: lib/mv_web/live/member_live/form.ex:40
#, elixir-autogen, elixir-format
msgid "Use this form to manage member records and their properties."
msgstr "Dieses Formular dient zur Verwaltung von Mitgliedern und deren Eigenschaften."
#: lib/mv_web/live/member_live/show.ex:47
#, elixir-autogen, elixir-format
msgid "Id"
@ -782,7 +777,25 @@ msgstr "Mitglied entverknüpfen"
msgid "Unlinking scheduled"
msgstr "Entverknüpfung geplant"
#: lib/mv_web/live/member_live/form.ex:40
#, elixir-autogen, elixir-format
msgid "Fields marked with an asterisk (*) cannot be empty."
msgstr "Felder, die mit einem Sternchen (*) markiert sind, dürfen nicht leer bleiben."
#: lib/mv_web/components/core_components.ex:198
#: lib/mv_web/components/core_components.ex:215
#: lib/mv_web/components/core_components.ex:242
#: lib/mv_web/components/core_components.ex:269
#, elixir-autogen, elixir-format, fuzzy
msgid "This field cannot be empty"
msgstr "Dieses Feld darf nicht leer bleiben"
#~ #: lib/mv_web/live/custom_field_live/index.ex:97
#~ #, elixir-autogen, elixir-format
#~ msgid "To confirm deletion, please enter the custom field slug:"
#~ msgstr "Um die Löschung zu bestätigen, gib bitte den Slug des benutzerdefinierten Feldes ein:"
#~ #: lib/mv_web/live/member_live/form.ex:40
#~ #, elixir-autogen, elixir-format
#~ msgid "Use this form to manage member records and their properties."
#~ msgstr "Dieses Formular dient zur Verwaltung von Mitgliedern und deren Eigenschaften."

View file

@ -11,7 +11,7 @@
msgid ""
msgstr ""
#: lib/mv_web/components/core_components.ex:356
#: lib/mv_web/components/core_components.ex:378
#, elixir-autogen, elixir-format
msgid "Actions"
msgstr ""
@ -175,11 +175,6 @@ msgstr ""
msgid "Street"
msgstr ""
#: lib/mv_web/live/member_live/form.ex:40
#, elixir-autogen, elixir-format
msgid "Use this form to manage member records and their properties."
msgstr ""
#: lib/mv_web/live/member_live/show.ex:47
#, elixir-autogen, elixir-format
msgid "Id"
@ -782,3 +777,16 @@ msgstr ""
#, elixir-autogen, elixir-format
msgid "Unlinking scheduled"
msgstr ""
#: lib/mv_web/live/member_live/form.ex:40
#, elixir-autogen, elixir-format
msgid "Fields marked with an asterisk (*) cannot be empty."
msgstr ""
#: lib/mv_web/components/core_components.ex:198
#: lib/mv_web/components/core_components.ex:215
#: lib/mv_web/components/core_components.ex:242
#: lib/mv_web/components/core_components.ex:269
#, elixir-autogen, elixir-format
msgid "This field cannot be empty"
msgstr ""

View file

@ -11,7 +11,7 @@ msgstr ""
"Language: en\n"
"Plural-Forms: nplurals=2; plural=(n != 1);\n"
#: lib/mv_web/components/core_components.ex:356
#: lib/mv_web/components/core_components.ex:378
#, elixir-autogen, elixir-format
msgid "Actions"
msgstr ""
@ -175,11 +175,6 @@ msgstr ""
msgid "Street"
msgstr ""
#: lib/mv_web/live/member_live/form.ex:40
#, elixir-autogen, elixir-format
msgid "Use this form to manage member records and their properties."
msgstr ""
#: lib/mv_web/live/member_live/show.ex:47
#, elixir-autogen, elixir-format
msgid "Id"
@ -783,7 +778,25 @@ msgstr ""
msgid "Unlinking scheduled"
msgstr ""
#: lib/mv_web/live/member_live/form.ex:40
#, elixir-autogen, elixir-format
msgid "Fields marked with an asterisk (*) cannot be empty."
msgstr ""
#: lib/mv_web/components/core_components.ex:198
#: lib/mv_web/components/core_components.ex:215
#: lib/mv_web/components/core_components.ex:242
#: lib/mv_web/components/core_components.ex:269
#, elixir-autogen, elixir-format, fuzzy
msgid "This field cannot be empty"
msgstr ""
#~ #: lib/mv_web/live/custom_field_live/index.ex:97
#~ #, elixir-autogen, elixir-format
#~ msgid "To confirm deletion, please enter the custom field slug:"
#~ msgstr ""
#~ #: lib/mv_web/live/member_live/form.ex:40
#~ #, elixir-autogen, elixir-format
#~ msgid "Use this form to manage member records and their properties."
#~ msgstr ""