peter/siftlode
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

feat(player): show the Shift+arrow shortcut in prev/next tooltips

Browse source
This commit is contained in:
npeter83 2026-07-04 23:20:02 +02:00
parent 51ddd31b69
commit c81c4a351b
1 changed files with 4 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

6
frontend/src/components/PlayerModal.tsx
View file

@ -448,7 +448,7 @@ export default function PlayerModal({
}} }}
disabled={index === 0} disabled={index === 0}
aria-label={t("player.previous")} aria-label={t("player.previous")}
title={t("player.previous")} title={`${t("player.previous")} · Shift+←`}
className="absolute left-1 sm:left-3 top-1/2 -translate-y-1/2 z-20 grid h-16 w-10 place-items-center rounded-xl text-white/40 transition hover:bg-white/10 hover:text-white disabled:pointer-events-none disabled:opacity-0" className="absolute left-1 sm:left-3 top-1/2 -translate-y-1/2 z-20 grid h-16 w-10 place-items-center rounded-xl text-white/40 transition hover:bg-white/10 hover:text-white disabled:pointer-events-none disabled:opacity-0"
> >
<ChevronLeft className="h-7 w-7" /> <ChevronLeft className="h-7 w-7" />
@ -460,7 +460,7 @@ export default function PlayerModal({
}} }}
disabled={index >= queue!.length - 1} disabled={index >= queue!.length - 1}
aria-label={t("player.next")} aria-label={t("player.next")}
title={t("player.next")} title={`${t("player.next")} · Shift+→`}
className="absolute right-1 sm:right-3 top-1/2 -translate-y-1/2 z-20 grid h-16 w-10 place-items-center rounded-xl text-white/40 transition hover:bg-white/10 hover:text-white disabled:pointer-events-none disabled:opacity-0" className="absolute right-1 sm:right-3 top-1/2 -translate-y-1/2 z-20 grid h-16 w-10 place-items-center rounded-xl text-white/40 transition hover:bg-white/10 hover:text-white disabled:pointer-events-none disabled:opacity-0"
> >
<ChevronRight className="h-7 w-7" /> <ChevronRight className="h-7 w-7" />
@ -536,6 +536,7 @@ export default function PlayerModal({
<button <button
onClick={() => index > 0 && setPlayingId(queue![index - 1].id)} onClick={() => index > 0 && setPlayingId(queue![index - 1].id)}
disabled={index === 0} disabled={index === 0}
title={`${t("player.previous")} · Shift+←`}
className="inline-flex items-center gap-1.5 text-muted enabled:hover:text-fg disabled:opacity-40 transition" className="inline-flex items-center gap-1.5 text-muted enabled:hover:text-fg disabled:opacity-40 transition"
> >
<SkipBack className="w-4 h-4" /> {t("player.previous")} <SkipBack className="w-4 h-4" /> {t("player.previous")}
@ -546,6 +547,7 @@ export default function PlayerModal({
<button <button
onClick={() => index < queue!.length - 1 && setPlayingId(queue![index + 1].id)} onClick={() => index < queue!.length - 1 && setPlayingId(queue![index + 1].id)}
disabled={index === queue!.length - 1} disabled={index === queue!.length - 1}
title={`${t("player.next")} · Shift+→`}
className="inline-flex items-center gap-1.5 text-muted enabled:hover:text-fg disabled:opacity-40 transition" className="inline-flex items-center gap-1.5 text-muted enabled:hover:text-fg disabled:opacity-40 transition"
> >
{t("player.next")} <SkipForward className="w-4 h-4" /> {t("player.next")} <SkipForward className="w-4 h-4" />