}
}
+// 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.
}
}
-// 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
//
// Change the layout of list group items from vertical (default) to horizontal.