1
0
mirror of https://github.com/twbs/bootstrap.git synced 2025-02-22 15:39:59 +00:00

move list group variants to be generated from sass map

This commit is contained in:
Mark Otto 2017-06-28 09:29:59 -07:00
parent 91b587ad6a
commit 3e0375e03b
2 changed files with 9 additions and 12 deletions

View File

@ -87,10 +87,9 @@ Use contextual classes to style list items with a stateful background and color.
{% example html %} {% example html %}
<ul class="list-group"> <ul class="list-group">
<li class="list-group-item">Dapibus ac facilisis in</li> <li class="list-group-item">Dapibus ac facilisis in</li>
<li class="list-group-item list-group-item-success">Dapibus ac facilisis in</li>
<li class="list-group-item list-group-item-info">Cras sit amet nibh libero</li> {% for color in site.data.theme-colors %}
<li class="list-group-item list-group-item-warning">Porta ac consectetur ac</li> <li class="list-group-item list-group-item-{{ color.name }}">This is a {{ color.name }} list group item</li>{% endfor %}
<li class="list-group-item list-group-item-danger">Vestibulum at eros</li>
</ul> </ul>
{% endexample %} {% endexample %}
@ -99,10 +98,9 @@ Contextual classes also work with `.list-group-item-action`. Note the addition o
{% example html %} {% example html %}
<div class="list-group"> <div class="list-group">
<a href="#" class="list-group-item list-group-item-action">Dapibus ac facilisis in</a> <a href="#" class="list-group-item list-group-item-action">Dapibus ac facilisis in</a>
<a href="#" class="list-group-item list-group-item-action list-group-item-success">Dapibus ac facilisis in</a>
<a href="#" class="list-group-item list-group-item-action list-group-item-info">Cras sit amet nibh libero</a> {% for color in site.data.theme-colors %}
<a href="#" class="list-group-item list-group-item-action list-group-item-warning">Porta ac consectetur ac</a> <a href="#" class="list-group-item list-group-item-action list-group-item-{{ color.name }}">This is a {{ color.name }} list group item</a>{% endfor %}
<a href="#" class="list-group-item list-group-item-action list-group-item-danger">Vestibulum at eros</a>
</div> </div>
{% endexample %} {% endexample %}

View File

@ -109,7 +109,6 @@
// Add modifier classes to change text and background color on individual items. // Add modifier classes to change text and background color on individual items.
// Organizationally, this must come after the `:hover` states. // Organizationally, this must come after the `:hover` states.
@include list-group-item-variant(success, $state-success-bg, $state-success-text); @each $color, $value in $theme-colors {
@include list-group-item-variant(info, $state-info-bg, $state-info-text); @include list-group-item-variant($color, theme-color-level($color, -9), theme-color-level($color, 6));
@include list-group-item-variant(warning, $state-warning-bg, $state-warning-text); }
@include list-group-item-variant(danger, $state-danger-bg, $state-danger-text);