Skip to content

[Fix] : 인기차트 곡 카드 번호 밀림 수정 및 본문 스크롤 UI 통일 (#304) - #305

Merged
GulSam00 merged 2 commits into
developfrom
fix/304-songCardScrollUi
Aug 14, 2026
Merged

[Fix] : 인기차트 곡 카드 번호 밀림 수정 및 본문 스크롤 UI 통일 (#304)#305
GulSam00 merged 2 commits into
developfrom
fix/304-songCardScrollUi

Conversation

@GulSam00

Copy link
Copy Markdown
Owner

📌 PR 제목

[Fix] : 인기차트 곡 카드 번호 밀림 수정 및 본문 스크롤 UI 통일

📌 변경 사항

  • 인기차트 곡 카드의 SongSummarymin-w-0 flex-1 적용
    • SongSummaryw-full 인데 순위 뱃지와 같은 flex 행의 아이템이라, flex 아이템 기본값인 min-width: auto 가 preferred size(100%)를 하한으로 잡아 뱃지 폭만큼 줄어들지 못했다.
    • 그 결과 긴 곡 제목·가수명이 우측 TJ/금영 번호 영역을 밖으로 밀어내고 있었다.
  • 인기차트 곡 카드 행에 px-4 여백과 items-start 정렬 추가 (최신곡 카드와 동일한 여백)
  • 최신곡 페이지 본문 스크롤을 네이티브 overflow-y-autoScrollArea 로 교체

💬 추가 참고 사항

  • 스크롤 UI를 ScrollArea 로 통일한 이유
    • 이미 tosing, info/*, patch-notes, admin/reports, ChatBot 등 대다수 화면이 ScrollArea 를 사용 중이라 네이티브 스크롤을 쓰던 /recent 가 예외였다.
    • 네이티브 스크롤바는 Windows·안드로이드에서 실제 레이아웃 폭을 차지해, 스크롤 유무에 따라 곡 카드 우측 번호 정렬 위치가 달라진다. ScrollArea 는 오버레이라 폭이 항상 일정하다.
    • OS별 스크롤바 편차 없이 디자인 토큰(bg-border)을 따르므로 다크모드까지 일관된다.
  • /search 는 무한스크롤용 스크롤 컨테이너 ref가 필요해 네이티브 overflow-y-auto 를 유지했다.
  • 테스트 스위트가 없어 pnpm build / pnpm lint / pnpm format 으로 검증했다.
  • close 인기차트 곡 카드 번호 밀림 수정 및 본문 스크롤 UI 통일 #304

@GulSam00

Copy link
Copy Markdown
Owner Author

/describe

@GulSam00

Copy link
Copy Markdown
Owner Author

/review

@vercel

vercel Bot commented Aug 14, 2026

Copy link
Copy Markdown
Contributor

The latest updates on your projects. Learn more about Vercel for GitHub.

Project Deployment Actions Updated (UTC)
singcode Ready Ready Preview Aug 14, 2026 3:47am

@GulSam00

Copy link
Copy Markdown
Owner Author

/improve

@qodo-code-review

Copy link
Copy Markdown

ⓘ Qodo reviews are paused because the subscription is no longer active. Ask your workspace admin to reactivate the subscription to resume reviews. Manage billing

@GulSam00
GulSam00 merged commit ebfe0ac into develop Aug 14, 2026
2 checks passed
@GulSam00
GulSam00 deleted the fix/304-songCardScrollUi branch August 14, 2026 05:36
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

인기차트 곡 카드 번호 밀림 수정 및 본문 스크롤 UI 통일

1 participant