O2 · O4 (묶음)
Overlay
Modal, ActionModal, AlertDialog, CompactConfirmDialog의 기본 overlay 계약
Modal
정보/본문 overlay를 위한 기본 shell. 구체 디자인은 사용 화면에서 확장합니다.
| variant | default | hover(정적 시연) | focus-visible(정적 시연) | active(정적 시연) | disabled |
|---|---|---|---|---|---|
| trigger |
World Draft Picker Modal
임시 저장 사용량, 이어 만들기 목록, 새로운 월드 생성 action을 조합한 Studio 생성 진입 overlay입니다.
Action Modal
create/edit 작업용 modal. Studio 콘텐츠 추가/수정 modal과 같은 CREATE/EDIT eyebrow를 사용합니다.
| variant | default | hover(정적 시연) | focus-visible(정적 시연) | active(정적 시연) | disabled |
|---|---|---|---|---|---|
| create trigger | |||||
| edit trigger |
Alert Dialog
위험하거나 되돌리기 어려운 action confirm. 현재 회원탈퇴 모달 디자인을 기준으로 둡니다.
| variant | default | hover(정적 시연) | focus-visible(정적 시연) | active(정적 시연) | disabled |
|---|---|---|---|---|---|
| destructive trigger |
Compact Confirm Dialog
모드 변경처럼 짧고 되돌릴 수 있는 설정 확인에 사용하는 compact confirm.
| variant | default | hover(정적 시연) | focus-visible(정적 시연) | active(정적 시연) | disabled |
|---|---|---|---|---|---|
| compact trigger |
Settings Confirm Dialogs
설정 페이지 confirmed 상태: 브랜드 모드 변경은 CompactConfirmDialog, 로그아웃은 destructive AlertDialog로 정리합니다.
| variant | default | hover(정적 시연) | focus-visible(정적 시연) | active(정적 시연) | disabled |
|---|---|---|---|---|---|
| mode confirm | |||||
| logout alert |
Login modal completed state
MVP login modal fixture 기준 completed branch와 recovery copy
✓
completed
원래 하려던 일을 이어갈 준비가 됐어요
자동 실행이나 route 이동 없이, 원래 화면에서 사용자가 다시 시도할 수 있다는 가설만 확인합니다.
시도한 행동: 탐색 개인화 설정을 저장하려면 로그인이 필요합니다.
복귀 후보: 탐색 개인화 저장 버튼
탐색 개인화 저장 버튼으로 돌아가 설정 저장을 다시 시도할 수 있습니다.
로그인 modal completed 상태
Responsive
viewport별 overlay trigger wrap·간격 시연