Remove aria-hidden on icons in favor of empty alt text.

This matches better with adding alt text to images, which is probably better than either manually opting out of the accessibility tree or creating some less-compatible implementation.
This commit is contained in:
Nolan Darilek 2021-11-17 09:30:33 -06:00
parent fad37064db
commit 72501c90b4
4 changed files with 8 additions and 7 deletions

View file

@ -96,6 +96,7 @@ defmodule LiveBeatsWeb.LiveHelpers do
assigns assigns
|> assign_new(:outlined, fn -> false end) |> assign_new(:outlined, fn -> false end)
|> assign_new(:class, fn -> "w-4 h-4 inline-block" end) |> assign_new(:class, fn -> "w-4 h-4 inline-block" end)
|> assign_new(:alt, fn -> "" end)
~H""" ~H"""
<%= if @outlined do %> <%= if @outlined do %>

View file

@ -41,7 +41,7 @@ defmodule LiveBeatsWeb.PlayerLive do
redirect_to={profile_path(@profile)} redirect_to={profile_path(@profile)}
class="mx-auto flex outline border-2 border-white border-opacity-20 rounded-md p-1 pr-2" class="mx-auto flex outline border-2 border-white border-opacity-20 rounded-md p-1 pr-2"
> >
<span class="mt-1"><.icon name={:user_circle} aria-hidden="true"/></span> <span class="mt-1"><.icon name={:user_circle}/></span>
<p class="ml-2"><%= @profile.username %></p> <p class="ml-2"><%= @profile.username %></p>
</.link> </.link>
<% else %> <% else %>

View file

@ -13,7 +13,7 @@ defmodule LiveBeatsWeb.SongLive.Index do
<%= @profile.tagline %> <%= if @owns_profile? do %>(you)<% end %> <%= @profile.tagline %> <%= if @owns_profile? do %>(you)<% end %>
</div> </div>
<.link href={@profile.external_homepage_url} _target="blank" class="block text-sm text-gray-600"> <.link href={@profile.external_homepage_url} _target="blank" class="block text-sm text-gray-600">
<.icon name={:code} aria-hidden="true"/> <span class=""><%= url_text(@profile.external_homepage_url) %></span> <.icon name={:code}/> <span class=""><%= url_text(@profile.external_homepage_url) %></span>
</.link> </.link>
</div> </div>
@ -22,18 +22,18 @@ defmodule LiveBeatsWeb.SongLive.Index do
<.button primary <.button primary
phx-click={JS.push("switch_profile", value: %{user_id: nil}, target: "#player", loading: "#player")} phx-click={JS.push("switch_profile", value: %{user_id: nil}, target: "#player", loading: "#player")}
> >
<.icon name={:stop} aria-hidden="true"/><span class="ml-2">Stop Listening</span> <.icon name={:stop}/><span class="ml-2">Stop Listening</span>
</.button> </.button>
<% else %> <% else %>
<.button primary <.button primary
phx-click={JS.push("switch_profile", value: %{user_id: @profile.user_id}, target: "#player", loading: "#player")} phx-click={JS.push("switch_profile", value: %{user_id: @profile.user_id}, target: "#player", loading: "#player")}
> >
<.icon name={:play} aria-hidden="true"/><span class="ml-2">Listen</span> <.icon name={:play}/><span class="ml-2">Listen</span>
</.button> </.button>
<% end %> <% end %>
<%= if @owns_profile? do %> <%= if @owns_profile? do %>
<.button primary patch_to={Routes.song_index_path(@socket, :new)}> <.button primary patch_to={Routes.song_index_path(@socket, :new)}>
<.icon name={:upload} aria-hidden="true"/><span class="ml-2">Upload Songs</span> <.icon name={:upload}/><span class="ml-2">Upload Songs</span>
</.button> </.button>
<% end %> <% end %>
</:actions> </:actions>

View file

@ -35,7 +35,7 @@ defmodule LiveBeatsWeb.LayoutView do
redirect_to={profile_path(@current_user)} redirect_to={profile_path(@current_user)}
class="text-gray-700 hover:text-gray-900 hover:bg-gray-50 group flex items-center px-2 py-2 text-sm font-medium rounded-md" class="text-gray-700 hover:text-gray-900 hover:bg-gray-50 group flex items-center px-2 py-2 text-sm font-medium rounded-md"
> >
<.icon name={:music_note} outlined class="text-gray-400 group-hover:text-gray-500 mr-3 flex-shrink-0 h-6 w-6" aria-hidden="true"/> <.icon name={:music_note} outlined class="text-gray-400 group-hover:text-gray-500 mr-3 flex-shrink-0 h-6 w-6"/>
My Songs My Songs
</.link> </.link>
@ -43,7 +43,7 @@ defmodule LiveBeatsWeb.LayoutView do
redirect_to={Routes.settings_path(LiveBeatsWeb.Endpoint, :edit)} redirect_to={Routes.settings_path(LiveBeatsWeb.Endpoint, :edit)}
class="text-gray-700 hover:text-gray-900 hover:bg-gray-50 group flex items-center px-2 py-2 text-sm font-medium rounded-md" class="text-gray-700 hover:text-gray-900 hover:bg-gray-50 group flex items-center px-2 py-2 text-sm font-medium rounded-md"
> >
<.icon name={:adjustments} outlined class="text-gray-400 group-hover:text-gray-500 mr-3 flex-shrink-0 h-6 w-6" aria-hidden="true"/> <.icon name={:adjustments} outlined class="text-gray-400 group-hover:text-gray-500 mr-3 flex-shrink-0 h-6 w-6"/>
Settings Settings
</.link> </.link>
<% else %> <% else %>