2
0
mirror of https://github.com/tenrok/bootstrap.git synced 2026-06-05 16:42:29 +03:00

Drop the accordion for the panel

* Deletes the accordion.less file
* Extends the panel to be collapsible with our JS plugin
* Supports panel color variations
This commit is contained in:
Mark Otto
2013-08-12 23:36:25 -07:00
parent 54a3e4b780
commit 237640c706
11 changed files with 231 additions and 112 deletions
+45 -15
View File
@@ -2386,12 +2386,16 @@ body { padding-bottom: 70px; }
<p>By default, all the <code>.panel</code> does is apply some basic border and padding to contain some content.</p>
<div class="bs-example">
<div class="panel">
Basic panel example
<div class="panel-body">
Basic panel example
</div>
</div>
</div>
{% highlight html %}
<div class="panel">
Basic panel example
<div class="panel-body">
Basic panel example
</div>
</div>
{% endhighlight %}
@@ -2400,26 +2404,34 @@ body { padding-bottom: 70px; }
<div class="bs-example">
<div class="panel">
<div class="panel-heading">Panel heading</div>
Panel content
<div class="panel-body">
Panel content
</div>
</div>
<div class="panel">
<div class="panel-heading">
<h3 class="panel-title">Panel title</h3>
</div>
Panel content
<div class="panel-body">
Panel content
</div>
</div>
</div>
{% highlight html %}
<div class="panel">
<div class="panel-heading">Panel heading</div>
Panel content
<div class="panel-body">
Panel content
</div>
</div>
<div class="panel">
<div class="panel-heading">
<h3 class="panel-title">Panel title</h3>
</div>
Panel content
<div class="panel-body">
Panel content
</div>
</div>
{% endhighlight %}
@@ -2427,13 +2439,17 @@ body { padding-bottom: 70px; }
<p>Wrap buttons or secondary text in <code>.panel-footer</code>.</p>
<div class="bs-example">
<div class="panel">
Panel content
<div class="panel-body">
Panel content
</div>
<div class="panel-footer">Panel footer</div>
</div>
</div>
{% highlight html %}
<div class="panel">
Panel content
<div class="panel-body">
Panel content
</div>
<div class="panel-footer">Panel footer</div>
</div>
{% endhighlight %}
@@ -2445,31 +2461,41 @@ body { padding-bottom: 70px; }
<div class="panel-heading">
<h3 class="panel-title">Panel title</h3>
</div>
Panel content
<div class="panel-body">
Panel content
</div>
</div>
<div class="panel panel-success">
<div class="panel-heading">
<h3 class="panel-title">Panel title</h3>
</div>
Panel content
<div class="panel-body">
Panel content
</div>
</div>
<div class="panel panel-warning">
<div class="panel-heading">
<h3 class="panel-title">Panel title</h3>
</div>
Panel content
<div class="panel-body">
Panel content
</div>
</div>
<div class="panel panel-danger">
<div class="panel-heading">
<h3 class="panel-title">Panel title</h3>
</div>
Panel content
<div class="panel-body">
Panel content
</div>
</div>
<div class="panel panel-info">
<div class="panel-heading">
<h3 class="panel-title">Panel title</h3>
</div>
Panel content
<div class="panel-body">
Panel content
</div>
</div>
</div>
{% highlight html %}
@@ -2486,7 +2512,9 @@ body { padding-bottom: 70px; }
<div class="panel">
<!-- Default panel contents -->
<div class="panel-heading">Panel heading</div>
<p>Some default panel content here. Nulla vitae elit libero, a pharetra augue. Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
<div class="panel-body">
<p>Some default panel content here. Nulla vitae elit libero, a pharetra augue. Aenean lacinia bibendum nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
</div>
<!-- List group -->
<ul class="list-group">
@@ -2502,7 +2530,9 @@ body { padding-bottom: 70px; }
<div class="panel">
<!-- Default panel contents -->
<div class="panel-heading">Panel heading</div>
<p>...</p>
<div class="panel-body">
<p>...</p>
</div>
<!-- List group -->
<ul class="list-group">