From e46c998316359f3368d80736d7eb750d85dc4da5 Mon Sep 17 00:00:00 2001 From: Zac Echola Date: Thu, 2 Apr 2015 14:07:53 -0500 Subject: [PATCH 1/2] Adds button styles to `.list-group-item` Includes buttons with anchor sytles and modifies buttons to match width and text alignment. --- less/list-group.less | 12 +++++++++--- less/mixins/list-group.less | 3 ++- 2 files changed, 11 insertions(+), 4 deletions(-) diff --git a/less/list-group.less b/less/list-group.less index 1462ce16b3..216b91230a 100644 --- a/less/list-group.less +++ b/less/list-group.less @@ -38,12 +38,13 @@ } -// Linked list items +// Interactive list items // -// Use anchor elements instead of `li`s or `div`s to create linked list items. +// Use anchor or button elements instead of `li`s or `div`s to create interactive items. // Includes an extra `.active` modifier class for showing selected items. -a.list-group-item { +a.list-group-item, +button.list-group-item { color: @list-group-link-color; .list-group-item-heading { @@ -59,6 +60,11 @@ a.list-group-item { } } +button.list-group-item { + width: 100%; + text-align: left; +} + .list-group-item { // Disabled state &.disabled, diff --git a/less/mixins/list-group.less b/less/mixins/list-group.less index 8b5b065cb8..03aa19069d 100644 --- a/less/mixins/list-group.less +++ b/less/mixins/list-group.less @@ -5,7 +5,8 @@ color: @color; background-color: @background; - a& { + a&, + button& { color: @color; .list-group-item-heading { From fa2cdd44bc0f0d739bcf91683f0288b0adc2bed1 Mon Sep 17 00:00:00 2001 From: Zac Echola Date: Tue, 28 Apr 2015 10:58:42 -0500 Subject: [PATCH 2/2] Adds documentation for buttons in link groups Mostly a duplication of the *Linked items* section, but for buttons. Includes a note not to use the standard btn classes. --- docs/_includes/components/list-group.html | 21 +++++++++++++++++++++ docs/_includes/nav/components.html | 1 + 2 files changed, 22 insertions(+) diff --git a/docs/_includes/components/list-group.html b/docs/_includes/components/list-group.html index e95c9d4859..607b1e6614 100644 --- a/docs/_includes/components/list-group.html +++ b/docs/_includes/components/list-group.html @@ -74,6 +74,27 @@ Porta ac consectetur ac Vestibulum at eros +{% endhighlight %} + +

Button items

+

List group items may be buttons instead of list items (that also means a parent <div> instead of an <ul>). No need for individual parents around each element. Don't use the standard .btn classes here.

+
+
+ + + + + +
+
+{% highlight html %} +
+ + + + + +
{% endhighlight %}

Disabled items

diff --git a/docs/_includes/nav/components.html b/docs/_includes/nav/components.html index 49c8040c53..9c91bdada1 100644 --- a/docs/_includes/nav/components.html +++ b/docs/_includes/nav/components.html @@ -124,6 +124,7 @@
  • Basic example
  • Badges
  • Linked items
    • +
  • Button items
  • Disabled items
  • Contextual classes
  • Custom content