Button group

Button Groups

Groups Buttons

Standard Group

usage: #button:group:<size>(<aria-label>)

Standard Size

#button:group("group-button") {
    #button:primary("Left")
    #button:secondary("Middle")
    #button:success("Right")
}

Large Size

usage: #button:group:large(<aria-label>)

#button:group:large("group-button-lg") {
    #button:primary("Left")
    #button:secondary("Middle")
    #button:success("Right")
}

Small Size

usage: #button:group:small(<aria-label>)

#button:group:small("group-button-sm") {
    #button:primary("Left")
    #button:secondary("Middle")
    #button:success("Right")
}

Vertical Button Group

usage: #button:group:vertical:<size>(<aria-label>)

Standard Size

#button:group:vertical() {
    #button:primary("Top")
    #button:secondary("Middle")
    #button:success("Bottom")
}

Large Size

usage: #button:group:vertical:large(<aria-label>)

#button:group:vertical() {
    #button:primary("Top")
    #button:secondary("Middle")
    #button:success("Bottom")
}

Small Size

usage: #button:group:vertical(<aria-label>)

#button:group:vertical() {
    #button:primary("Top")
    #button:secondary("Middle")
    #button:success("Bottom")
}