세 번째는 확인 및 경고에 많이 쓰이는 모달 창입니다. 용도는 중요한 결정 및 삭제할 때 사용되며, 그렇기 때문에 사용자가 집중할 필요가 있습니다. 그래서 모달을 제외한 배경을 어둡게 처리해서 대비를 강하게 하는 게 기본입니다. 모달 창이 나올 때 빠르게 애니메이션을 적용하는 것도 방법입니다. 단순 확인만 하는 모달 창이라면 버튼이 하나만 있으면 되며, 경우에 따라서는 간단한 인풋도 들어가는 경우가 있지만 지금은 가장 기본 형태만 작업을 하였습니다.
하위 컴포넌트 목록 및 상태
- button/item - 기본 버튼 형태
- button/container - 버튼 컨테이너이며, single, vertical, horizontal로 구분
- contents - 모달의 타이틀, 이미지(옵션), 내용을 포함
- modal - contents,button/container를 수직으로 배치
사용된 이미지 출처는 icons8 입니다
'100 to the future' 카테고리의 다른 글
[6/100] appbar (0) | 2022.09.16 |
---|---|
[5/100] button (0) | 2022.09.14 |
[4/100] input-number (0) | 2022.09.13 |
[2/100] BNB (0) | 2022.09.09 |
[1/100] date-picker (0) | 2022.09.07 |