@@ -22,7 +24,7 @@ const fail = (details) => (
)
const loading = (details) => (
-
+
{details.map((x) => (
{x}
))}
)
diff --git a/src/components/Player/Status/Status.module.scss b/src/components/Player/Status/Status.module.scss
new file mode 100644
index 0000000..494caaf
--- /dev/null
+++ b/src/components/Player/Status/Status.module.scss
@@ -0,0 +1,17 @@
+@keyframes dots0123 {
+ 0% { content: ''; }
+ 33% { content: '.'; }
+ 66% { content: '..'; }
+ 100% { content: '...'; }
+}
+
+.status {
+ padding: var(--inner-padding);
+ word-break: break-word;
+
+ &.loading > div:after {
+ animation: dots0123 1s infinite;
+ content: '';
+ }
+}
+
diff --git a/src/components/Player/player.css b/src/components/Player/player.css
index c1d5bd3..14ad3a6 100644
--- a/src/components/Player/player.css
+++ b/src/components/Player/player.css
@@ -111,19 +111,3 @@
.ifplayer .output .textBuffer .message.subheader {
color: var(--accent-color);
}
-
-.status {
- padding: var(--inner-padding);
-}
-
-.status.loading > div:after {
- animation: dots0123 1s infinite;
- content: '';
-}
-
-@keyframes dots0123 {
- 0% { content: ''; }
- 33% { content: '.'; }
- 66% { content: '..'; }
- 100% { content: '...'; }
-}
diff --git a/src/style/base.scss b/src/style/base.scss
index a53ec8e..4e42dcb 100644
--- a/src/style/base.scss
+++ b/src/style/base.scss
@@ -45,8 +45,3 @@ html, body {
max-width: 800px;
}
}
-
-.status {
- padding: var(--inner-padding);
- word-break: break-word;
-}