Conversation
- Dialog/AlertDialog: grid → flex flex-col, translate 센터링 → inset-y-0 my-auto - overflow-y-auto 추가로 콘텐츠 클리핑 대신 스크롤 활성화 - slide 애니메이션 origin 48% → 제거 (새 센터링 방식과 불일치) - WebkitOverflowScrolling 제거 (iOS 13 이후 no-op) - globals.css: body[data-scroll-locked] overscroll-behavior-y: auto 추가 - use-pull-to-refresh: 다이얼로그 열림 시 제스처 비활성화 - crawl-modal: base DialogContent에서 flex flex-col 상속으로 중복 제거 Co-Authored-By: Claude <noreply@anthropic.com>
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
Safari PWA 환경에서 다이얼로그(Dialog/AlertDialog) 내부 콘텐츠가 화면보다 클 때 스크롤이 안 되고 클리핑되는 문제 수정.
Chrome과 Safari의
overscroll-behavior,display: grid,transform처리 차이에서 발생하는 이슈.Changes
dialog.tsxgrid→flex flex-col,top-[50%] translate-y-[-50%]→inset-y-0 my-auto,overflow-y-auto추가, slide 애니메이션 origin 정리,WebkitOverflowScrolling제거alert-dialog.tsxglobals.cssbody[data-scroll-locked] { overscroll-behavior-y: auto !important }추가 (Safari가 Radix의 scroll-lock으로 다이얼로그 내부 스크롤까지 차단하는 것 방지)use-pull-to-refresh.tsdata-scroll-locked체크 추가 (다이얼로그 열림 시 pull-to-refresh 비활성화)crawl-modal.tsxflex flex-col상속으로 중복 클래스 제거CLAUDE.mdARCHITECTURE.mdDesign Decisions
grid→flex flex-colgrid+overflow-y: auto조합이 스크롤 대신 클리핑 발생 (WebKit 버그)translate-y-[-50%]→inset-y-0 my-autotransform이 Safari에서 fixed 자식 요소의 스크롤을 깨뜨림!important사용overscroll-behavior: none을 설정하므로 stylesheet에서 override하려면 필수WebkitOverflowScrolling제거48%제거inset-y-0 my-auto센터링과 불일치하여 애니메이션 잔상 발생Test Plan
🤖 Generated with Claude Code