THIS IS ONLY A TESTWIKI! LH, MW 1.39.7, PHP 8, SMW 4.1.3
Bootstrap-Test: Unterschied zwischen den Versionen
Zur Navigation springen
Zur Suche springen
Admin (Diskussion | Beiträge) (→Navbar) |
Admin (Diskussion | Beiträge) Keine Bearbeitungszusammenfassung Markierung: Manuelle Zurücksetzung |
||
| (14 dazwischenliegende Versionen desselben Benutzers werden nicht angezeigt) | |||
| Zeile 3: | Zeile 3: | ||
{{#queryformlink:form=Metasuche|link text=Suchen|link type=button|query string=Metasuche[Suchbegriff]={{#explode:{{PAGENAME}}|(|0}}&_run|tooltip=mehr zu {{PAGENAME}} suchen...}} | {{#queryformlink:form=Metasuche|link text=Suchen|link type=button|query string=Metasuche[Suchbegriff]={{#explode:{{PAGENAME}}|(|0}}&_run|tooltip=mehr zu {{PAGENAME}} suchen...}} | ||
Normaler Text und Links: {{PAGENAME}} [[{{PAGENAME}}]] [[red link]] [https://km-a.net KM-A] | |||
<div class="btn">nothing {{PAGENAME}} [[{{PAGENAME}}]] | <div class="btn">nothing {{PAGENAME}} [[{{PAGENAME}}]] [[red link]] [https://km-a.net KM-A]</div> | ||
<div class="btn btn-light">Light {{PAGENAME}} [[{{PAGENAME}}]] [[red link]] [https://km-a.net KM-A]</div> | |||
<div class="btn btn-light">Light {{PAGENAME}} [[{{PAGENAME}}]] [https://km-a.net KM-A]</div> | <div class="btn btn-dark">Dark {{PAGENAME}} [[{{PAGENAME}}]] [[red link]] [https://km-a.net KM-A]</div> | ||
<div class="btn btn-dark">Dark {{PAGENAME}} [[{{PAGENAME}}]] [https://km-a.net KM-A]</div> | <div class="btn btn-darker">Darker {{PAGENAME}} [[{{PAGENAME}}]] [[red link]] [https://km-a.net KM-A]</div> | ||
<div class="btn btn-darker">Darker {{PAGENAME}} [[{{PAGENAME}}]] [https://km-a.net KM-A]</div> | <div class="btn btn-primary">primary {{PAGENAME}} [[{{PAGENAME}}]] [[red link]] [https://km-a.net KM-A]</div> | ||
<div class="btn btn-primary">primary {{PAGENAME}} [[{{PAGENAME}}]] [https://km-a.net KM-A]</div> | <div class="btn btn-secondary">secondary {{PAGENAME}} [[{{PAGENAME}}]][[red link]] [https://km-a.net KM-A]</div> | ||
<div class="btn btn-secondary">secondary {{PAGENAME}} [[{{PAGENAME}}]] [https://km-a.net KM-A]</div> | <div class="btn btn-info">info {{PAGENAME}} [[{{PAGENAME}}]] [[red link]] [https://km-a.net KM-A]</div> | ||
<div class="btn btn-info">info {{PAGENAME}} [[{{PAGENAME}}]] [https://km-a.net KM-A]</div> | <div class="btn btn-success">success {{PAGENAME}} [[{{PAGENAME}}]] [[red link]] [https://km-a.net KM-A]</div> | ||
<div class="btn btn-success">success {{PAGENAME}} [[{{PAGENAME}}]] [https://km-a.net KM-A]</div> | <div class="btn btn-warning">warning {{PAGENAME}} [[{{PAGENAME}}]] [[red link]] [https://km-a.net KM-A]</div> | ||
<div class="btn btn-warning">warning {{PAGENAME}} [[{{PAGENAME}}]] [https://km-a.net KM-A]</div> | <div class="btn btn-danger">danger {{PAGENAME}} [[{{PAGENAME}}]] [[red link]] [https://km-a.net KM-A]</div> | ||
<div class="btn btn-danger">danger {{PAGENAME}} [[{{PAGENAME}}]] [https://km-a.net KM-A]</div> | |||
== Dropdowns == | |||
=== manual === | |||
<div class="btn-group"> | |||
<div class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">{{PAGENAME}}<span class="caret"></span> | |||
</div> | |||
<ul class="dropdown-menu list-inline"> | |||
<li>[[{{PAGENAME}}]]</li> | |||
<li>[[red link]]</li> | |||
<li>[https://km-a.net KM-A]</li> | |||
<li role="separator" class="divider"></li> | |||
<li>[[Vienna]]</li> | |||
</ul> | |||
</div> | |||
=== secondary === | |||
<div class="btn-group"> | |||
<div class="btn btn-secondary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">{{PAGENAME}} <span class="caret"></span> | |||
</div> | |||
<ul class="dropdown-menu"> | |||
<li>[[{{PAGENAME}}]]</li> | |||
<li>[[red link]]</li> | |||
<li>[https://km-a.net KM-A]</li> | |||
<li role="separator" class="divider"></li> | |||
<li>[[Vienna]]</li> | |||
</ul> | |||
</div> | |||
=== Semantic === | |||
<div class="btn-group"> | |||
<div class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">{{PAGENAME}} <span class="caret"></span> | |||
</div> | |||
{{#ask:[[Kategorie:Cities]] | |||
|format=ul | |||
|intro=<span class="dropdown-menu"> | |||
|outro=</span> | |||
}} | |||
</div> | |||
<div class="btn-group" style="margin-bottom:1em;"><div class="btn btn-light dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">light {{PAGENAME}}<span class="caret"></span></div>{{#ask:[[Kategorie:Cities]]|format=ul|intro=<span class="dropdown-menu small" style="width:30em;">|outro=</span>}}</div> | |||
=== Navbar (unwichtig) === | |||
<div class="navbar navbar-primary"> | |||
<li role="presentation" class="dropdown list-inline"> | |||
<span class="dropdown-toggle" data-toggle="dropdown" href="Benutzer:Admin" role="button" aria-haspopup="true" aria-expanded="false"> | |||
Dropdown <span class="caret"></span> | |||
</span> | |||
<ul class="dropdown-menu"> | |||
<li>[[{{PAGENAME}}]]</li> | |||
<li>[[red link]]</li> | |||
<li>[https://km-a.net KM-A]</li> | |||
<li role="separator" class="divider"></li> | |||
<li>[[Vienna]]</li> | |||
</ul></li> | |||
</div> | |||
=== Semantic Navbar (unwichtig) === | |||
<div class="navbar navbar-light"> | |||
<li role="presentation" class="dropdown list-inline"> | |||
<span class="dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false"> | |||
Dropdown <span class="caret"></span> | |||
</span> | |||
{{#ask:[[Kategorie:Cities]] | |||
|format=ul | |||
|intro=<span class="dropdown-menu"> | |||
|outro=</span> | |||
}}</li> | |||
</div> | |||
== Cards == | |||
<div class="card"><div class="mw-collapsible"> | <div class="card"><div class="mw-collapsible"> | ||
<div class="card-header"><span class="fas fa-sign"></span> {{PAGENAME}} [[{{PAGENAME}}]] [https://km-a.net KM-A]</div> | <div class="card-header"><span class="fas fa-sign"></span> {{PAGENAME}} [[{{PAGENAME}}]] [[red link]] [https://km-a.net KM-A]</div> | ||
<div class="card-body mw-collapsible-content"> | <div class="card-body mw-collapsible-content"> | ||
test | test | ||
</div> | </div> | ||
<div class="card-footer"> Footer</div> | |||
</div></div> | </div></div> | ||
<div class="card bg-primary"><div class="mw-collapsible"> | <div class="card bg-primary"><div class="mw-collapsible"> | ||
<div class="card-header"><span class="fas fa-sign"></span> Primary {{PAGENAME}} [[{{PAGENAME}}]] [https://km-a.net KM-A]</div> | <div class="card-header"><span class="fas fa-sign"></span> Primary {{PAGENAME}} [[{{PAGENAME}}]] [[red link]] [https://km-a.net KM-A]</div> | ||
<div class="card-body mw-collapsible-content"> | <div class="card-body mw-collapsible-content"> | ||
test | test | ||
</div> | </div> | ||
<div class="card-footer"> Footer</div> | |||
</div></div> | </div></div> | ||
<div class="card bg-secondary"><div class="mw-collapsible"> | <div class="card bg-secondary"><div class="mw-collapsible"> | ||
<div class="card-header"><span class="fas fa-sign"></span> Secondary {{PAGENAME}} [[{{PAGENAME}}]] [https://km-a.net KM-A]</div> | <div class="card-header"><span class="fas fa-sign"></span> Secondary {{PAGENAME}} [[{{PAGENAME}}]] [[red link]] [https://km-a.net KM-A]</div> | ||
<div class="card-body mw-collapsible-content"> | <div class="card-body mw-collapsible-content"> | ||
test | test | ||
</div> | </div> | ||
<div class="card-footer"> Footer</div> | |||
</div></div> | </div></div> | ||
<div class="card bg-light"><div class="mw-collapsible"> | <div class="card bg-light"><div class="mw-collapsible"> | ||
<div class="card-header"><span class="fas fa-sign"></span> Light {{PAGENAME}} [[{{PAGENAME}}]] [https://km-a.net KM-A]</div> | <div class="card-header"><span class="fas fa-sign"></span> Light {{PAGENAME}} [[{{PAGENAME}}]] [[red link]] [https://km-a.net KM-A]</div> | ||
<div class="card-body mw-collapsible-content"> | <div class="card-body mw-collapsible-content"> | ||
test | test | ||
</div> | </div> | ||
<div class="card-footer"> Footer</div> | |||
</div></div> | </div></div> | ||
<div class="card bg-dark"><div class="mw-collapsible"> | <div class="card bg-dark"><div class="mw-collapsible"> | ||
<div class="card-header"><span class="fas fa-sign"></span> dark {{PAGENAME}} [[{{PAGENAME}}]] [https://km-a.net KM-A]</div> | <div class="card-header"><span class="fas fa-sign"></span> dark {{PAGENAME}} [[{{PAGENAME}}]] [[red link]] [https://km-a.net KM-A]</div> | ||
<div class="card-body mw-collapsible-content"> | <div class="card-body mw-collapsible-content"> | ||
test | test | ||
</div> | </div> | ||
<div class="card-footer"> Footer</div> | |||
</div></div> | </div></div> | ||
<div class="card bg-darker"><div class="mw-collapsible"> | <div class="card bg-darker"><div class="mw-collapsible"> | ||
<div class="card-header"><span class="fas fa-sign"></span> darker {{PAGENAME}} [[{{PAGENAME}}]] [https://km-a.net KM-A]</div> | <div class="card-header"><span class="fas fa-sign"></span> darker {{PAGENAME}} [[{{PAGENAME}}]] [[red link]] [https://km-a.net KM-A]</div> | ||
<div class="card-body mw-collapsible-content"> | <div class="card-body mw-collapsible-content"> | ||
test | test | ||
</div> | </div> | ||
<div class="card-footer"> Footer</div> | |||
</div></div> | </div></div> | ||
<div class="card bg-info"><div class="mw-collapsible"> | <div class="card bg-info"><div class="mw-collapsible"> | ||
<div class="card-header"><span class="fas fa-sign"></span> Info {{PAGENAME}} [[{{PAGENAME}}]] [https://km-a.net KM-A]</div> | <div class="card-header"><span class="fas fa-sign"></span> Info {{PAGENAME}} [[{{PAGENAME}}]] [[red link]] [https://km-a.net KM-A]</div> | ||
<div class="card-body mw-collapsible-content"> | <div class="card-body mw-collapsible-content"> | ||
test | test | ||
</div> | </div> | ||
<div class="card-footer"> Footer</div> | |||
</div></div> | </div></div> | ||
<div class="card bg-success"><div class="mw-collapsible"> | <div class="card bg-success"><div class="mw-collapsible"> | ||
<div class="card-header"><span class="fas fa-sign"></span> Success {{PAGENAME}} [[{{PAGENAME}}]] [https://km-a.net KM-A]</div> | <div class="card-header"><span class="fas fa-sign"></span> Success {{PAGENAME}} [[{{PAGENAME}}]] [[red link]] [https://km-a.net KM-A]</div> | ||
<div class="card-body mw-collapsible-content"> | <div class="card-body mw-collapsible-content"> | ||
test | test | ||
</div> | </div> | ||
<div class="card-footer"> Footer</div> | |||
</div></div> | </div></div> | ||
<div class="card bg-warning"><div class="mw-collapsible"> | <div class="card bg-warning"><div class="mw-collapsible"> | ||
<div class="card-header"><span class="fas fa-sign"></span> Warning {{PAGENAME}} [[{{PAGENAME}}]] [https://km-a.net KM-A]</div> | <div class="card-header"><span class="fas fa-sign"></span> Warning {{PAGENAME}} [[{{PAGENAME}}]] [[red link]] [https://km-a.net KM-A]</div> | ||
<div class="card-body mw-collapsible-content"> | <div class="card-body mw-collapsible-content"> | ||
test | test | ||
</div> | </div> | ||
<div class="card-footer"> Footer</div> | |||
</div></div> | </div></div> | ||
<div class="card bg-danger"><div class="mw-collapsible"> | <div class="card bg-danger"><div class="mw-collapsible"> | ||
<div class="card-header"><span class="fas fa-sign"></span> Danger {{PAGENAME}} [[{{PAGENAME}}]] [https://km-a.net KM-A]</div> | <div class="card-header"><span class="fas fa-sign"></span> Danger {{PAGENAME}} [[{{PAGENAME}}]] [[red link]] [https://km-a.net KM-A]</div> | ||
<div class="card-body mw-collapsible-content"> | <div class="card-body mw-collapsible-content"> | ||
test | test | ||
</div> | </div> | ||
<div class="card-footer"> Footer</div> | |||
</div></div> | </div></div> | ||
== other tests== | == other tests== | ||
Badge: <span class="badge badge-primary">primary</span> | |||
<span class="badge badge-secondary">secondary</span> | |||
<span class="badge badge-light">light</span> | |||
<span class="badge badge-dark">dark</span> | |||
<span class="badge badge-darker">darker</span> | |||
<span class="badge badge-info">info</span> | |||
<span class="badge badge-warning">warning</span> | |||
<span class="badge badge-danger">danger</span> | |||
<span class="badge badge-success">success</span> | |||
== Text == | == Text == | ||
| Zeile 139: | Zeile 226: | ||
== Progress Bars == | == Progress Bars == | ||
<div class="progress"><div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> 60% </div></div> | <div class="progress"><div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100" style="width: 60%;"> 60% </div></div> | ||
Aktuelle Version vom 24. Oktober 2023, 18:53 Uhr
Normaler Text und Links: Bootstrap-Test Bootstrap-Test red link KM-A
Dropdowns
manual
Bootstrap-Test
secondary
Bootstrap-Test
Semantic
Bootstrap-Test
light Bootstrap-Test
Cards
test
test
test
test
test
test
test
test
test
test
other tests
Badge: primary secondary light dark darker info warning danger success
Text
Muted Text
Dark Text
Darker Text
Light Text
Primary Text
Success-Text
Info-Text
Waringn-Text
Danger-Text
Text with Links
Bootstrap-Test Muted Text KM-A
Bootstrap-Test Darker Text KM-A
Bootstrap-Test Light Text KM-A
Bootstrap-Test Primary Text KM-A
Bootstrap-Test Success-Text KM-A
Bootstrap-Test Waringn-Text KM-A
Bootstrap-Test Danger-Text KM-A
Backgrounds
Dark Text
Darker Text
Light Text
Primary Text
Success-Text
Info-Text
Warning-Text
Danger-Text
Backgrounds with links
Bootstrap-Test Darker Text KM-A
Bootstrap-Test Light Text KM-A
Bootstrap-Test Primary Text KM-A
Bootstrap-Test Success-Text KM-A
Bootstrap-Test Warning-Text KM-A
Bootstrap-Test Danger-Tex KM-A
Jumbotron
Hello, world!
This is a simple hero unit, a simple jumbotron-style component for calling extra attention to featured content or information.