mirrors/live_beats
1
0
Fork 0
mirror of https://github.com/fly-apps/live_beats.git synced 2024-11-25 09:20:59 +00:00
Code Issues Projects Releases Wiki Activity

Merge pull request #20 from ndarilek/playlist-a11y

Browse source 
Improve playlist accessibility
This commit is contained in:
Chris McCord 2022-01-07 15:24:00 -05:00 committed by GitHub
commit ad3cab4d29
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 4 additions and 4 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
lib/live_beats_web/live/live_helpers.ex
View file

@ -123,7 +123,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(:"aria-hidden", fn -> "true" end) |> assign_new(:"aria-hidden", fn -> !Map.has_key?(assigns, :"aria-label") end)
~H""" ~H"""
<%= if @outlined do %> <%= if @outlined do %>

6
lib/live_beats_web/live/profile_live/song_row_component.ex
View file

@ -18,18 +18,18 @@ defmodule LiveBeatsWeb.ProfileLive.SongRowComponent do
<%= if @status == :playing do %> <%= if @status == :playing do %>
<span class="flex pt-1 relative mr-2 w-4"> <span class="flex pt-1 relative mr-2 w-4">
<span class="w-3 h-3 animate-ping bg-purple-400 rounded-full absolute"></span> <span class="w-3 h-3 animate-ping bg-purple-400 rounded-full absolute"></span>
<.icon name={:volume_up} class="h-5 w-5 -mt-1 -ml-1"/> <.icon name={:volume_up} class="h-5 w-5 -mt-1 -ml-1" aria-label="Playing" role="button"/>
</span> </span>
<% end %> <% end %>
<%= if @status == :paused do %> <%= if @status == :paused do %>
<span class="flex pt-1 relative mr-2 w-4"> <span class="flex pt-1 relative mr-2 w-4">
<.icon name={:volume_up} class="h-5 w-5 -mt-1 -ml-1 text-gray-400"/> <.icon name={:volume_up} class="h-5 w-5 -mt-1 -ml-1 text-gray-400" aria-label="Paused" role="button"/>
</span> </span>
<% end %> <% end %>
<%= if @status == :stopped do %> <%= if @status == :stopped do %>
<span class="flex relative w-6 -translate-x-1"> <span class="flex relative w-6 -translate-x-1">
<%= if @owns_profile? do %> <%= if @owns_profile? do %>
<.icon name={:play} class="h-5 w-5 text-gray-400"/> <.icon name={:play} class="h-5 w-5 text-gray-400" aria-label="Play" role="button"/>
<% end %> <% end %>
</span> </span>
<% end %> <% end %>