diff options
Diffstat (limited to 'docs/docs.html')
| -rw-r--r-- | docs/docs.html | 69 |
1 files changed, 69 insertions, 0 deletions
diff --git a/docs/docs.html b/docs/docs.html index 4b2629658..00af4ed0c 100644 --- a/docs/docs.html +++ b/docs/docs.html @@ -4369,6 +4369,75 @@ For example, <code><section></code> should be wrapped as inline. + <!-- Panels + ================================================== --> + <div class="bs-docs-section" id="panels"> + <div class="page-header"> + <h1>Panels</h1> + </div> + <p class="lead">While not always necessary, sometimes you need to put your DOM in a box. For those situations, try the panel component.</p> + + <h3>Basic panel</h3> + <p>By default, all the <code>.panel</code> does is apply some basic border and padding to contain some content.</p> + <div class="bs-docs-example"> + <div class="panel"> + Basic panel example + </div> + </div> +{% highlight html linenos %} +<div class="panel"> + Basic panel example +</div> +{% endhighlight %} + + <h3>Panel with heading</h3> + <p>Easily add a heading to your panel with <code>.panel-heading</code>. Use it on a <code><div></code> or any heading element (e.g., <code><h3></code>).</p> + <div class="bs-docs-example"> + <div class="panel"> + <div class="panel-heading">Panel heading</div> + Panel content + </div> + </div> +{% highlight html linenos %} +<div class="panel"> + <div class="panel-heading">Panel heading</div> + Panel content +</div> +{% endhighlight %} + + <h3>Contextual alternatives</h3> + <p>Like other components, easily make a panel more meaningful to a particular context by adding any of the contextual state classes.</p> + <div class="bs-docs-example"> + <div class="panel panel-success"> + <div class="panel-heading">Panel heading</div> + Panel content + </div> + <div class="panel panel-warning"> + <div class="panel-heading">Panel heading</div> + Panel content + </div> + <div class="panel panel-danger"> + <div class="panel-heading">Panel heading</div> + Panel content + </div> + <div class="panel panel-info"> + <div class="panel-heading">Panel heading</div> + Panel content + </div> + </div> +{% highlight html linenos %} +<div class="panel panel-success">...</div> +<div class="panel panel-warning">...</div> +<div class="panel panel-danger">...</div> +<div class="panel panel-info">...</div> +{% endhighlight %} + + </div> + + + + + <!-- Wells ================================================== --> <div class="bs-docs-section" id="wells"> |