블로그: 목록 카드 요약 영역 세로 여백 정리 (v0.2.9)

Made-with: Cursor

partials/lists/post-items.hbs

@@ -10,7 +10,7 @@
                     <span class="block w-full aspect-square sm:aspect-video rounded-lg bg-bgr-tone text-typ-tone text-xs text-center p-4">{{title}}</span>
                 {{/if}}
             </a>
-            <div class="relative min-w-0 flex-3 md:flex-4 flex flex-col gap-0.5 justify-between h-full self-stretch" data-post-card-content>
+            <div class="post-card-content relative min-w-0 flex-3 md:flex-4 flex flex-col gap-0.5 self-stretch min-h-0" data-post-card-content>
                 <h2 class="text-sm font-medium leading-tight flex flex-wrap gap-y-0.5 gap-x-1.5 items-end max-w-[90%]" data-post-card-title>
                     <a href="{{url}}" class="hover:opacity-75 flex items-start gap-1.5">
                         {{#if featured}}
@@ -23,13 +23,10 @@
                         <span>{{title}}</span>
                     </a>
                 </h2>
-                
-                <p class="text-[0.8rem] text-typ-tone leading-tight line-clamp-2 text-ellipsis flex-1 min-h-[2.2rem]" data-post-card-excerpt>
-                    {{#if excerpt}}
-                        {{excerpt words="24"}}
-                    {{/if}}
-                </p>
-                <div class="flex flex-wrap gap-2 sm:gap-1.5 items-center text-xs text-typ-tone [&>*:not(:last-child)]:after:content-['/'] [&>*:not(:last-child)]:after:ml-2 sm:[&>*:not(:last-child)]:after:ml-1.5 [&>*:not(:last-child)]:after:text-brd" data-post-card-info>
+                {{#if excerpt}}
+                <p class="post-card-content__excerpt text-[0.8rem] text-typ-tone leading-tight line-clamp-2 text-ellipsis" data-post-card-excerpt>{{excerpt words="24"}}</p>
+                {{/if}}
+                <div class="post-card-content__meta flex flex-wrap gap-2 sm:gap-1.5 items-center text-xs text-typ-tone [&>*:not(:last-child)]:after:content-['/'] [&>*:not(:last-child)]:after:ml-2 sm:[&>*:not(:last-child)]:after:ml-1.5 [&>*:not(:last-child)]:after:text-brd{{#if excerpt}} mt-auto{{/if}}" data-post-card-info>
                     <time data-post-card-date datetime="{{date format="YYYY-MM-DD"}}">{{date format="MMM D"}}</time>
                     {{#primary_author}}
                         <a data-post-card-author href="{{url}}" class="hover:opacity-75">{{name}}</a>

partials/site/sidebar-left.hbs

@@ -82,7 +82,7 @@
             <div class="sidebar-card__content sidebar-card__content--categories" x-cloak x-show="categoriesOpen">
                 <ul class="category-grid grid sm:grid-cols-2 gap-x-2 gap-0.5 mt-1 text-typ-tone font-medium text-[0.8rem] -mb-1.5" data-category-priority-list 
                     data-category-priority-order="tech,business,health,science,design,travel,gaming,music,diy,photography,books" 
-                    data-category-priority-limit="11">
+                    data-category-priority-limit="10">
                     {{#get "tags" limit="100" include="count.posts" order="count.posts desc"}}
                         {{#foreach tags}}
                             <li data-category-priority-item data-category-slug="{{slug}}">

partials/site/sidebar-right.hbs

@@ -130,7 +130,7 @@
         {{/is}}
         <span class="flex-1"></span>
         <footer class="px-5 sm:px-6 xl:pr-1">
-            <div class="py-3 flex flex-col items-start justify-start text-xs font-blod text-gray-800">
+            <div class="py-3 flex flex-col items-center justify-center text-[10px] font-bold text-gray-800">
                 ©{{date format="YYYY"}} {{@site.title}}. All rights reserved.
             </div>
         </footer>