ButtonSet
ButtonSet은 여러 개의 버튼을 그룹 형태로 묶을 때 사용합니다.
주로 동일한 기능군의 액션 버튼에서 활용하며, 버튼 크기에 따라 간격(gap)도 함께 조정됩니다.
Gap
간격은 일반적으로 버튼 크기에 기반해 설정하지만, 별도로 지정할 수도 있습니다.
| Class | Example |
|---|---|
| Default (is-md) |
|
| is-lg |
|
현재는 is-sm 버튼에도 Default적으로 is-md 간격이 적용됩니다.
추후 is-sm 전용 간격 추가 여부는 논의 후 결정할 예정입니다.
2025. 04. 14. (월) 작성자 김수진
Alignment
버튼 그룹의 정렬은 .is-left, .is-right, .is-between 클래스로 조정할 수 있습니다.
| Class | Example |
|---|---|
| Default |
|
| is-left |
|
| is-right |
|
| is-between |
|
| is-column |
|
is-column은 테스트용 추가 옵션이며, 사용성에 따라 향후 개선될 수 있습니다.
2025. 04. 15. (화) 작성자 김수진
Group
여러 개의 .btn-set을 한 행에 배치할 때 .btn-set-group 클래스를 사용합니다.
.btn-set이 우측에 위치해 있는 경우 .ml-auto클래스를 붙여줍니다.
|
|