Remove borders on the top and/or bottom when .list-group-flush is the first and/or last child

[Starsam80]

Fully fixes #20395

Before:

After:

[mdo]

Hmm, kinda torn on this. This basically just reimplements the .card...

[Starsam80]

Well, all I did was take this code from 955e040#diff-cd8ec88dc7823a5c78f7111e37a78adbL41, and it also fixes things like this:

Edit: Here is a jsfiddle if you want to take a look at it: https://jsfiddle.net/vdny76cc/1/

[Lausselloic]

Hi, the double border top and bottom still be present into alpha.5 http://v4-alpha.getbootstrap.com/components/card/#content-types

Maybe just add a border-top: 0 to the first list-group-item and border-bottom: 0 to the last one?
in _card.scss line 51-63 actual code
.card {

.list-group:first-child {
.list-group-item:first-child {
@include border-top-radius($card-border-radius);
}
}

.list-group:last-child {
.list-group-item:last-child {
@include border-bottom-radius($card-border-radius);
}
}
}

Proposition to fix it :
.card {

.list-group:first-child {
.list-group-item:first-child {
@include border-top-radius($card-border-radius);
border-top: 0;
}
}

.list-group:last-child {
.list-group-item:last-child {
@include border-bottom-radius($card-border-radius);
border-bottom: 0;
}
}
}

[mdo]

Well, all I did was take this code from 955e040#diff-cd8ec88dc7823a5c78f7111e37a78adbL41, and it also fixes things like this:

Ahhhh yeah @Starsam80, good point. 😆 Merging!