MediaWiki/Bootstrap

Accordion

Lorem ipsum 1

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

Lorem ipsum 2

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.

Code

<bootstrap_accordion>
<bootstrap_card header="Lorem ipsum 1" style="width: 300px;">
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.
</bootstrap_card>
<bootstrap_card header="Lorem ipsum 2" style="width: 300px;">
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua.
</bootstrap_card>
</bootstrap_accordion>

list-group

A simple default list group item
A simple primary list group item
A simple secondary list group item
A simple success list group item
A simple danger list group item

Code

<ul class="list-group">
  <li class="list-group-item">A simple default list group item</li>
  <li class="list-group-item list-group-item-primary">A simple primary list group item</li>
  <li class="list-group-item list-group-item-secondary">A simple secondary list group item</li>
  <li class="list-group-item list-group-item-success">A simple success list group item</li>
  <li class="list-group-item list-group-item-danger">A simple danger list group item</li>
</ul>

Tabelle

#	First	Last	Handle
1	Mark	Otto	@mdo
2	Jacob	Thornton	@fat
3	Larry	the Bird	@twitter

Code

{| class="table table-striped table-hover sortable"
! scope="col" | # !! First !! Last !! Handle
|-
| scope="row" | 1 || Mark || Otto || @mdo
|-
| scope="row" | 2 || Jacob || Thornton || @fat
|-
| scope="row" | 3 || Larry || the Bird || @twitter
|}

Grid

     1 of 2

     2 of 2

     1 of 3

     2 of 3

     3 of 3

Code

<div class="container">
  <div class="row">
    <div class="col">
      1 of 2
    </div>
    <div class="col">
      2 of 2
    </div>
  </div>
  <div class="row">
    <div class="col">
      1 of 3
    </div>
    <div class="col">
      2 of 3
    </div>
    <div class="col">
      3 of 3
    </div>
  </div>
</div>