Redesign member view/edit UI with improved accessibility
All checks were successful
continuous-integration/drone/push Build is passing

- Group fields into Personal Data, Custom Fields, and Payment Data sections
- Fix WCAG AA contrast issues and semantic HTML (dt/dd in dl)
- Format mailto links with member name in href attribute
This commit is contained in:
Moritz 2025-12-03 13:34:44 +01:00
parent a143c4e243
commit 710cd3538f
Signed by: moritz
GPG key ID: 1020A035E5DD0824
5 changed files with 950 additions and 307 deletions

View file

@ -28,9 +28,8 @@ msgstr ""
msgid "Attempting to reconnect"
msgstr ""
#: lib/mv_web/live/member_live/form.ex:53
#: lib/mv_web/live/member_live/form.ex:100
#: lib/mv_web/live/member_live/index.html.heex:179
#: lib/mv_web/live/member_live/show.ex:58
#, elixir-autogen, elixir-format
msgid "City"
msgstr ""
@ -41,6 +40,7 @@ msgstr ""
msgid "Delete"
msgstr ""
#: lib/mv_web/live/member_live/form.ex:241
#: lib/mv_web/live/member_live/index.html.heex:237
#: lib/mv_web/live/user_live/form.ex:265
#: lib/mv_web/live/user_live/index.html.heex:66
@ -48,15 +48,15 @@ msgstr ""
msgid "Edit"
msgstr ""
#: lib/mv_web/live/member_live/show.ex:41
#: lib/mv_web/live/member_live/show.ex:116
#: lib/mv_web/live/member_live/show.ex:40
#: lib/mv_web/live/member_live/show.ex:197
#, elixir-autogen, elixir-format
msgid "Edit Member"
msgstr ""
#: lib/mv_web/live/member_live/form.ex:47
#: lib/mv_web/live/member_live/form.ex:106
#: lib/mv_web/live/member_live/index.html.heex:107
#: lib/mv_web/live/member_live/show.ex:50
#: lib/mv_web/live/member_live/show.ex:75
#: lib/mv_web/live/user_live/form.ex:46
#: lib/mv_web/live/user_live/index.html.heex:44
#: lib/mv_web/live/user_live/show.ex:50
@ -64,25 +64,26 @@ msgstr ""
msgid "Email"
msgstr ""
#: lib/mv_web/live/member_live/form.ex:45
#: lib/mv_web/live/member_live/show.ex:48
#: lib/mv_web/live/member_live/form.ex:81
#: lib/mv_web/live/member_live/show.ex:64
#, elixir-autogen, elixir-format
msgid "First Name"
msgstr ""
#: lib/mv_web/live/member_live/form.ex:50
#: lib/mv_web/live/member_live/form.ex:117
#: lib/mv_web/live/member_live/index.html.heex:215
#: lib/mv_web/live/member_live/show.ex:55
#: lib/mv_web/live/member_live/show.ex:93
#, elixir-autogen, elixir-format
msgid "Join Date"
msgstr ""
#: lib/mv_web/live/member_live/form.ex:46
#: lib/mv_web/live/member_live/show.ex:49
#: lib/mv_web/live/member_live/form.ex:84
#: lib/mv_web/live/member_live/show.ex:65
#, elixir-autogen, elixir-format
msgid "Last Name"
msgstr ""
#: lib/mv_web/live/member_live/form.ex:44
#: lib/mv_web/live/member_live/index.html.heex:24
#, elixir-autogen, elixir-format
msgid "New Member"
@ -109,49 +110,45 @@ msgstr ""
msgid "close"
msgstr ""
#: lib/mv_web/live/member_live/form.ex:51
#: lib/mv_web/live/member_live/show.ex:56
#: lib/mv_web/live/member_live/form.ex:120
#: lib/mv_web/live/member_live/show.ex:98
#, elixir-autogen, elixir-format
msgid "Exit Date"
msgstr ""
#: lib/mv_web/live/member_live/form.ex:55
#: lib/mv_web/live/member_live/index.html.heex:143
#: lib/mv_web/live/member_live/show.ex:60
#, elixir-autogen, elixir-format
msgid "House Number"
msgstr ""
#: lib/mv_web/live/member_live/form.ex:52
#: lib/mv_web/live/member_live/show.ex:57
#: lib/mv_web/live/member_live/form.ex:126
#: lib/mv_web/live/member_live/show.ex:124
#, elixir-autogen, elixir-format
msgid "Notes"
msgstr ""
#: lib/mv_web/live/components/payment_filter_component.ex:94
#: lib/mv_web/live/components/payment_filter_component.ex:144
#: lib/mv_web/live/member_live/form.ex:48
#: lib/mv_web/live/member_live/form.ex:199
#: lib/mv_web/live/member_live/index.html.heex:224
#: lib/mv_web/live/member_live/show.ex:51
#: lib/mv_web/live/member_live/show.ex:162
#: lib/mv_web/live/member_live/show.ex:164
#, elixir-autogen, elixir-format
msgid "Paid"
msgstr ""
#: lib/mv_web/live/member_live/form.ex:49
#: lib/mv_web/live/member_live/index.html.heex:197
#: lib/mv_web/live/member_live/show.ex:54
#, elixir-autogen, elixir-format
msgid "Phone Number"
msgstr ""
#: lib/mv_web/live/member_live/form.ex:56
#: lib/mv_web/live/member_live/form.ex:97
#: lib/mv_web/live/member_live/index.html.heex:161
#: lib/mv_web/live/member_live/show.ex:61
#, elixir-autogen, elixir-format
msgid "Postal Code"
msgstr ""
#: lib/mv_web/live/member_live/form.ex:79
#: lib/mv_web/live/member_live/form.ex:211
#, elixir-autogen, elixir-format, fuzzy
msgid "Save Member"
msgstr ""
@ -159,58 +156,48 @@ msgstr ""
#: lib/mv_web/live/custom_field_live/form.ex:66
#: lib/mv_web/live/custom_field_value_live/form.ex:74
#: lib/mv_web/live/global_settings_live.ex:55
#: lib/mv_web/live/member_live/form.ex:78
#: lib/mv_web/live/member_live/form.ex:48
#: lib/mv_web/live/member_live/form.ex:210
#: lib/mv_web/live/user_live/form.ex:248
#, elixir-autogen, elixir-format
msgid "Saving..."
msgstr ""
#: lib/mv_web/live/member_live/form.ex:54
#: lib/mv_web/live/member_live/form.ex:91
#: lib/mv_web/live/member_live/index.html.heex:125
#: lib/mv_web/live/member_live/show.ex:59
#, elixir-autogen, elixir-format
msgid "Street"
msgstr ""
#: lib/mv_web/live/member_live/show.ex:47
#, elixir-autogen, elixir-format
msgid "Id"
msgstr ""
#: lib/mv_web/live/member_live/index.html.heex:229
#: lib/mv_web/live/member_live/index/formatter.ex:61
#: lib/mv_web/live/member_live/show.ex:52
#: lib/mv_web/live/member_live/show.ex:303
#, elixir-autogen, elixir-format
msgid "No"
msgstr ""
#: lib/mv_web/live/member_live/show.ex:115
#: lib/mv_web/live/member_live/show.ex:196
#, elixir-autogen, elixir-format, fuzzy
msgid "Show Member"
msgstr ""
#: lib/mv_web/live/member_live/show.ex:33
#, elixir-autogen, elixir-format
msgid "This is a member record from your database."
msgstr ""
#: lib/mv_web/live/member_live/index.html.heex:229
#: lib/mv_web/live/member_live/index/formatter.ex:60
#: lib/mv_web/live/member_live/show.ex:52
#: lib/mv_web/live/member_live/show.ex:303
#, elixir-autogen, elixir-format
msgid "Yes"
msgstr ""
#: lib/mv_web/live/custom_field_live/form.ex:110
#: lib/mv_web/live/custom_field_value_live/form.ex:233
#: lib/mv_web/live/member_live/form.ex:137
#: lib/mv_web/live/member_live/form.ex:269
#, elixir-autogen, elixir-format
msgid "create"
msgstr ""
#: lib/mv_web/live/custom_field_live/form.ex:111
#: lib/mv_web/live/custom_field_value_live/form.ex:234
#: lib/mv_web/live/member_live/form.ex:138
#: lib/mv_web/live/member_live/form.ex:270
#, elixir-autogen, elixir-format
msgid "update"
msgstr ""
@ -220,7 +207,7 @@ msgstr ""
msgid "Incorrect email or password"
msgstr ""
#: lib/mv_web/live/member_live/form.ex:144
#: lib/mv_web/live/member_live/form.ex:276
#, elixir-autogen, elixir-format
msgid "Member %{action} successfully"
msgstr ""
@ -253,7 +240,7 @@ msgstr ""
#: lib/mv_web/live/custom_field_live/form.ex:69
#: lib/mv_web/live/custom_field_live/index.ex:120
#: lib/mv_web/live/custom_field_value_live/form.ex:77
#: lib/mv_web/live/member_live/form.ex:81
#: lib/mv_web/live/member_live/form.ex:208
#: lib/mv_web/live/user_live/form.ex:251
#, elixir-autogen, elixir-format
msgid "Cancel"
@ -301,6 +288,7 @@ msgid "Listing Users"
msgstr ""
#: lib/mv_web/live/custom_field_value_live/form.ex:60
#: lib/mv_web/live/member_live/form.ex:242
#, elixir-autogen, elixir-format
msgid "Member"
msgstr ""
@ -428,6 +416,7 @@ msgstr ""
msgid "descending"
msgstr ""
#: lib/mv_web/live/member_live/form.ex:241
#: lib/mv_web/live/user_live/form.ex:265
#, elixir-autogen, elixir-format
msgid "New"
@ -510,7 +499,7 @@ msgstr "User will be created without a password. Check 'Set Password' to add one
msgid "Linked Member"
msgstr ""
#: lib/mv_web/live/member_live/show.ex:62
#: lib/mv_web/live/member_live/show.ex:106
#, elixir-autogen, elixir-format
msgid "Linked User"
msgstr ""
@ -521,13 +510,12 @@ msgstr ""
msgid "No member linked"
msgstr ""
#: lib/mv_web/live/member_live/show.ex:72
#: lib/mv_web/live/member_live/show.ex:116
#, elixir-autogen, elixir-format
msgid "No user linked"
msgstr ""
#: lib/mv_web/live/member_live/show.ex:36
#: lib/mv_web/live/member_live/show.ex:38
#: lib/mv_web/live/member_live/show.ex:30
#, elixir-autogen, elixir-format
msgid "Back to members list"
msgstr ""
@ -608,12 +596,6 @@ msgstr ""
msgid "Choose a custom field"
msgstr ""
#: lib/mv_web/live/member_live/form.ex:58
#: lib/mv_web/live/member_live/show.ex:77
#, elixir-autogen, elixir-format
msgid "Custom Field Values"
msgstr ""
#: lib/mv_web/live/custom_field_value_live/form.ex:51
#, elixir-autogen, elixir-format
msgid "Custom field"
@ -650,6 +632,8 @@ msgid "Use this form to manage custom_field records in your database."
msgstr ""
#: lib/mv_web/components/layouts/navbar.ex:26
#: lib/mv_web/live/member_live/form.ex:135
#: lib/mv_web/live/member_live/show.ex:136
#, elixir-autogen, elixir-format, fuzzy
msgid "Custom Fields"
msgstr ""
@ -819,11 +803,6 @@ msgstr ""
msgid "Tip: Paste email addresses into the BCC field for privacy compliance"
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:206
#: lib/mv_web/components/core_components.ex:223
#: lib/mv_web/components/core_components.ex:250
@ -854,8 +833,131 @@ msgstr ""
msgid "Payment filter"
msgstr ""
#: lib/mv_web/live/member_live/show.ex:70
#, elixir-autogen, elixir-format
msgid "Address"
msgstr ""
#: lib/mv_web/live/member_live/form.ex:37
#: lib/mv_web/live/member_live/show.ex:32
#, elixir-autogen, elixir-format
msgid "Back"
msgstr ""
#: lib/mv_web/live/member_live/form.ex:65
#: lib/mv_web/live/member_live/show.ex:50
#, elixir-autogen, elixir-format
msgid "Coming soon"
msgstr ""
#: lib/mv_web/live/member_live/form.ex:57
#: lib/mv_web/live/member_live/show.ex:48
#, elixir-autogen, elixir-format
msgid "Contact Data"
msgstr ""
#: lib/mv_web/live/member_live/form.ex:175
#: lib/mv_web/live/member_live/show.ex:160
#, elixir-autogen, elixir-format
msgid "Contribution"
msgstr ""
#: lib/mv_web/live/member_live/form.ex:94
#, elixir-autogen, elixir-format
msgid "Nr."
msgstr ""
#: lib/mv_web/live/member_live/form.ex:186
#: lib/mv_web/live/member_live/show.ex:161
#, elixir-autogen, elixir-format, fuzzy
msgid "Payment Cycle"
msgstr ""
#: lib/mv_web/live/member_live/form.ex:166
#: lib/mv_web/live/member_live/show.ex:153
#, elixir-autogen, elixir-format
msgid "Payment Data"
msgstr ""
#: lib/mv_web/live/member_live/form.ex:68
#: lib/mv_web/live/member_live/show.ex:52
#, elixir-autogen, elixir-format
msgid "Payments"
msgstr ""
#: lib/mv_web/live/member_live/show.ex:166
#, elixir-autogen, elixir-format, fuzzy
msgid "Pending"
msgstr ""
#: lib/mv_web/live/member_live/form.ex:76
#: lib/mv_web/live/member_live/show.ex:60
#, elixir-autogen, elixir-format
msgid "Personal Data"
msgstr ""
#: lib/mv_web/live/member_live/form.ex:111
#: lib/mv_web/live/member_live/show.ex:87
#, elixir-autogen, elixir-format, fuzzy
msgid "Phone"
msgstr ""
#: lib/mv_web/live/member_live/form.ex:49
#, elixir-autogen, elixir-format, fuzzy
msgid "Save"
msgstr ""
#: lib/mv_web/live/member_live/form.ex:169
#: lib/mv_web/live/member_live/show.ex:156
#, elixir-autogen, elixir-format
msgid "This data is for demonstration purposes only (mockup)."
msgstr ""
#: lib/mv_web/live/member_live/form.ex:190
#: lib/mv_web/live/member_live/show.ex:161
#, elixir-autogen, elixir-format
msgid "monthly"
msgstr ""
#: lib/mv_web/live/member_live/form.ex:194
#, elixir-autogen, elixir-format
msgid "yearly"
msgstr ""
#~ #: lib/mv_web/live/member_live/form.ex:48
#~ #: lib/mv_web/live/member_live/show.ex:51
#~ #, elixir-autogen, elixir-format
#~ msgid "Birth Date"
#~ msgstr ""
#~ #: lib/mv_web/live/member_live/form.ex:58
#~ #: lib/mv_web/live/member_live/show.ex:77
#~ #, elixir-autogen, elixir-format
#~ msgid "Custom Field Values"
#~ 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/live/member_live/form.ex:79
#~ #: lib/mv_web/live/member_live/show.ex:56
#~ #, elixir-autogen, elixir-format
#~ msgid "History"
#~ msgstr ""
#~ #: lib/mv_web/live/member_live/show.ex:47
#~ #, elixir-autogen, elixir-format
#~ msgid "Id"
#~ msgstr ""
#~ #: lib/mv_web/live/member_live/show.ex:161
#~ #, elixir-autogen, elixir-format, fuzzy
#~ msgid "Paid at"
#~ msgstr ""
#~ #: lib/mv_web/live/member_live/show.ex:33
#~ #, elixir-autogen, elixir-format
#~ msgid "This is a member record from your database."
#~ msgstr ""