fix: small fixes

Author: danielroe

app/components/Card.vue app/components/BaseCard.vueapp/components/Card.vue renamed to app/components/BaseCard.vue

@@ -1,6 +1,4 @@
 <script setup lang="ts">
-import Card from '../Card.vue'
-
 const props = defineProps<{
   /** The search result object containing package data */
   result: NpmSearchResult
@@ -31,7 +29,7 @@ const pkgDescription = useMarkdown(() => ({
 </script>
 
 <template>
-  <Card :isExactMatch="isExactMatch">
+  <BaseCard :isExactMatch="isExactMatch">
     <div class="mb-2 flex items-baseline justify-start gap-2">
       <component
         :is="headingLevel ?? 'h3'"
@@ -160,5 +158,5 @@ const pkgDescription = useMarkdown(() => ({
         {{ keyword }}
       </li>
     </ul>
-  </Card>
+  </BaseCard>
 </template>

app/components/Package/Card.vue

@@ -12,7 +12,7 @@ defineProps<{
 </script>
 
 <template>
-  <Card :isExactMatch="isExactMatch">
+  <BaseCard :isExactMatch="isExactMatch">
     <NuxtLink
       :to="type === 'user' ? `/~${name}` : `/@${name}`"
       :data-suggestion-index="index"
@@ -61,5 +61,5 @@ defineProps<{
         aria-hidden="true"
       />
     </NuxtLink>
-  </Card>
+  </BaseCard>
 </template>

app/components/SearchSuggestionCard.vue

@@ -1,10 +1,3 @@
-<!-- Vue component that only takes a class as prop and adds `bg-bg-elevated rounded animate-skeleton-pulse` to that class -->
-<script setup lang="ts">
-const props = defineProps<{
-  class?: string
-}>()
-</script>
-
 <template>
-  <div :class="`bg-bg-elevated rounded animate-skeleton-pulse ${props.class ?? ''}`" />
+  <div class="bg-bg-elevated rounded animate-skeleton-pulse" />
 </template>

app/components/SkeletonBlock.vue

@@ -1,12 +1,3 @@
-<!-- Vue component that only takes a class as prop and adds `bg-bg-elevated rounded animate-skeleton-pulse` to that class -->
-<script setup lang="ts">
-const props = defineProps<{
-  class?: string
-}>()
-</script>
-
 <template>
-  <span
-    :class="`inline-block bg-bg-elevated rounded animate-skeleton-pulse ${props.class ?? ''}`"
-  />
+  <span class="inline-block bg-bg-elevated rounded animate-skeleton-pulse" />
 </template>