From 2ea919cd81cb675b1bd911e7a08b6364b241f69c Mon Sep 17 00:00:00 2001
From: upsiflu <upsiflu@gmail.com>
Date: Wed, 6 Nov 2024 10:35:36 +0100
Subject: [PATCH] refactor(Ui): Move style into component

---
 front/src/components/artist/Card.vue   | 31 ++++++++++++++++++++++++++
 front/src/components/artist/style.scss | 28 -----------------------
 2 files changed, 31 insertions(+), 28 deletions(-)
 delete mode 100644 front/src/components/artist/style.scss

diff --git a/front/src/components/artist/Card.vue b/front/src/components/artist/Card.vue
index 6a3542a2d..3e39fbad6 100644
--- a/front/src/components/artist/Card.vue
+++ b/front/src/components/artist/Card.vue
@@ -42,3 +42,34 @@ const image = artist.cover
     </template>
   </fw-card>
 </template>
+
+<style scoped>
+.funkwhale {
+  &.card.artist-card {
+    --fw-border-radius: 12px;
+    --fw-card-width: 208px;
+    --fw-card-image-width: calc(var(--fw-card-width) - 16px);
+    --fw-card-padding: 16px;
+
+    > .card-image {
+      border-radius: 50% !important;
+      width: var(--fw-card-image-width);
+      margin: calc(-1 * var(--fw-card-padding) + 8px) calc(-1 * var(--fw-card-padding) + 8px) 0;
+    }
+
+    .play-button {
+      top: calc(var(--fw-card-width) - 44px - 8px) !important;
+    }
+
+    > .card-title {
+      font-size: 1rem;
+      text-align: left !important;
+    }
+
+    > .card-content {
+      padding-top: 6px !important;
+      text-align: left !important;
+    }
+  }
+}
+</style>
diff --git a/front/src/components/artist/style.scss b/front/src/components/artist/style.scss
deleted file mode 100644
index 6219103c6..000000000
--- a/front/src/components/artist/style.scss
+++ /dev/null
@@ -1,28 +0,0 @@
-.funkwhale {
-  &.card.artist-card {
-    --fw-border-radius: 12px;
-    --fw-card-width: 208px;
-    --fw-card-image-width: calc(var(--fw-card-width) - 16px);
-    --fw-card-padding: 16px;
-
-    > .card-image {
-      border-radius: 50% !important;
-      width: var(--fw-card-image-width);
-      margin: calc(-1 * var(--fw-card-padding) + 8px) calc(-1 * var(--fw-card-padding) + 8px) 0;
-    }
-
-    .play-button {
-      top: calc(var(--fw-card-width) - 44px - 8px) !important;
-    }
-
-    > .card-title {
-      font-size: 1rem;
-      text-align: left !important;
-    }
-
-    > .card-content {
-      padding-top: 6px !important;
-      text-align: left !important;
-    }
-  }
-}