/
Divider
Divider
- 1 Basic UI
- 1.1 1. Single Type
- 1.2 2. Group Type
- 1.2.1 None(No-Line)
- 1.2.2 Border
- 1.2.3 Card
- 1.2.4 Collapse
- 2 Function
Basic UI
영역을 구분짓는 Divider 컴포넌트는 주로 Form 내에서 사용되며, 단일형과 그룹형 2가지 타입으로 크게 구분된다.
1. Single Type
단일 Divider의 기본 UI는 다음과 같이 Label
과 Line
으로 구성되어져 있다.
Dashed
, Hidden Divider
옵션을 추가하여 다음과 같은 UI로 커스터마이징하여 사용 할 수 있다.
Dashed | Hidden Divider |
---|---|
2. Group Type
그룹형의 Divider는 다음과 같이 4가지 타입으로 사용 할 수 있다.
None(No-Line)
그룹형 Divider의 기본 UI는 라인 구분이 없는 None
타입이다.
Border
컴포넌트들을 line으로 그룹핑하는 Border
타입이다.
Card
컴포넌트들을 Card
타입으로 그룹핑하여 사용 할 수 있다.
Collapse
컴포넌트들을 Collapse
타입으로 그룹핑하여 Open/Close 하며 사용 할 수 있다.
Function
1. Direction Type
Single Divider
에서는 Divider의 방향을 설정 할 수 있다. (Horizontal
, Vertical
)
2. Orientation
Single Divider
에서는 라벨의 위치를 설정하는 기능이다. (Left
, Center
, Right
)
3. Number of fields
Group Divider
에서는 필드 출력 Order를 숫자로 직접 입력하여 설정 할 수 있다.
4. Show Buttons
Group Divider
에서는 버튼을 추가하여 사용 할 수 있다.
, multiple selections available,
Related content
List of Components
List of Components
More like this
Layout Components
Layout Components
More like this
List of Components(21.07)
List of Components(21.07)
More like this
Element Components [19]
Element Components [19]
More like this