style(app-hub): 헤더 톤과 프로필 등급 배지 배치를 정리

맥락:
- /app 헤더가 시작 카드 톤과 달라 시각 흐름이 끊기고, 멤버십 등급이 프로필 트리거 내부에 있어 위계가 어색했다.

변경사항:
- AppTopBar를 Start Ritual 카드와 같은 라이트 톤(bg-white/78, text-brand-dark)으로 맞췄다.
- 멤버십 등급을 독립 뷰로 분리하기 위해 entities/user에 MembershipTierBadge 컴포넌트를 추가했다.
- ProfileMenu 트리거에서 등급 배지를 제거하고, 아바타+이름만 남겨 정보 위계를 단순화했다.
- docs/session_brief.md, docs/90_current_state.md에 최신 상태를 반영했다.

검증:
- npx tsc --noEmit

세션-상태: /app 헤더와 프로필 영역의 톤/위계 정렬을 완료했다.
세션-다음: RoomSheet 인원수 기반 UI를 큐레이션형 정보로 치환할지 확정이 필요하다.
세션-리스크: 밝은 사진 배경과 라이트 헤더 조합에서 상단 경계 인지가 약해질 수 있다.
This commit is contained in:
2026-03-01 00:19:43 +09:00
parent e9556afa53
commit a3ecb7b6c2
6 changed files with 46 additions and 18 deletions

View File

@@ -60,8 +60,11 @@ Last Updated: 2026-02-28
- `/app` 허브 배경을 선택 카드 사진 기반 블러로 조정했다.
- 첫 진입 시 첫 카드가 선택된 상태를 명시해 배경/선택 테두리 기준을 고정했다.
- `/app` 헤더와 프로필 트리거를 정리했다.
- 헤더 배경과 로고 왼쪽 `V` 원형 배지를 제거했다.
- 로고 왼쪽 `V` 원형 배지를 제거했다.
- 사용자 이름 왼쪽에 멤버십 등급 배지(`PRO`/`NORMAL`/`TEAM`)를 추가했다.
- `/app` 헤더 톤을 시작 카드와 동일한 라이트 표면으로 재정렬했다.
- 헤더 배경/보더/텍스트를 `지금, 몰입을 시작해요` 카드 톤(`bg-white/78`, `text-brand-dark`)과 맞췄다.
- 멤버십 등급 배지는 프로필 트리거 내부가 아닌, 프로필 왼쪽의 독립 뷰로 분리했다.
- 공간 카드 높이를 고정해 사진 사이즈를 통일하고, 배경 전환 시 resize처럼 보이던 애니메이션 느낌을 완화했다.
- 몰입 모드 ON 시 상단 룸 블록 숨김, 레일 미니화, HUD 저대비, 비네팅 강화가 적용된다.
- 이후 작업은 `docs/work.md`를 기준으로 실행한다.
@@ -81,7 +84,7 @@ Last Updated: 2026-02-28
- 단색 팔레트가 일부 디스플레이에서 유사하게 보일 수 있어 기기별 색 분리도 점검이 필요함
- 외부 이미지 URL 의존으로 소스 만료/속도 이슈 가능성이 있어 자가 호스팅 전환이 필요함
- 배경 블러 강도 증가로 저사양 환경에서 GPU 부담이 늘 수 있어 체감 성능 확인이 필요함
- 헤더 배경 제거로 밝은 배경 구간에서 상단 텍스트 대비가 낮아질 수 있어 점검 필요함
- 밝은 배경 사진과 라이트 헤더가 겹칠 때 상단 요소 경계 인지가 약해질 수 있어 점검 필요함
## 상세 원문 위치