From fad37064db742375add78a8c85531d9dde5028d3 Mon Sep 17 00:00:00 2001
From: Nolan Darilek <nolan@thewordnerd.info>
Date: Tue, 16 Nov 2021 14:26:10 -0600
Subject: [PATCH] Label player controls.

---
 lib/live_beats_web/live/player_live.ex | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/lib/live_beats_web/live/player_live.ex b/lib/live_beats_web/live/player_live.ex
index ed32f2e..abc7240 100644
--- a/lib/live_beats_web/live/player_live.ex
+++ b/lib/live_beats_web/live/player_live.ex
@@ -49,15 +49,15 @@ defmodule LiveBeatsWeb.PlayerLive do
         <% end %>
 
         <!-- prev -->
-        <button type="button" class="sm:block xl:block mx-auto scale-75" phx-click={js_prev(@own_profile?)}>
+        <button type="button" class="sm:block xl:block mx-auto scale-75" phx-click={js_prev(@own_profile?)} aria-label="Previous">
           <svg width="17" height="18">
             <path d="M0 0h2v18H0V0zM4 9l13-9v18L4 9z" fill="currentColor" />
           </svg>
         </button>
         <!-- /prev -->
 
-        <!-- pause -->
-        <button type="button" class="mx-auto scale-75" phx-click={js_play_pause(@own_profile?)}>
+        <!-- play/pause -->
+        <button type="button" class="mx-auto scale-75" phx-click={js_play_pause(@own_profile?)} aria-label={if @playing do "Pause" else "Play" end}>
           <%= if @playing do %>
             <svg id="player-pause" width="50" height="50" fill="none">
               <circle class="text-gray-300 dark:text-gray-500" cx="25" cy="25" r="24" stroke="currentColor" stroke-width="1.5" />
@@ -70,10 +70,10 @@ defmodule LiveBeatsWeb.PlayerLive do
             </svg>
           <% end %>
         </button>
-        <!-- /pause -->
+        <!-- /play/pause -->
 
         <!-- next -->
-        <button type="button" class="mx-auto scale-75" phx-click={js_next(@own_profile?)}>
+        <button type="button" class="mx-auto scale-75" phx-click={js_next(@own_profile?)} aria-label="Next">
           <svg width="17" height="18" viewBox="0 0 17 18" fill="none">
             <path d="M17 0H15V18H17V0Z" fill="currentColor" />
             <path d="M13 9L0 0V18L13 9Z" fill="currentColor" />