1
0
Fork 0
mirror of https://github.com/twbs/bootstrap.git synced 2022-11-09 12:25:43 -05:00

Fixes #14711: Account for list groups in collapsing panels

This commit is contained in:
Mark Otto 2014-10-02 21:19:20 -07:00
parent e7b5c4c18b
commit 12091b9567
14 changed files with 42 additions and 14 deletions

View file

@ -5302,7 +5302,8 @@ a.list-group-item-danger.active:focus {
.panel-group .panel-heading {
border-bottom: 0;
}
.panel-group .panel-heading + .panel-collapse > .panel-body {
.panel-group .panel-heading + .panel-collapse > .panel-body,
.panel-group .panel-heading + .panel-collapse > .list-group {
border-top: 1px solid #ddd;
}
.panel-group .panel-footer {

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View file

@ -301,7 +301,7 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
this.$active =
this.$items = null
this.options.pause == 'hover' && this.$element
this.options.pause == 'hover' && !('ontouchstart' in document.documentElement) && this.$element
.on('mouseenter.bs.carousel', $.proxy(this.pause, this))
.on('mouseleave.bs.carousel', $.proxy(this.cycle, this))
}

File diff suppressed because one or more lines are too long

View file

@ -105,6 +105,28 @@
</div>
{% endhighlight %}
<p>It's also possible to swap out <code>.panel-body</code>s with <code>.list-group</code>s.</p>
<div class="panel-group">
<div class="panel panel-default">
<div class="panel-heading" role="tab" id="collapseListGroupHeading1">
<h4 class="panel-title">
<a class="collapsed" data-toggle="collapse" href="#collapseListGroup1" aria-expanded="false" aria-controls="collapseListGroup1">
Collapsible list group
</a>
</h4>
</div>
<div id="collapseListGroup1" class="panel-collapse collapse" role="tabpanel" aria-labelledby="collapseListGroupHeading1">
<ul class="list-group">
<li class="list-group-item">Bootply</li>
<li class="list-group-item">One itmus ac facilin</li>
<li class="list-group-item">Second eros</li>
</ul>
<div class="panel-footer">Footer</div>
</div>
</div>
</div>
<p>You can also use the plugin without the accordion markup. Make a button toggle the expanding and collapsing of another element.</p>
{% highlight html %}
<button type="button" class="btn btn-danger" data-toggle="collapse" data-target="#demo" aria-expanded="true" aria-controls="demo">

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View file

@ -5302,7 +5302,8 @@ a.list-group-item-danger.active:focus {
.panel-group .panel-heading {
border-bottom: 0;
}
.panel-group .panel-heading + .panel-collapse > .panel-body {
.panel-group .panel-heading + .panel-collapse > .panel-body,
.panel-group .panel-heading + .panel-collapse > .list-group {
border-top: 1px solid #ddd;
}
.panel-group .panel-footer {

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View file

@ -301,7 +301,7 @@ if (typeof jQuery === 'undefined') { throw new Error('Bootstrap\'s JavaScript re
this.$active =
this.$items = null
this.options.pause == 'hover' && this.$element
this.options.pause == 'hover' && !('ontouchstart' in document.documentElement) && this.$element
.on('mouseenter.bs.carousel', $.proxy(this.pause, this))
.on('mouseleave.bs.carousel', $.proxy(this.cycle, this))
}

File diff suppressed because one or more lines are too long

View file

@ -216,6 +216,7 @@
.panel {
margin-bottom: 0;
border-radius: @panel-border-radius;
+ .panel {
margin-top: 5px;
}
@ -223,10 +224,13 @@
.panel-heading {
border-bottom: 0;
+ .panel-collapse > .panel-body {
+ .panel-collapse > .panel-body,
+ .panel-collapse > .list-group {
border-top: 1px solid @panel-inner-border;
}
}
.panel-footer {
border-top: 0;
+ .panel-collapse .panel-body {