409/groove-web
1
1
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(tracks): search

Browse Source
This commit is contained in:
Shawn
2024-11-29 04:28:26 +01:00
parent 1287b71580
commit 1a4bde9618
5 changed files with 37 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
src/lib/components/groove/TrackListing.svelte
View File

@@ -1,7 +1,7 @@
<script lang="ts">
import { getCoverUrl } from '$lib/covers';
import type { Track } from '$lib/proto/library';
import AudioLines from 'virtual:icons/lucide/audio-lines';
// import AudioLines from 'virtual:icons/lucide/audio-lines';
interface Props {
track: Track;
@@ -12,16 +12,13 @@
let { track, currentlyPlaying = false, oncontextmenu }: Props = $props();
</script>
<div
class="flex flex-col gap-3"
data-track-hash={track.hash}
oncontextmenu={(e) => oncontextmenu?.(e, track.hash)}
>
<div class="flex flex-col gap-3" data-track-hash={track.hash}>
<div class="relative aspect-square w-full">
<button
type="submit"
class="relative aspect-square h-full w-full overflow-hidden rounded-lg"
formaction="/tracks/{track.hash}?/play"
oncontextmenu={(e) => oncontextmenu?.(e, track.hash)}
>
<img
class="aspect-square h-full w-full transform-gpu transition-all duration-150 hover:scale-105 hover:saturate-150"
@@ -31,9 +28,9 @@
height="640"
/>
</button>
<div class="absolute bottom-6 left-2 size-4 animate-pulse" class:hidden={!currentlyPlaying}>
<!-- <div class="absolute bottom-6 left-2 size-4 animate-pulse" class:hidden={!currentlyPlaying}>
<AudioLines class="text-primary" />
</div>
</div> -->
</div>
<div class="relative space-y-1 text-sm">
<h3 class="font-medium leading-none">{track.name}</h3>