mirror of
https://github.com/koel/koel
synced 2024-11-10 14:44:13 +00:00
fix(ui): always show play buttons on touch screens
This commit is contained in:
parent
4e1838c247
commit
6c6d428539
2 changed files with 4 additions and 4 deletions
|
@ -12,9 +12,9 @@
|
||||||
class="w-full aspect-square object-cover"
|
class="w-full aspect-square object-cover"
|
||||||
loading="lazy"
|
loading="lazy"
|
||||||
>
|
>
|
||||||
<span class="absolute top-0 left-0 w-full h-full group-hover:bg-black/40 z-10" />
|
<span class="absolute top-0 left-0 w-full h-full group-hover:bg-black/40 no-hover:bg-black/40 z-10" />
|
||||||
<span
|
<span
|
||||||
class="absolute flex opacity-0 items-center justify-center w-[24px] aspect-square rounded-full top-1/2
|
class="absolute flex opacity-0 no-hover:opacity-100 items-center justify-center w-[24px] aspect-square rounded-full top-1/2
|
||||||
left-1/2 -translate-x-1/2 -translate-y-1/2 bg-k-highlight group-hover:opacity-100 duration-500 transition z-20"
|
left-1/2 -translate-x-1/2 -translate-y-1/2 bg-k-highlight group-hover:opacity-100 duration-500 transition z-20"
|
||||||
>
|
>
|
||||||
<Icon v-if="playable.playback_state === 'Playing'" :icon="faPause" class="text-white" />
|
<Icon v-if="playable.playback_state === 'Playing'" :icon="faPause" class="text-white" />
|
||||||
|
|
|
@ -18,9 +18,9 @@
|
||||||
loading="lazy"
|
loading="lazy"
|
||||||
>
|
>
|
||||||
<span class="hidden">{{ buttonLabel }}</span>
|
<span class="hidden">{{ buttonLabel }}</span>
|
||||||
<span class="absolute top-0 left-0 w-full h-full group-hover:bg-black/40 z-10" />
|
<span class="absolute top-0 left-0 w-full h-full group-hover:bg-black/40 no-hover:bg-black/40 z-10" />
|
||||||
<span
|
<span
|
||||||
class="play-icon absolute flex opacity-0 items-center justify-center w-[32px] aspect-square rounded-full top-1/2
|
class="play-icon absolute flex opacity-0 no-hover:opacity-100 items-center justify-center w-[32px] aspect-square rounded-full top-1/2
|
||||||
left-1/2 -translate-x-1/2 -translate-y-1/2 bg-k-highlight group-hover:opacity-100 duration-500 transition z-20"
|
left-1/2 -translate-x-1/2 -translate-y-1/2 bg-k-highlight group-hover:opacity-100 duration-500 transition z-20"
|
||||||
>
|
>
|
||||||
<Icon :icon="faPlay" class="ml-1 text-white" size="lg" />
|
<Icon :icon="faPlay" class="ml-1 text-white" size="lg" />
|
||||||
|
|
Loading…
Reference in a new issue