From 527eccaa9f344c555e33f5324775cf2e24e9bf55 Mon Sep 17 00:00:00 2001 From: Mark Otto Date: Tue, 8 Jul 2014 03:56:47 -0700 Subject: Drop: Panels completely, as they'll be replaced --- docs/_includes/components/panels.html | 279 ---------------------------------- 1 file changed, 279 deletions(-) delete mode 100644 docs/_includes/components/panels.html (limited to 'docs/_includes/components/panels.html') diff --git a/docs/_includes/components/panels.html b/docs/_includes/components/panels.html deleted file mode 100644 index acf32c51c..000000000 --- a/docs/_includes/components/panels.html +++ /dev/null @@ -1,279 +0,0 @@ -
-

Panels

- -

While not always necessary, sometimes you need to put your DOM in a box. For those situations, try the panel component.

- -

Basic example

-

By default, all the .panel does is apply some basic border and padding to contain some content.

-
-
-
- Basic panel example -
-
-
-{% highlight html %} -
-
- Basic panel example -
-
-{% endhighlight %} - -

Panel with heading

-

Easily add a heading container to your panel with .panel-heading. You may also include any <h1>-<h6> with a .panel-title class to add a pre-styled heading.

-

For proper link coloring, be sure to place links in headings within .panel-title.

-
-
-
Panel heading without title
-
- Panel content -
-
-
-
-

Panel title

-
-
- Panel content -
-
-
-{% highlight html %} -
-
Panel heading without title
-
- Panel content -
-
- -
-
-

Panel title

-
-
- Panel content -
-
-{% endhighlight %} - - -

Wrap buttons or secondary text in .panel-footer. Note that panel footers do not inherit colors and borders when using contextual variations as they are not meant to be in the foreground.

-
-
-
- Panel content -
- -
-
-{% highlight html %} -
-
- Panel content -
- -
-{% endhighlight %} - -

Contextual alternatives

-

Like other components, easily make a panel more meaningful to a particular context by adding any of the contextual state classes.

-
-
-
-

Panel title

-
-
- Panel content -
-
-
-
-

Panel title

-
-
- Panel content -
-
-
-
-

Panel title

-
-
- Panel content -
-
-
-
-

Panel title

-
-
- Panel content -
-
-
-
-

Panel title

-
-
- Panel content -
-
-
-{% highlight html %} -
...
-
...
-
...
-
...
-
...
-{% endhighlight %} - -

With tables

-

Add any non-bordered .table within a panel for a seamless design. If there is a .panel-body, we add an extra border to the top of the table for separation.

-
-
- -
Panel heading
-
-

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.

-
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
#First NameLast NameUsername
1MarkOtto@mdo
2JacobThornton@fat
3Larrythe Bird@twitter
-
-
-{% highlight html %} -
- -
Panel heading
-
-

...

-
- - - - ... -
-
-{% endhighlight %} - -

If there is no panel body, the component moves from panel header to table without interruption.

-
-
- -
Panel heading
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
#First NameLast NameUsername
1MarkOtto@mdo
2JacobThornton@fat
3Larrythe Bird@twitter
-
-
-{% highlight html %} -
- -
Panel heading
- - - - ... -
-
-{% endhighlight %} - - -

With list groups

-

Easily include full-width list groups within any panel.

-
-
- -
Panel heading
-
-

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.

-
- - -
    -
  • Cras justo odio
  • -
  • Dapibus ac facilisis in
  • -
  • Morbi leo risus
  • -
  • Porta ac consectetur ac
  • -
  • Vestibulum at eros
  • -
-
-
-{% highlight html %} -
- -
Panel heading
-
-

...

-
- - -
    -
  • Cras justo odio
  • -
  • Dapibus ac facilisis in
  • -
  • Morbi leo risus
  • -
  • Porta ac consectetur ac
  • -
  • Vestibulum at eros
  • -
-
-{% endhighlight %} -
-- cgit v1.2.3