refactor(ui): popovers

components/profile/Picture.vue

@@ -1,17 +1,16 @@
 <template>
-  <div
-    class="relative flex items-center justify-center"
-    :class="`h-${size} w-${size}`"
-  >
+  <div class="relative flex items-center justify-center h-5 w-5 cursor-pointer">
     <img
       class="
         absolute
         object-cover object-center
         transition
-        rounded-lg
+        rounded-full
         bg-primaryDark
+        h-5
+        w-5
+        bg-primaryLight
       "
-      :class="`h-${size} w-${size} bg-${color}`"
       :src="url"
       :alt="alt"
       loading="lazy"
@@ -29,29 +28,9 @@ export default {
         .toString(36)
         .substring(7)}.svg?mood[]=happy`,
     },
-    size: {
-      type: Number,
-      default: 6,
-    },
-    radius: {
-      type: String,
-      default: "md",
-    },
-    color: {
-      type: String,
-      default: "gray",
-    },
     alt: {
       type: String,
       default: "Profile picture",
-      // default() {
-      //   return this.url
-      //     .split('/')
-      //     .pop()
-      //     .split('.')[0]
-      //     .split('#')[0]
-      //     .split('?')[0]
-      // },
     },
   },
 }