wiki:plugin:bootswrapper:panel

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

Both sides previous revision Previous revision
Next revision
Previous revision
wiki:plugin:bootswrapper:panel [2016/08/21 01:37]
Giuseppe Di Terlizzi
wiki:plugin:bootswrapper:panel [2016/08/21 01:52]
Giuseppe Di Terlizzi
Line 45: Line 45:
 </code> </code>
  
-===== Panel with icons =====+===== With tables =====
  
-<panel type="default" title="Title of Panel" subtitle="Subtitle" icon="glyphicon glyphicon-home">+Add any non-bordered table within a panel for a seamless design. If there is a ''no-body'' attribute, we add an extra border to the top of the table for separation. 
 + 
 +<panel type="default" title="Panel title" no-body="true"> 
 +<panel-body>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.</panel-body> 
 +^ # ^ First Name ^ Last Name ^ Username ^ 
 +^ 1 | Mark       | Otto      | @mdo     | 
 +^ 2 | Jacob      | Thornton  | @fat     | 
 +^ 3 | Larry      | the Bird  | @twitter | 
 +</panel> 
 + 
 +\\ 
 + 
 +<code html5><panel type="default" title="Panel title" no-body="true"> 
 +<panel-body>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.</panel-body> 
 +^ # ^ First Name ^ Last Name ^ Username ^ 
 +^ 1 | Mark       | Otto      | @mdo     | 
 +^ 2 | Jacob      | Thornton  | @fat     | 
 +^ 3 | Larry      | the Bird  | @twitter | 
 +</panel></code> 
 + 
 +If there is no panel body, the component moves from panel header to table without interruption. 
 + 
 +<panel type="default" title="Panel title" no-body="true"> 
 +^ # ^ First Name ^ Last Name ^ Username ^ 
 +^ 1 | Mark       | Otto      | @mdo     | 
 +^ 2 | Jacob      | Thornton  | @fat     | 
 +^ 3 | Larry      | the Bird  | @twitter | 
 +</panel> 
 + 
 +\\ 
 + 
 +<code html5><panel type="default" title="Panel title" no-body="true"> 
 +^ # ^ First Name ^ Last Name ^ Username ^ 
 +^ 1 | Mark       | Otto      | @mdo     | 
 +^ 2 | Jacob      | Thornton  | @fat     | 
 +^ 3 | Larry      | the Bird  | @twitter | 
 +</panel></code> 
 + 
 +===== With list groups ===== 
 + 
 +Easily include full-width [[list-group|list groups]] within any panel. 
 + 
 +<panel type="default" title="Panel title" no-body="true"> 
 +<panel-body>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.</panel-body> 
 +<list-group> 
 +  * Cras justo odio 
 +  * Dapibus ac facilisis in 
 +  * Morbi leo risus 
 +  * Porta ac consectetur ac 
 +  * Vestibulum at eros 
 +</list-group></panel> 
 + 
 +\\ 
 + 
 +<code html5><panel type="default" title="Panel title" no-body="true"> 
 +<panel-body>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.</panel-body> 
 +<list-group> 
 +  * Cras justo odio 
 +  * Dapibus ac facilisis in 
 +  * Morbi leo risus 
 +  * Porta ac consectetur ac 
 +  * Vestibulum at eros 
 +</list-group></panel></code> 
 + 
 + 
 +===== With icons ===== 
 + 
 +<panel type="default" title="Panel title" subtitle="Panel subtitle" icon="glyphicon glyphicon-home">
 Panel content Panel content
 </panel> </panel>
 \\ \\
-<code html5><panel type="default" title="Title of Panel" subtitle="Subtitle" icon="glyphicon glyphicon-home">+<code html5><panel type="default" title="Panel title" subtitle="Panel subtitle" icon="glyphicon glyphicon-home">
 Panel content Panel content
 </panel></code> </panel></code>
Line 63: Line 130:
 | ''subtitle'' | optional | | Subtitle of panel | | ''subtitle'' | optional | | Subtitle of panel |
 | ''icon''     | optional | | Font icon class (eg. Glyphicon or Font-Awesome) | | ''icon''     | optional | | Font icon class (eg. Glyphicon or Font-Awesome) |
-| ''nobody''   | optional | | Don't add a panel body. Useful to add other particular tags (or tables) inside a panels |+| ''no-body''  | optional | | Don't add a panel body. Useful to add other particular tags (or tables) inside a panels |
  
  • wiki/plugin/bootswrapper/panel.txt
  • Last modified: 5 years ago
  • by Giuseppe Di Terlizzi