Syntax
Bootstrap Syntax
Syntax und Pluginentwicklung von Giuseppe Di Terlizzi
Accordion
Collapsible Group Item #1
Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS.
Collapsible Group Item #2
[…]
Collapsible Group Item #3
[…]
<accordion> <panel title="Collapsible Group Item #1"> Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS. </panel> <panel title="Collapsible Group Item #2"> [...] </panel> <panel title="Collapsible Group Item #3"> [...] </panel> </accordion>
Alerts
<alert type="success">...</alert> <alert type="info">...</alert> <alert type="warning">...</alert> <alert type="danger">...</alert> <alert type="warning" dismiss="true">**Warning!** Better check yourself, you're not looking too good.</alert>
Callout
Default Callout
This is a default callout.<callout title="Default Callout"> This is a default callout. </callout>
<callout type="primary" icon="true"> [...] </callout> <callout type="success" icon="true"> [...] </callout> <callout type="info" icon="true"> [...] </callout> <callout type="warning" icon="true"> [...] </callout> <callout type="danger" icon="true"> [...] </callout>
Collapse
<button collapse="foo">Click Me</button> <collapse id="foo" collapsed="true"><well> Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident.</well></collapse>
Jumbotron
Hello, world!
This is a simple hero unit, a simple jumbotron-style component for calling extra attention to featured content or information.
<jumbotron> ====== Hello, world! ====== This is a simple hero unit, a simple jumbotron-style component for calling extra attention to featured content or information. <btn type="primary">[[#|Learn more]]</btn> </jumbotron>
Navigation
- DokuWiki
<nav type="tabs"> * [[:start]] * [[:wiki:plugin:bootswrapper:nav|Nav Plugin]] * [[playground:playground]] * DokuWiki * [[:wiki:welcome]] * [[:wiki:syntax]] </nav>
- DokuWiki
<nav type="pills"> * [[:start]] * [[:wiki:plugin:bootswrapper:nav|Nav Plugin]] * [[playground:playground]] * DokuWiki * [[:wiki:welcome]] * [[:wiki:syntax]] </nav>
Attribute | Default Value | Allowed Values | Description |
---|---|---|---|
type | pills | tabs, pills | Type of nav |
stacked | optional | true | Stacked nav items |
justified | optional | true | Justify nav items |
fade | optional | true | Enable fade effect on tabs |
Panels
Panel title
Panel content
Panel title
Panel content
Panel title
Panel content
Panel title
Panel content
Panel title
Panel content
<panel type="primary" title="Panel title">Panel content</panel> <panel type="success" title="Panel title">Panel content</panel> <panel type="info" title="Panel title">Panel content</panel> <panel type="warning" title="Panel title">Panel content</panel> <panel type="danger" title="Panel title">Panel content</panel>
Fortschritt
<progress> <bar value="40" type="success" striped="true"></bar> </progress> <progress> <bar value="20" type="info" striped="true"></bar> </progress> <progress> <bar value="60" type="warning" striped="true"></bar> </progress> <progress> <bar value="80" type="danger" striped="true"></bar> </progress> <progress> <bar value="45" type="info" striped="true" animate="true"></bar> </progress>
Tooltips
Lorem ipsum dolor sit amet…
<tooltip title="Sample Text" location="bottom">Lorem ipsum</tooltip> dolor sit amet...