From c874b3d6c5463e3ba4e90c3c79e98ad1747ed797 Mon Sep 17 00:00:00 2001
From: TAKAHASHI Shuuji <shuuji3@gmail.com>
Date: Tue, 9 Apr 2024 00:05:31 +0900
Subject: [PATCH] fix: adjust "Pinned post" position and styling

---
 components/status/StatusCard.vue | 26 +++++++++++++-------------
 1 file changed, 13 insertions(+), 13 deletions(-)

diff --git a/components/status/StatusCard.vue b/components/status/StatusCard.vue
index 3e211c47..c1b9f720 100644
--- a/components/status/StatusCard.vue
+++ b/components/status/StatusCard.vue
@@ -76,6 +76,19 @@ const forceShow = ref(false)
     <div :h="showUpperBorder ? '1px' : '0'" w-auto bg-border mb-1 />
 
     <slot name="meta">
+      <!-- Pinned status -->
+      <div flex="~ col" justify-between>
+        <div
+          v-if="isPinned"
+          flex="~ gap2" items-center h-auto text-sm text-orange
+          m="is-5" p="t-1 is-5"
+          relative text-secondary ws-nowrap
+        >
+          <div i-ri:pushpin-line />
+          <span>Pinned post</span>
+        </div>
+      </div>
+
       <!-- Line connecting to previous status -->
       <template v-if="status.inReplyToAccountId">
         <StatusReplyingTo
@@ -114,19 +127,6 @@ const forceShow = ref(false)
           <AccountInlineInfo font-bold :account="rebloggedBy" :avatar="false" text-sm />
         </div>
       </div>
-
-      <!-- Pinned status -->
-      <div flex="~ col" justify-between>
-        <div
-          v-if="isPinned"
-          flex="~" items-center
-          p="t-1 b-0.5 x-1px"
-          relative text-secondary ws-nowrap
-        >
-          <div i-ri:pushpin-line mx-1 text-orange w-16px h-16px />
-          <span text-primary>Pinned post</span>
-        </div>
-      </div>
     </slot>
 
     <div flex gap-3 :class="{ 'text-secondary': inNotification }">