refactor: Move TrackCard to component
This commit is contained in:
parent
8be7654905
commit
3576b37a11
2 changed files with 21 additions and 8 deletions
19
src/lib/components/TrackCard.svelte
Normal file
19
src/lib/components/TrackCard.svelte
Normal file
|
@ -0,0 +1,19 @@
|
|||
<script lang="ts">
|
||||
export let title: string;
|
||||
export let producerUsername: string;
|
||||
</script>
|
||||
|
||||
<article>
|
||||
<hgroup>
|
||||
<h2>{title}</h2>
|
||||
<h3>by {producerUsername}</h3>
|
||||
</hgroup>
|
||||
|
||||
This is a track card.
|
||||
|
||||
<footer>
|
||||
<label for="comment">
|
||||
<input type="text" name="comment" placeholder="Leave some feedback" />
|
||||
</label>
|
||||
</footer>
|
||||
</article>
|
|
@ -1,4 +1,5 @@
|
|||
<script lang="ts">
|
||||
import TrackCard from '$lib/components/TrackCard.svelte';
|
||||
export let data;
|
||||
</script>
|
||||
|
||||
|
@ -14,14 +15,7 @@
|
|||
{/if}
|
||||
|
||||
{#each data.tracks as track}
|
||||
<article>
|
||||
<hgroup>
|
||||
<h2>{track.title}</h2>
|
||||
<h3>by {track.producer.username}</h3>
|
||||
</hgroup>
|
||||
|
||||
This is a track
|
||||
</article>
|
||||
<TrackCard title={track.title} producerUsername={track.producer.username} />
|
||||
{/each}
|
||||
{:else}
|
||||
Oh no.
|
||||
|
|
Loading…
Reference in a new issue