구현할 기능
인스타그램 프로필 링크로 진입하는 랜딩 페이지 마감 다듬기.
1. 버튼 위치·위계 변경
스토어 전환이 막혔을 때 뜨는 CTA 두 개의 순서를 바꾸고, 앱 설치가 primary 가 되게 한다.
현재는 웹으로 계속 보기 가 위·primary, 앱 설치하러 가기 가 아래·secondary 다.
app/open-app/_components/AppStoreRedirect.tsx:60-67
<Button size="lg" onClick={handleWebContinueClick}>웹으로 계속 보기</Button>
<Button variant="secondary" size="lg" onClick={handleStoreRetryClick}>앱 설치하러 가기</Button>
2. 아이콘 크기 확인
루트(스플래시) 로고와 랜딩 페이지 로고 크기가 달라 보인다. 동일한지 확인 후 맞춘다.
참고
로고는 세 곳 모두 같은 상수를 쓰고 있다 — 원본 146px 을 200/146 으로 scale.
app/_components/SplashClient.tsx — SPLASH_SCALE = SPLASH_LOGO_WIDTH(200) / LOGIN_LOGO_WIDTH(146)
app/open-app/_components/AppStoreRedirect.tsx:18 — SPLASH_LOGO_SCALE = 200 / 146
app/open/_components/OpenLanding.tsx:23 — 동일
다만 스플래시는 애니메이션으로 scale: 1(146px) 까지 줄어들며 위치도 이동한다 (SplashClient.tsx 의 shrink 단계). 랜딩은 200px 고정이라, 비교 시점에 따라 크기가 달라 보일 수 있다.
- 어느 상태를 기준으로 맞출지 확인 필요 (스플래시 초기 200px / 축소 후 146px)
- 하단 CTA 컨테이너가 공통
BottomCta 를 쓰지 않고 fixed + z-20 하드코딩이다 — 하단 바 스펙 통일 이슈와 함께 볼 수 있다
구현할 기능
인스타그램 프로필 링크로 진입하는 랜딩 페이지 마감 다듬기.
1. 버튼 위치·위계 변경
스토어 전환이 막혔을 때 뜨는 CTA 두 개의 순서를 바꾸고, 앱 설치가 primary 가 되게 한다.
현재는
웹으로 계속 보기가 위·primary,앱 설치하러 가기가 아래·secondary 다.app/open-app/_components/AppStoreRedirect.tsx:60-672. 아이콘 크기 확인
루트(스플래시) 로고와 랜딩 페이지 로고 크기가 달라 보인다. 동일한지 확인 후 맞춘다.
참고
로고는 세 곳 모두 같은 상수를 쓰고 있다 — 원본
146px을200/146으로 scale.app/_components/SplashClient.tsx—SPLASH_SCALE = SPLASH_LOGO_WIDTH(200) / LOGIN_LOGO_WIDTH(146)app/open-app/_components/AppStoreRedirect.tsx:18—SPLASH_LOGO_SCALE = 200 / 146app/open/_components/OpenLanding.tsx:23— 동일다만 스플래시는 애니메이션으로
scale: 1(146px) 까지 줄어들며 위치도 이동한다 (SplashClient.tsx의 shrink 단계). 랜딩은 200px 고정이라, 비교 시점에 따라 크기가 달라 보일 수 있다.BottomCta를 쓰지 않고fixed+z-20하드코딩이다 — 하단 바 스펙 통일 이슈와 함께 볼 수 있다