chore: improve placeholder component styles (#3638)

Co-authored-by: jamesgeorge007 <jamesgeorge998001@gmail.com>

packages/hoppscotch-common/src/components/teams/Invite.vue

@@ -125,8 +125,7 @@
                 pendingInvites.data.right.team?.teamInvitations.length === 0
               "
               :text="t('empty.pending_invites')"
-            >
-            </HoppSmartPlaceholder>
+            />
             <div
               v-if="!pendingInvites.loading && E.isLeft(pendingInvites.data)"
               class="flex flex-col items-center p-4"
@@ -245,11 +244,13 @@
             :alt="`${t('empty.invites')}`"
             :text="`${t('empty.invites')}`"
           >
-            <HoppButtonSecondary
-              :label="t('add.new')"
-              filled
-              @click="addNewInvitee"
-            />
+            <template #body>
+              <HoppButtonSecondary
+                :label="t('add.new')"
+                filled
+                @click="addNewInvitee"
+              />
+            </template>
           </HoppSmartPlaceholder>
         </div>
         <div