feat(member): bring the overview table up to WCAG 2.2 AA

This commit is contained in:
Simon 2026-07-06 10:49:10 +02:00
parent 0c375234c8
commit c2cb3edab8
6 changed files with 91 additions and 39 deletions

View file

@ -1093,12 +1093,17 @@ defmodule MvWeb.CoreComponents do
<tr
:for={row <- @rows}
id={@row_id && @row_id.(row)}
class={[
table_row_tr_class(
table_row_selected?(assigns, row),
@sticky_first_col
)
]}
class={
[
table_row_tr_class(
table_row_selected?(assigns, row),
@sticky_first_col
),
# WCAG 2.4.11: keep a keyboard-focused row from being hidden under
# the sticky header by reserving header-height scroll margin.
@sticky_header && "scroll-mt-16"
]
}
data-row-interactive={@row_click && "true"}
data-selected={table_row_selected?(assigns, row) && "true"}
title={@row_click && @row_tooltip}
@ -1178,19 +1183,49 @@ defmodule MvWeb.CoreComponents do
<td
:for={dyn_col <- @dynamic_cols}
phx-click={@row_click && @row_click.(row)}
class={["max-w-xs truncate", @row_click && "hover:cursor-pointer"]}
class={[
"max-w-xs",
dyn_col[:custom_field].value_type != :boolean && "truncate",
@row_click && "hover:cursor-pointer"
]}
>
{if dyn_col[:render] do
rendered = dyn_col[:render].(@row_item.(row))
<%= if dyn_col[:custom_field].value_type == :boolean do %>
<% val = dyn_col[:render] && dyn_col[:render].(@row_item.(row)) %>
<%= cond do %>
<% val == true -> %>
<div class="flex justify-center">
<.icon
name="hero-check-circle"
class="size-4 text-success"
aria-hidden="true"
/>
<span class="sr-only">{gettext("Yes")}</span>
</div>
<% val == false -> %>
<div class="flex justify-center">
<.icon
name="hero-x-circle"
class="size-4 text-error"
aria-hidden="true"
/>
<span class="sr-only">{gettext("No")}</span>
</div>
<% true -> %>
<.empty_cell sr_text={gettext("Not specified")} />
<% end %>
<% else %>
{if dyn_col[:render] do
rendered = dyn_col[:render].(@row_item.(row))
if rendered == "" do
""
if rendered == "" do
""
else
rendered
end
else
rendered
end
else
""
end}
""
end}
<% end %>
</td>
<td :if={@action != []} class="w-0 font-semibold">
<div class="flex gap-4">

View file

@ -767,8 +767,15 @@ defmodule MvWeb.MemberLive.Index do
custom_field: custom_field,
render: fn member ->
case get_custom_field_value(member, custom_field) do
nil -> ""
cfv -> Formatter.format_custom_field_value(cfv.value, custom_field)
nil ->
""
cfv ->
if custom_field.value_type == :boolean do
extract_boolean_value(cfv.value)
else
Formatter.format_custom_field_value(cfv.value, custom_field)
end
end
end
}