Latched state for buttons

[swervo]

It would be really useful to have a built-in latched state for buttons particularly for radio button sets or latched button sets. There appears to be a class for this:

.slds-is-selected

but the corresponding stylings don't appear to be present.

There are examples of these here (at the bottom of the page):

https://bootforce.herokuapp.com/

And the CSS I added to make these work is here:

https://github.com/swervo/bootforce/blob/master/app/sass/hacks/_overwrites.scss

[swervo]

Pull request here:

#101

[stefsullrew]

It looks to me like you want a button group with stateful buttons (buttons that can be toggled on and off and hold their state).

If so, you can view the button-group with icons in the right side of this header:
http://www.lightningdesignsystem.com/components/page-headers#object-home

Does that seem like what you're looking for?

[swervo]

It's related but not really.

In the simplest terms I'd like to be able to have a simple button that stays down when I click it. At the moment this doesn't seem to be supported by your CSS. There is a class name:

.slds-is-selected

but when this is applied to a simple button it has no effect.

This means I can't easily make a radio button set or a simple latched button set (the icon set is a latched button set - but seems to be specific to the icon button set).

Like I said in my original post there are examples of what I would like to achieve here (at the bottom of the page):

https://bootforce.herokuapp.com/

My PR is only adding selected state styles for the standard buttons. It won't have any impact on anything else.

[kaelig]

Thanks for the Pull Request, @swervo.

@stefsullrew Should we use aria states such as aria-pressed and aria-selected instead of classes?

[stefsullrew]

Hi @swervo - we've added both a radio button and checkbox version of "latched buttons" (meaning, they look like a button-group. You can find them here...

Radio - http://www.lightningdesignsystem.com/components/forms/#flavor-radio-group-alternate
Checkbox - http://www.lightningdesignsystem.com/components/forms/#flavor-checkbox-alternate