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
example [2018/08/31 13:18] – nampara17example [2018/08/31 13:36] (current) – nampara17
Line 416: Line 416:
  
 </WRAP> </WRAP>
- 
  
 <code> <code>
Line 457: Line 456:
 ==== Bootswrapper plugin ==== ==== Bootswrapper plugin ====
  
-Jumbotron+==== Jumbotron ====
  
 +<code>
 <jumbotron> <jumbotron>
 ===== Hello, world! ===== ===== Hello, world! =====
Line 466: Line 466:
 content or information. content or information.
 </jumbotron> </jumbotron>
 +</code>
  
-Panel+<jumbotron> 
 +===== Hello, world! =====
  
 +This is a simple hero unit, a simple jumbotron-style 
 +component for calling extra attention to featured
 +content or information.
 +</jumbotron>
 +
 +==== Panel ====
 +
 +<code>
 <panel type="default" title="Title of Panel" subtitle="Subtitle" icon="fa fa-home"> <panel type="default" title="Title of Panel" subtitle="Subtitle" icon="fa fa-home">
 Panel content Panel content
 </panel> </panel>
 +</code>
  
-Alert+<panel type="default" title="Title of Panel" subtitle="Subtitle" icon="fa fa-home"> 
 +Panel content 
 +</panel>
  
 +==== Alert ====
 +
 +<code>
 <alert type="success" icon="glyphicon glyphicon-user" dismiss="true"> <alert type="success" icon="glyphicon glyphicon-user" dismiss="true">
 **Well done!** You successfully read this important alert message. **Well done!** You successfully read this important alert message.
 </alert> </alert>
 +</code>
  
-Text+<alert type="success" icon="glyphicon glyphicon-user" dismiss="true"> 
 +**Well done!** You successfully read this important alert message. 
 +</alert>
  
 +==== Text ====
 +
 +<code>
   * <text type="muted">muted</text>   * <text type="muted">muted</text>
   * <text type="primary">primary</text>   * <text type="primary">primary</text>
Line 487: Line 509:
   * <text type="warning">warning</text>   * <text type="warning">warning</text>
   * <text type="danger">danger</text>   * <text type="danger">danger</text>
 +</code>
  
-Tooltip+  * <text type="muted">muted</text> 
 +  * <text type="primary">primary</text> 
 +  * <text type="success">success</text> 
 +  * <text type="info">info</text> 
 +  * <text type="warning">warning</text> 
 +  * <text type="danger">danger</text>
  
 +==== Tooltip ====
 +
 +<code>
 <tooltip title="Sample Text" placement="bottom">Lorem ipsum</tooltip> dolor sit amet... <tooltip title="Sample Text" placement="bottom">Lorem ipsum</tooltip> dolor sit amet...
 +</code>
  
-Grid+<tooltip title="Sample Text" placement="bottom">Lorem ipsum</tooltip> dolor sit amet...
  
 +==== Grid ====
 +
 +<code>
 <grid> <grid>
-<col sm="6">.col-sm-6 - column 1</col> +<col sm="6">.col-sm-6 - Nulla quis lorem ut libero malesuada feugiat. Donec rutrum congue leo eget malesuada. Curabitur arcu erat, accumsan id imperdiet et, porttitor at sem. 
-<col sm="6">.col-sm-6 - column 2</col>+ 
 +Curabitur arcu erat, accumsan id imperdiet et, porttitor at sem. Cras ultricies ligula sed magna dictum porta. Curabitur aliquet quam id dui posuere blandit. 
 + 
 +Cras ultricies ligula sed magna dictum porta. Mauris blandit aliquet elit, eget tincidunt nibh pulvinar a. Quisque velit nisi, pretium ut lacinia in, elementum id enim.</col> 
 +<col sm="6">.col-sm-6 - Nulla quis lorem ut libero malesuada feugiat. Donec rutrum congue leo eget malesuada. Curabitur arcu erat, accumsan id imperdiet et, porttitor at sem. 
 + 
 +Curabitur arcu erat, accumsan id imperdiet et, porttitor at sem. Cras ultricies ligula sed magna dictum porta. Curabitur aliquet quam id dui posuere blandit. 
 + 
 +Cras ultricies ligula sed magna dictum porta. Mauris blandit aliquet elit, eget tincidunt nibh pulvinar a. Quisque velit nisi, pretium ut lacinia in, elementum id enim.</col>
 </grid> </grid>
 +</code>
  
 +<grid>
 +<col sm="6">.col-sm-6 - Nulla quis lorem ut libero malesuada feugiat. Donec rutrum congue leo eget malesuada. Curabitur arcu erat, accumsan id imperdiet et, porttitor at sem.
 +
 +Curabitur arcu erat, accumsan id imperdiet et, porttitor at sem. Cras ultricies ligula sed magna dictum porta. Curabitur aliquet quam id dui posuere blandit.
 +
 +Cras ultricies ligula sed magna dictum porta. Mauris blandit aliquet elit, eget tincidunt nibh pulvinar a. Quisque velit nisi, pretium ut lacinia in, elementum id enim.</col>
 +<col sm="6">.col-sm-6 - Nulla quis lorem ut libero malesuada feugiat. Donec rutrum congue leo eget malesuada. Curabitur arcu erat, accumsan id imperdiet et, porttitor at sem.
 +
 +Curabitur arcu erat, accumsan id imperdiet et, porttitor at sem. Cras ultricies ligula sed magna dictum porta. Curabitur aliquet quam id dui posuere blandit.
 +
 +Cras ultricies ligula sed magna dictum porta. Mauris blandit aliquet elit, eget tincidunt nibh pulvinar a. Quisque velit nisi, pretium ut lacinia in, elementum id enim.</col>
 +</grid>
 +
 +==== Variable size cols ====
 +
 +<code>
 <grid> <grid>
 <col xs="12" sm="6" lg="8">.col-xs-12 .col-sm-6 .col-lg-8 Nulla quis lorem ut libero malesuada feugiat. Donec rutrum congue leo eget malesuada. Curabitur arcu erat, accumsan id imperdiet et, porttitor at sem. <col xs="12" sm="6" lg="8">.col-xs-12 .col-sm-6 .col-lg-8 Nulla quis lorem ut libero malesuada feugiat. Donec rutrum congue leo eget malesuada. Curabitur arcu erat, accumsan id imperdiet et, porttitor at sem.
Line 511: Line 571:
 Cras ultricies ligula sed magna dictum porta. Mauris blandit aliquet elit, eget tincidunt nibh pulvinar a. Quisque velit nisi, pretium ut lacinia in, elementum id enim.</col> Cras ultricies ligula sed magna dictum porta. Mauris blandit aliquet elit, eget tincidunt nibh pulvinar a. Quisque velit nisi, pretium ut lacinia in, elementum id enim.</col>
 </grid> </grid>
 +</code>
  
-Thumbnail+<grid> 
 +<col xs="12" sm="6" lg="8">.col-xs-12 .col-sm-6 .col-lg-8 Nulla quis lorem ut libero malesuada feugiat. Donec rutrum congue leo eget malesuada. Curabitur arcu erat, accumsan id imperdiet et, porttitor at sem.
  
 +Curabitur arcu erat, accumsan id imperdiet et, porttitor at sem. Cras ultricies ligula sed magna dictum porta. Curabitur aliquet quam id dui posuere blandit.
 +
 +Cras ultricies ligula sed magna dictum porta. Mauris blandit aliquet elit, eget tincidunt nibh pulvinar a. Quisque velit nisi, pretium ut lacinia in, elementum id enim.</col>
 +<col xs="6" lg="4">.col-xs-6 .col-lg-4 Nulla quis lorem ut libero malesuada feugiat. Donec rutrum congue leo eget malesuada. Curabitur arcu erat, accumsan id imperdiet et, porttitor at sem.
 +
 +Curabitur arcu erat, accumsan id imperdiet et, porttitor at sem. Cras ultricies ligula sed magna dictum porta. Curabitur aliquet quam id dui posuere blandit.
 +
 +Cras ultricies ligula sed magna dictum porta. Mauris blandit aliquet elit, eget tincidunt nibh pulvinar a. Quisque velit nisi, pretium ut lacinia in, elementum id enim.</col>
 +</grid>
 +
 +==== Thumbnail ====
 +
 +<code>
 <grid> <grid>
 Nulla quis lorem ut libero malesuada feugiat. Donec rutrum congue leo eget malesuada. Curabitur arcu erat, accumsan id imperdiet et, porttitor at sem. Nulla quis lorem ut libero malesuada feugiat. Donec rutrum congue leo eget malesuada. Curabitur arcu erat, accumsan id imperdiet et, porttitor at sem.
Line 545: Line 620:
 === DokuWiki === === DokuWiki ===
  
-//DokuWiki is a simple to use and highly versatile Open Source wiki software that doesn't require a database. It is loved by users for its clean and readable syntax. The ease of maintenance, backup and integration makes it an administrator's favorite. Built in access controls and authentication connectors make DokuWiki especially useful in the enterprise context and the large number of plugins contributed by its vibrant community allow for a broad range of use cases beyond a traditional wiki.//+//DokuWiki is a simple to use and highly versatile Open Source wiki software//
 </caption> </caption>
 </thumbnail> </thumbnail>
 +Nulla quis lorem ut libero malesuada feugiat. Donec rutrum congue leo eget malesuada. Curabitur arcu erat, accumsan id imperdiet et, porttitor at sem.
 +</col>
 +</grid>
 +</code>
 +
 +<grid>
 Nulla quis lorem ut libero malesuada feugiat. Donec rutrum congue leo eget malesuada. Curabitur arcu erat, accumsan id imperdiet et, porttitor at sem. Nulla quis lorem ut libero malesuada feugiat. Donec rutrum congue leo eget malesuada. Curabitur arcu erat, accumsan id imperdiet et, porttitor at sem.
  
Line 553: Line 634:
  
 Cras ultricies ligula sed magna dictum porta. Mauris blandit aliquet elit, eget tincidunt nibh pulvinar a. Quisque velit nisi, pretium ut lacinia in, elementum id enim. Cras ultricies ligula sed magna dictum porta. Mauris blandit aliquet elit, eget tincidunt nibh pulvinar a. Quisque velit nisi, pretium ut lacinia in, elementum id enim.
 +<col xs="6" md="3">
 +<thumbnail>
 +{{:pasted:20180831-081621-example.png}}
 +</thumbnail>
 </col> </col>
 +Nulla quis lorem ut libero malesuada feugiat. Donec rutrum congue leo eget malesuada. Curabitur arcu erat, accumsan id imperdiet et, porttitor at sem.
 +
 +Curabitur arcu erat, accumsan id imperdiet et, porttitor at sem. Cras ultricies ligula sed magna dictum porta. Curabitur aliquet quam id dui posuere blandit.
 +
 +Cras ultricies ligula sed magna dictum porta. Mauris blandit aliquet elit, eget tincidunt nibh pulvinar a. Quisque velit nisi, pretium ut lacinia in, elementum id enim.
 </grid> </grid>
  
-Well+<grid> 
 +Nulla quis lorem ut libero malesuada feugiat. Donec rutrum congue leo eget malesuada. Curabitur arcu erat, accumsan id imperdiet et, porttitor at sem.
  
 +Curabitur arcu erat, accumsan id imperdiet et, porttitor at sem. Cras ultricies ligula sed magna dictum porta. Curabitur aliquet quam id dui posuere blandit.
 +
 +Cras ultricies ligula sed magna dictum porta. Mauris blandit aliquet elit, eget tincidunt nibh pulvinar a. Quisque velit nisi, pretium ut lacinia in, elementum id enim.
 +<col xs="6" md="3">
 +<thumbnail>
 +{{:pasted:20180831-081621-example.png}}
 +<caption>
 +
 +=== DokuWiki ===
 +
 +//DokuWiki is a simple to use and highly versatile Open Source wiki software//
 +</caption>
 +</thumbnail>
 +Nulla quis lorem ut libero malesuada feugiat. Donec rutrum congue leo eget malesuada. Curabitur arcu erat, accumsan id imperdiet et, porttitor at sem.
 +</col>
 +</grid>
 +
 +==== Well ====
 +
 +<code>
 <well>Look, I'm in a well!</well> <well>Look, I'm in a well!</well>
 +</code>
  
-Button+<well>Look, I'm in a well!</well>
  
 +==== Button ====
 +
 +<code>
 <button type="success" size="lg" icon="glyphicon glyphicon-edit">[[:wiki:welcome]]</button> <button type="success" size="lg" icon="glyphicon glyphicon-edit">[[:wiki:welcome]]</button>
 +</code>
  
-Nav+<button type="success" size="lg" icon="glyphicon glyphicon-edit">[[:wiki:welcome]]</button> 
 + 
 +==== Nav ==== 
 + 
 +<code> 
 +<nav> 
 +  * [[:start]] 
 +  * [[:plugin:bootswrapper|Plugin]] 
 +  * [[playground:playground]] 
 +  * DokuWiki 
 +    * [[:wiki:welcome]] 
 +    * [[:wiki:syntax]] 
 +</nav> 
 +</code>
  
 <nav> <nav>