fix: 💄 Remove extra bg value on Avatar inner images

components/avatars/avatar.vue

@@ -1,7 +1,7 @@
 <template>
     <div v-bind="$attrs" class="bg-dark-700 overflow-hidden flex items-center justify-center">
         <Skeleton :enabled="!imageLoaded" class="!h-full !w-full !rounded-none">
-            <img class="cursor-pointer bg-dark-700 ring-1 w-full h-full object-cover" :src="src" :alt="alt" />
+            <img class="cursor-pointer ring-1 w-full h-full object-cover" :src="src" :alt="alt" />
         </Skeleton>
     </div>
 </template>

components/composer/autocomplete-suggestbox.vue

@@ -1,4 +1,7 @@
 <template>
+    <Transition enter-active-class="transition duration-300 ease-in-out" enter-from-class="opacity-0 scale-95"
+        enter-to-class="opacity-100 scale-100" leave-active-class="duration-200 ease-in-out"
+        leave-from-class="opacity-100 scale-100" leave-to-class="opacity-0 scale-95">
         <div class="max-h-40 max-w-full rounded ring-1 ring-dark-300 bg-dark-800 fixed z-20" :style="{
             left: `${x}px`,
             top: `${y}px`,
@@ -13,6 +16,7 @@
                 </div>
             </OverlayScrollbarsComponent>
         </div>
+    </Transition>
 </template>
 
 <script lang="ts" setup>

components/composer/emoji-suggestbox.vue

@@ -2,7 +2,8 @@
     <AutocompleteSuggestbox :currently-typing="currentlyTypingEmoji" :textarea="textarea" :suggestions="emojis"
         :distance-function="distance">
         <template #default="{ suggestion }">
-            <Avatar :src="(suggestion.value as Emoji).url" class="w-full h-full [&>img]:object-contain rounded"
+            <Avatar :src="(suggestion.value as Emoji).url"
+                class="w-full h-full [&>img]:object-contain !bg-transparent rounded"
                 :alt="`Emoji with shortcode ${(suggestion.value as Emoji).shortcode}`" />
         </template>
     </AutocompleteSuggestbox>