diff --git a/scss/_list-group.scss b/scss/_list-group.scss index dcd61d2b5ef4bf7c8172423159faebf0715888a8..fbc8a3d364e8cf5653196310270bc7e02b91d9ec 100644 --- a/scss/_list-group.scss +++ b/scss/_list-group.scss @@ -23,33 +23,6 @@ } } - -// Interactive list items -// -// Use anchor or button elements instead of `li`s or `div`s to create interactive -// list items. Includes an extra `.active` modifier class for selected items. - -.list-group-item-action { - width: 100%; // For `<button>`s (anchors become 100% by default though) - color: $list-group-action-color; - text-align: inherit; // For `<button>`s (anchors inherit) - - // Hover state - &:hover, - &:focus { - z-index: 1; // Place hover/focus items above their siblings for proper border styling - color: $list-group-action-hover-color; - text-decoration: none; - background-color: $list-group-hover-bg; - } - - &:active { - color: $list-group-action-active-color; - background-color: $list-group-action-active-bg; - } -} - - // Individual list items // // Use on `li`s or `div`s within the `.list-group` parent. @@ -96,6 +69,30 @@ } } +// Interactive list items +// +// Use anchor or button elements instead of `li`s or `div`s to create interactive +// list items. Includes an extra `.active` modifier class for selected items. + +.list-group-item-action { + width: 100%; // For `<button>`s (anchors become 100% by default though) + color: $list-group-action-color; + text-align: inherit; // For `<button>`s (anchors inherit) + + // Hover state + &:hover, + &:focus { + z-index: 1; // Place hover/focus items above their siblings for proper border styling + color: $list-group-action-hover-color; + text-decoration: none; + background-color: $list-group-hover-bg; + } + + &:active { + color: $list-group-action-active-color; + background-color: $list-group-action-active-bg; + } +} // Horizontal //