태그 없는 게시물에서 POST 더미 표시 제거(v1.1.2)

pages/index.vue

@@ -53,10 +53,17 @@ const onDocumentPointerDown = (event) => {
  * @returns {{name: string, color: string}} 태그 정보
  */
 const getTagMeta = (slug) => {
+  if (!slug) {
+    return {
+      name: '',
+      color: '#4d4d4d'
+    }
+  }
+
   const matchedTag = tags.value.find((item) => item.slug === slug)
 
   return {
-    name: matchedTag?.name || (slug ? slug.toUpperCase() : 'POST'),
+    name: matchedTag?.name || String(slug).toUpperCase(),
     color: matchedTag?.color || '#4d4d4d'
   }
 }
@@ -454,14 +461,16 @@ const scrollFeatured = (direction) => {
 
                   <div class="flex flex-wrap items-center gap-2 text-xs site-muted sm:gap-1.5">
                     <time v-if="post.publishedAt" :datetime="post.publishedAtIso">{{ post.publishedAt }}</time>
-                    <span class="text-[var(--site-line)]">/</span>
-                    <span
-                      class="rounded-md px-1.5 py-px font-medium text-[var(--site-text)]"
-                      :style="{ backgroundColor: `${post.tagColor}1a` }"
-                    >
-                      {{ post.tagName }}
-                    </span>
-                    <span class="text-[var(--site-line)]">/</span>
+                    <template v-if="post.tagName">
+                      <span v-if="post.publishedAt" class="text-[var(--site-line)]">/</span>
+                      <span
+                        class="rounded-md px-1.5 py-px font-medium text-[var(--site-text)]"
+                        :style="{ backgroundColor: `${post.tagColor}1a` }"
+                      >
+                        {{ post.tagName }}
+                      </span>
+                    </template>
+                    <span v-if="post.publishedAt || post.tagName" class="text-[var(--site-line)]">/</span>
                     <span class="flex items-center gap-1">
                       <svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="-mt-px">
                         <path d="M21 11.5a8.38 8.38 0 0 1-.9 3.8 8.5 8.5 0 0 1-7.6 4.7 8.38 8.38 0 0 1-3.8-.9L3 21l1.9-5.7a8.38 8.38 0 0 1-.9-3.8 8.5 8.5 0 0 1 4.7-7.6 8.38 8.38 0 0 1 3.8-.9h.5a8.48 8.48 0 0 1 8 8v.5z" />