diff --git a/src/lib/components/interactiveBox.svelte b/src/lib/components/interactiveBox.svelte new file mode 100644 index 0000000..79d1b30 --- /dev/null +++ b/src/lib/components/interactiveBox.svelte @@ -0,0 +1,147 @@ + + +
+
+ {name}
+ {singer} +
+
+
{formatDuration(progress)}
+
+
+
+
{formatDuration(duration)}
+
+
+ +
+ 暂停或播放 +
+ +
+
+ + + diff --git a/src/routes/play/[id]/+page.svelte b/src/routes/play/[id]/+page.svelte index 35fa179..7d97ea2 100644 --- a/src/routes/play/[id]/+page.svelte +++ b/src/routes/play/[id]/+page.svelte @@ -2,9 +2,15 @@ import { page } from '$app/stores'; import Background from '$lib/components/background.svelte'; import Cover from '$lib/components/cover.svelte'; + import InteractiveBox from '$lib/components/interactiveBox.svelte'; const audioId = $page.params.id; + const name = "晨曦旅客"; + const singer = "乐正绫"; + const duration = 218; + const currentProgress = 0; - \ No newline at end of file + + diff --git a/static/next.svg b/static/next.svg new file mode 100644 index 0000000..d79249d --- /dev/null +++ b/static/next.svg @@ -0,0 +1,11 @@ + + + + + + + + + diff --git a/static/pause.svg b/static/pause.svg new file mode 100644 index 0000000..ff4d585 --- /dev/null +++ b/static/pause.svg @@ -0,0 +1,11 @@ + + + + + + + + + diff --git a/static/play.svg b/static/play.svg new file mode 100644 index 0000000..0fe2a47 --- /dev/null +++ b/static/play.svg @@ -0,0 +1,11 @@ + + + + + + + + + diff --git a/static/previous.svg b/static/previous.svg new file mode 100644 index 0000000..73e7797 --- /dev/null +++ b/static/previous.svg @@ -0,0 +1,11 @@ + + + + + + + + +