Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

proper styling list-group in collapsible panel #14711

Closed
nereusz opened this issue Oct 1, 2014 · 1 comment
Closed

proper styling list-group in collapsible panel #14711

nereusz opened this issue Oct 1, 2014 · 1 comment
Labels
Milestone

Comments

@nereusz
Copy link

nereusz commented Oct 1, 2014

I would like to introduce small improvement to BS. I'm not very familiar with BS internal coding, so maybe somebody will apply this to BS.

First of all: it is possible to use .list-group instead of .panel-body in regular use (first column of sample).

Problem: making panels with accordion feature on panel-like elements. When I want to put .list-group instead of .panel-body, the appearance is broken (second column of example).

Then I played a little with CSS and prepared a little patch for this (third column). I added .add class at beginning to show example only in one column.

Here is this example: http://www.bootply.com/xia3cligxm

Please consider incorporating this to BS.

CSS that should be added:

.panel-heading + .collapsing > .list-group .list-group-item:first-child,
.panel-heading + .collapse > .list-group .list-group-item:first-child {
    border-top-width: 0;
}

.panel > .collapsing > .list-group .list-group-item,
.panel > .collapse > .list-group .list-group-item {
    border-radius: 0;
    border-width: 1px 0;
}

.panel > .collapsing > .list-group,
.panel > .collapse > .list-group {
    margin-bottom: 0;
}
@nereusz
Copy link
Author

nereusz commented Oct 1, 2014

Forgot something: please test this with .panel-group, especially the first CSS rule.

@nereusz nereusz closed this as completed Oct 1, 2014
@nereusz nereusz reopened this Oct 1, 2014
@cvrebert cvrebert added the css label Oct 1, 2014
@mdo mdo added this to the v3.2.1 milestone Oct 3, 2014
@mdo mdo closed this as completed in 12091b9 Oct 3, 2014
stempler pushed a commit to stempler/bootstrap that referenced this issue Nov 4, 2014
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

3 participants