게시물 카드 썸네일 보조 피드백 추가 및 댓글 기본 정렬 최신순 변경

- 카드 hover/누름 시 썸네일 은은한 확대 보조 피드백 추가(메인·전체·태그 공통)
- 썸네일 sticky opacity hover 제거
- 게시글 댓글 기본 정렬을 인기순에서 최신순으로 변경, 옵션 순서 조정
- v1.10.36

Co-authored-by: Cursor <cursoragent@cursor.com>

assets/css/main.css

@@ -305,6 +305,30 @@
     color: var(--site-accent);
   }
 
+  /**
+   * 게시물 카드 보조 피드백 — 제목 강조와 함께 썸네일을 은은하게 확대.
+   * 데스크톱은 카드 hover(실제 hover 기기), 모바일은 카드/썸네일 :active 눌림에만 반영.
+   */
+  .post-card-media__image,
+  .post-card-media__placeholder {
+    transition: transform 0.3s ease;
+    will-change: transform;
+  }
+
+  @media (hover: hover) {
+    .group:hover .post-card-media__image,
+    .group:hover .post-card-media__placeholder {
+      transform: scale(1.04);
+    }
+  }
+
+  .group:active .post-card-media__image,
+  .group:active .post-card-media__placeholder,
+  .post-card-media:active .post-card-media__image,
+  .post-card-media:active .post-card-media__placeholder {
+    transform: scale(1.04);
+  }
+
   /**
    * 왼쪽 사이드바 1차 네비·태그 카테고리·테마 점 등 행 호버 — 라이트 테마에서 밝은 크림 톤, 다크는 패널 대비 유지
    */

components/comments/PostComments.vue

@@ -17,7 +17,7 @@ const replyErrorMessage = ref('')
 const newCommentBody = ref('')
 const replyBody = ref('')
 const activeReplyTargetId = ref('')
-const sortOption = ref('best')
+const sortOption = ref('latest')
 const brokenAvatarCommentIds = ref([])
 const canSubmitComment = computed(() => Boolean(newCommentBody.value.trim()) && !submitting.value)
 const canSubmitReply = computed(() => Boolean(replyBody.value.trim()) && !submittingReplyId.value)
@@ -321,8 +321,8 @@ onMounted(async () => {
         v-model="sortOption"
         class="rounded-md border border-[var(--site-line)] bg-transparent px-2 py-1 text-xs font-semibold text-[var(--site-ink)] outline-none"
       >
-        <option value="best">인기순</option>
         <option value="latest">최신순</option>
+        <option value="best">인기순</option>
         <option value="oldest">오래된순</option>
       </select>
     </div>

components/site/PostCardMedia.vue

@@ -53,7 +53,7 @@ const displayImage = computed(() => props.thumbnailImage || props.featuredImage)
     >
       <img
         v-if="displayImage"
-        class="post-card-media__image h-full w-full rounded-[inherit] object-cover transition-opacity duration-200 group-hover:opacity-90"
+        class="post-card-media__image h-full w-full rounded-[inherit] object-cover"
         :class="imageClass"
         :src="displayImage"
         :alt="title"
@@ -61,7 +61,7 @@ const displayImage = computed(() => props.thumbnailImage || props.featuredImage)
       >
       <span
         v-else
-        class="post-card-media__placeholder flex h-full w-full items-center justify-center rounded-[inherit] bg-[#F7F4EF] p-4 text-center text-xs leading-snug text-[var(--site-muted)] transition-opacity duration-200 group-hover:opacity-90"
+        class="post-card-media__placeholder flex h-full w-full items-center justify-center rounded-[inherit] bg-[#F7F4EF] p-4 text-center text-xs leading-snug text-[var(--site-muted)]"
         :aria-label="title"
       >
         <span class="post-card-media__placeholder-text max-w-full break-words line-clamp-3 sm:line-clamp-4">{{ title }}</span>

docs/map.md

@@ -124,7 +124,7 @@
 | components/site/PostCardMedia.vue | 게시물 카드 썸네일(`featuredImageThumbnail` 우선, 없으면 대표 이미지 원본 사용. 대표 이미지 없으면 모바일 3줄·`sm` 이상 4줄 제목 placeholder 표시, 이미지 유무와 관계없이 썸네일 영역 크기 고정) |
 | components/site/SitePagination.vue | 공개 목록 공용 번호형 페이지네이션, 이전·다음 화살표와 첫/끝/현재 주변 페이지 직접 이동, 많은 페이지의 `...` 접기, 모바일 가로 스크롤 |
 | components/site/TagHeader.vue | 태그 페이지 헤더 |
-| components/comments/PostComments.vue | 게시물 상세 `#comments` 영역, 회원 댓글/답글(1단) 작성 및 목록 표시, 입력값 기반 등록 버튼 활성화, 작성자 썸네일/좋아요/상대시간 표시 |
+| components/comments/PostComments.vue | 게시물 상세 `#comments` 영역, 회원 댓글/답글(1단) 작성 및 목록 표시, 기본 정렬 최신순(최신순·인기순·오래된순 선택), 입력값 기반 등록 버튼 활성화, 작성자 썸네일/좋아요/상대시간 표시 |
 
 ## 관리자 컴포넌트
 

docs/update.md

@@ -1,5 +1,11 @@
 # 업데이트 이력
 
+## v1.10.36
+
+- 게시물 카드 보조 피드백 추가: 제목 강조와 함께 썸네일 은은한 확대(데스크톱 hover 기기·모바일 `:active` 눌림).
+- 카드 썸네일의 sticky opacity hover 제거, 세 목록(메인·전체·태그) 공통 적용.
+- 게시글 댓글 기본 정렬을 인기순에서 최신순으로 변경, 정렬 옵션 순서도 최신순 우선으로 조정.
+
 ## v1.10.35
 
 - 게시물 카드 클릭 피드백을 메인·전체 목록·태그 목록에서 제목 포인트 컬러 강조로 통일.

package.json

@@ -1,6 +1,6 @@
 {
   "name": "sori.studio",
-  "version": "1.10.35",
+  "version": "1.10.36",
   "private": true,
   "type": "module",
   "imports": {