|
|
|
|
@ -12,13 +12,6 @@
|
|
|
|
|
}
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<style>
|
|
|
|
|
article { margin: 0 0 1em 0; max-width: 800px }
|
|
|
|
|
h2, p { margin: 0 0 0.3em 0; }
|
|
|
|
|
audio { width: 100%; margin: 0.5em 0 1em 0; }
|
|
|
|
|
.playing { color: #ff3e00; }
|
|
|
|
|
</style>
|
|
|
|
|
|
|
|
|
|
<article class:playing={!paused}>
|
|
|
|
|
<h2>{title}</h2>
|
|
|
|
|
<p><strong>{composer}</strong> / performed by {performer}</p>
|
|
|
|
|
@ -30,4 +23,19 @@
|
|
|
|
|
controls
|
|
|
|
|
{src}
|
|
|
|
|
></audio>
|
|
|
|
|
</article>
|
|
|
|
|
</article>
|
|
|
|
|
|
|
|
|
|
<style>
|
|
|
|
|
article {
|
|
|
|
|
margin: 0 0 1em 0; max-width: 800px;
|
|
|
|
|
}
|
|
|
|
|
h2, p {
|
|
|
|
|
margin: 0 0 0.3em 0;
|
|
|
|
|
}
|
|
|
|
|
audio {
|
|
|
|
|
width: 100%; margin: 0.5em 0 1em 0;
|
|
|
|
|
}
|
|
|
|
|
.playing {
|
|
|
|
|
color: #ff3e00;
|
|
|
|
|
}
|
|
|
|
|
</style>
|