10 merge requests!28721Hot test,!27561Adds font-weight-medium to font weight classes,!22391V4 dev,!22547Finished a new translation for bootstrap,!22143Fix selectable disabled toggle radio buttons,!22598test,!25326Adjust examples,!23995Add back cursor: pointer for .btn-link,!23178Spinner,!17021v4
@@ -87,10 +87,23 @@ With `<button>`s, you can also make use of the `disabled` attribute instead of t
## Contextual classes
Use contextual classes to style list items, default or linked. Also includes `.active` state.
Use contextual classes to style list items with a stateful background and color.
{% example html %}
<ulclass="list-group">
<liclass="list-group-item">Dapibus ac facilisis in</li>
<liclass="list-group-item list-group-item-success">Dapibus ac facilisis in</li>
<liclass="list-group-item list-group-item-info">Cras sit amet nibh libero</li>
<liclass="list-group-item list-group-item-warning">Porta ac consectetur ac</li>
<liclass="list-group-item list-group-item-danger">Vestibulum at eros</li>
</ul>
{% endexample %}
Contextual classes also work with `.list-group-item-action`. Note the addition of the hover styles here not present in the previous example. Also supported is the `.active` state; apply it to indicate an active selection on a contextual list group item.
{% example html %}
<divclass="list-group">
<ahref="#"class="list-group-item list-group-item-action">Dapibus ac facilisis in</a>
<ahref="#"class="list-group-item list-group-item-action list-group-item-success">Dapibus ac facilisis in</a>
<ahref="#"class="list-group-item list-group-item-action list-group-item-info">Cras sit amet nibh libero</a>
<ahref="#"class="list-group-item list-group-item-action list-group-item-warning">Porta ac consectetur ac</a>
