WEB UI Styleguide
Rule Guide
네임 작성규칙
폴더 구조
Component
Font
Color
Form
Button
Grid
Dropdown List
Table
Pop Up
Page List
로그인 & 메인화면
시스템관리
MOTOR 제품포장관리
INVERTER 제품포장관리
모니터링
관리자메뉴
Pop Up
Pop Up
팝업창의 아이콘 모양에 따라 내용을 달리 표현 하였으며, 타이틀에 따라 폰트 굵기를 다르게 사용합니다.
질문 Question
상태에 따른 아이콘과 타이틀에 따라 두가지 폰트 굵기로 구분합니다.
더블 타이틀
Click Me!
타이틀
Click Me!
[Title]
title
아이콘
Placeholder text
YES
NO
title
아이콘
Placeholder text
YES
NO
오류/경고 Error/Warnning
상태에 따른 아이콘과 타이틀에 따라 두가지 폰트 굵기로 구분합니다.
더블 타이틀
Click Me!
타이틀
Click Me!
[Title]
title
아이콘
Placeholder text
OK
Title
아이콘
Placeholder text
OK
일반 팝업 No Icon
일반 팝업은 아이콘이 없습니다.
더블 타이틀
Click Me!
타이틀
Click Me!
[Title]
title
Placeholder text
OK
title
Placeholder text
OK
실패 Failed
실패 상태를 아이콘으로 표시합니다.
타이틀
Click Me!
title
아이콘
Placeholder text
OK
성공 Success
성공 상태를 아이콘으로 표시합니다.
더블 타이틀
Click Me!
타이틀
Click Me!
[Title]
Title
아이콘
Placeholder text
OK
Title
아이콘
Placeholder text
OK
진행상태 Progress
Value를 표시하여 진행 상태를 보여줍니다.
상태 진행바
Click Me!
Exporting
10%
100%
Cancel