THIS IS ONLY A TESTWIKI! LH, MW 1.39.7, PHP 8, SMW 4.1.3

Bootstrap-Test: Unterschied zwischen den Versionen

Aus Test
Zur Navigation springen Zur Suche springen
Keine Bearbeitungszusammenfassung
Keine Bearbeitungszusammenfassung
Markierung: Manuelle Zurücksetzung
 
(33 dazwischenliegende Versionen desselben Benutzers werden nicht angezeigt)
Zeile 1: Zeile 1:
__TOC__
{{#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...}}


* [[Benutzer:Admin]] [[Projekt:Impressum]] [[Red Link]] http://www.kdz.or.at [https://xxx.yyy.com Test]
Normaler Text und Links: {{PAGENAME}} [[{{PAGENAME}}]] [[red link]] [https://km-a.net KM-A]
<div class="btn">nothing[[Benutzer:Admin]] [[Projekt:Impressum]]</div>
<div class="btn">nothing {{PAGENAME}} [[{{PAGENAME}}]] [[red link]] [https://km-a.net KM-A]</div>
<div class="btn btn-white">White[[Benutzer:Admin]] [[Projekt:Impressum]]</div>
<div class="btn btn-light">Light {{PAGENAME}} [[{{PAGENAME}}]] [[red link]] [https://km-a.net KM-A]</div>
<div class="btn btn-light">Light [[Benutzer:Admin]] [[Projekt:Impressum]]</div>
<div class="btn btn-dark">Dark {{PAGENAME}} [[{{PAGENAME}}]] [[red link]] [https://km-a.net KM-A]</div>
<div class="btn btn-dark">Dark [[Benutzer:Admin]] [[Projekt:Impressum]]</div>
<div class="btn btn-darker">Darker {{PAGENAME}} [[{{PAGENAME}}]] [[red link]] [https://km-a.net KM-A]</div>
<div class="btn btn-darker">Darker [[Benutzer:Admin]] [[Projekt:Impressum]]</div>
<div class="btn btn-primary">primary {{PAGENAME}} [[{{PAGENAME}}]] [[red link]] [https://km-a.net KM-A]</div>
<div class="btn btn-primary">primary[[Benutzer:Admin]] [[Projekt:Impressum]]</div>
<div class="btn btn-secondary">secondary {{PAGENAME}} [[{{PAGENAME}}]][[red link]] [https://km-a.net KM-A]</div>
<div class="btn btn-secondary">secondary[[Benutzer:Admin]] [[Projekt:Impressum]]</div>
<div class="btn btn-info">info {{PAGENAME}} [[{{PAGENAME}}]] [[red link]] [https://km-a.net KM-A]</div>
<div class="btn btn-info">info[[Benutzer:Admin]] [[Projekt:Impressum]]</div>
<div class="btn btn-success">success {{PAGENAME}} [[{{PAGENAME}}]] [[red link]] [https://km-a.net KM-A]</div>
<div class="btn btn-success">success[[Benutzer:Admin]] [[Projekt:Impressum]]</div>
<div class="btn btn-warning">warning {{PAGENAME}} [[{{PAGENAME}}]] [[red link]] [https://km-a.net KM-A]</div>
<div class="btn btn-warning">warning[[Benutzer:Admin]] [[Projekt:Impressum]]</div>
<div class="btn btn-danger">danger {{PAGENAME}} [[{{PAGENAME}}]] [[red link]] [https://km-a.net KM-A]</div>
<div class="btn btn-danger">danger[[Benutzer:Admin]] [[Projekt:Impressum]]</div>


== Dropdowns ==


<div class="card"><div class="mw-collapsible">
=== manual ===
<div class="card-header"><span class="fas fa-sign"></span> {{PAGENAME}}</div>
<div class="btn-group">
<div class="card-body"><div class="mw-collapsible-content">
  <div class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">{{PAGENAME}}<span class="caret"></span>
test
  </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>
</div>
</div></div></div></div>
 
<div class="card">
<div class="card-header"><span class="fas fa-sign"></span> {{PAGENAME}}</div><div class="mw-collapsible">
<div class="card-body"><div class="mw-collapsible-content">
test


=== 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>
</div></div></div></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}}</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 </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</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">
test
</div>
</div></div>
 
<div class="card bg-nothing"><div class="mw-collapsible">
<div class="card-header"><span class="fas fa-sign"></span> nothinhg</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</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</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</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</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</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</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</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>


<ul class="nav nav-tabs mb-2" id="myTabs" role="tablist">
  <li class="nav-item"><btn id="tab1Label" data-toggle="tab" class="nav-link active" role="tab" aria-controls="tab1" aria-selected="true">#tab1|Tab 1</btn></li>
  <li><btn id="btn2Label" data-toggle="tab" class="nav-link" role="tab" aria-controls="tab2" aria-selected="false">#tab2|Tab 2</btn></li>
</ul>
<div class="tab-content">
  <div id="tab1" class="tab-pane fade show active" role="tabcard" aria-labelledby="tab1Label">
    '''Tab 1''': Lorem ipsum...
  </div>
  <div id="tab2" class="tab-pane fade" role="tabcard" aria-labelledby="tab2Label">
    '''Tab 2''': Lorem ipsum...
  </div>
</div>
<btn>
Button
Benutzer:Admin|Internal Target
https://www.kdz.or.at|External Target
</btn>
== redlinks==
<div class="btn">[[Default (nothing)]]</div>
<div class="btn btn-dark">[[Dark]]</div>
<div class="btn btn-darker">[[Darker]]</div>
<div class="btn btn-light">[[Light]]</div>
<div class="btn btn-default">[[Default]]</div>
<div class="btn btn-info">[[Info]]</div>
<div class="btn btn-primary">[[Primary]]</div>
<div class="btn btn-success">[[Success]]</div>
<div class="btn btn-warning">[[Warning]]</div>
<div class="btn btn-danger">[[Danger]]</div>
<div class="btn btn-link">[[Link]]</div>
== regular links==
<div class="btn">[[Hauptseite]] nothing</div>
<div class="btn btn-dark">[[Hauptseite]] dark</div>
<div class="btn btn-darker">[[Hauptseite]] darker</div>
<div class="btn btn-light">[[Hauptseite]] light</div>
<div class="btn btn-default">[[Hauptseite]] default</div>
<div class="btn btn-info">[[Hauptseite]] info</div>
<div class="btn btn-primary">[[Hauptseite]] primary</div>
<div class="btn btn-success">[[Hauptseite]] success</div>
<div class="btn btn-warning">[[Hauptseite]] warning</div>
<div class="btn btn-danger">[[Hauptseite]] danger</div>
<div class="btn btn-link">[[Hauptseite]] link</div>
== external links==
<div class="btn btn-primary"><span style="plainlink">[https://km-a.net KM-A]</span></div>


== other tests==
== other tests==
<div class="btn btn-default" role="button">[[Default]]</div>
Badge: <span class="badge badge-primary">primary</span>
 
<span class="badge badge-secondary">secondary</span>
<div class="btn btn-info" role="button">[[Link]]</div>
<span class="badge badge-light">light</span>
<div class="btn btn-info" role="button">No Link</div>
<span class="badge badge-dark">dark</span>
<div class="btn btn-info btn-lg" role="button">[[Large]]</div>
<span class="badge badge-darker">darker</span>
<div class="btn btn-primary btn-lg disabled" role="button">[[Disabled]]</div>
<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>
<div class="btn btn-info">[https://km-a.net KM-A]</div>
 
<span class="badge">4</span>


== Text ==
== Text ==
<p class="text-muted">Muted Text</p>
<p class="text-muted">Muted Text</p>
<p class="text-dark">Dark Text</p>
<p class="text-darker">Darker Text</p>
<p class="text-light">Light Text</p>
<p class="text-primary">Primary Text</p>
<p class="text-primary">Primary Text</p>
<p class="text-success">Success-Text</p>
<p class="text-success">Success-Text</p>
Zeile 183: Zeile 188:
<p class="text-danger">Danger-Text</p>
<p class="text-danger">Danger-Text</p>
== Text with Links ==
== Text with Links ==
<p class="text-muted">[[Muted Text]]</p>
<p class="text-muted">[[{{PAGENAME}}]] [[Muted Text]] [https://km-a.net KM-A]</p>
<p class="text-primary">[[Primary Text]]</p>
<p class="text-dark">[[{{PAGENAME}}]] [[Dark Text]]  [https://km-a.net KM-A]</p>
<p class="text-success">[[Success-Text]]</p>
<p class="text-darker">[[{{PAGENAME}}]] [[Darker Text]]  [https://km-a.net KM-A]</p>
<p class="text-info">[[Info-Text]]</p>
<p class="text-light">[[{{PAGENAME}}]] [[Light Text]]  [https://km-a.net KM-A]</p>
<p class="text-warning">[[Waringn-Text]]</p>
<p class="text-primary">[[{{PAGENAME}}]] [[Primary Text]]  [https://km-a.net KM-A]</p>
<p class="text-danger">[[Danger-Text]]</p>
<p class="text-success">[[{{PAGENAME}}]] [[Success-Text]]  [https://km-a.net KM-A]</p>
<p class="text-info">[[{{PAGENAME}}]] [[Info-Text]]  [https://km-a.net KM-A]</p>
<p class="text-warning">[[{{PAGENAME}}]] [[Waringn-Text]]  [https://km-a.net KM-A]</p>
<p class="text-danger">[[{{PAGENAME}}]] [[Danger-Text]]  [https://km-a.net KM-A]</p>


== Backgrounds ==
== Backgrounds ==
<p class="bg-dark">Dark Text</p>
<p class="bg-darker">Darker Text</p>
<p class="bg-light">Light Text</p>
<p class="bg-primary">Primary Text</p>
<p class="bg-primary">Primary Text</p>
<p class="bg-success">Success-Text</p>
<p class="bg-success">Success-Text</p>
Zeile 198: Zeile 209:


== Backgrounds with links ==
== Backgrounds with links ==
<p class="bg-primary">[[Primary Text]]</p>
<p class="bg-dark">[[{{PAGENAME}}]] [[Dark Text]]  [https://km-a.net KM-A]</p>
<p class="bg-success">[[Success-Text]]</p>
<p class="bg-darker">[[{{PAGENAME}}]] [[Darker Text]]  [https://km-a.net KM-A]</p>
<p class="bg-info">[[Info-Text]]</p>
<p class="bg-light">[[{{PAGENAME}}]] [[Light Text]]  [https://km-a.net KM-A]</p>
<p class="bg-warning">[[Warning-Text]]</p>
<p class="bg-primary">[[{{PAGENAME}}]] [[Primary Text]]  [https://km-a.net KM-A]</p>
<p class="bg-danger">[[Danger-Tex]]</p>
<p class="bg-success">[[{{PAGENAME}}]] [[Success-Text]]  [https://km-a.net KM-A]</p>
<p class="bg-info">[[{{PAGENAME}}]] [[Info-Text]]  [https://km-a.net KM-A]</p>
<p class="bg-warning">[[{{PAGENAME}}]] [[Warning-Text]] [https://km-a.net KM-A]</p>
<p class="bg-danger">[[{{PAGENAME}}]] [[Danger-Tex]]  [https://km-a.net KM-A]</p>
== Jumbotron ==
== Jumbotron ==
<div class="jumbotron">
<div class="jumbotron">
Zeile 212: 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>
== Cards ==
<div class=row>
<div class="col col-6">
<div class="card">
<div class="card-header bg-light"><span class="fas fa-info"></span> Header</div>
<div class="card-body">
Body
</div>
<div class="card-footer"> Footer</div>
</div></div></div>
== Dropdowns ==
=== manual ===
<div class="btn-group">
  <div class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Action <span class="caret"></span>
  </div>
  <ul class="dropdown-menu list-inline">
    <li>[[KDZ]]</li>
    <li>[[Wien]]</li>
    <li>[[Bonn]]</li>
    <li role="separator" class="divider"></li>
    <li>[[Köln]]</li>
  </ul>
</div>
=== with bullets and separator===
<div class="btn-group">
  <div class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Action <span class="caret"></span>
  </div>
  <ul class="dropdown-menu">
    <li>[[KDZ]]</li>
    <li>[[Wien]]</li>
    <li>[[Bonn]]</li>
    <li role="separator" class="divider"></li>
    <li>[[Köln]]</li>
  </ul>
</div>
=== Semantic ===
<div class="btn-group">
  <div class="btn btn-default dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Action <span class="caret"></span>
  </div>
{{#ask:[[Kategorie:Benutzer]]
|format=ul
|intro=<span class="dropdown-menu">
|outro=</span>
}}
</div>
=== Tabs ===
<div class="nav nav-tabs">
  <li role="presentation" class="dropdown">
    <span class="dropdown-toggle" data-toggle="dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">
      Dropdown <span class="caret"></span>
    </span>
  <ul class="dropdown-menu list-inline">
    <li>[[KDZ]]</li>
    <li>[[Wien]]</li>
    <li>[[Bonn]]</li>
    <li role="separator" class="divider"></li>
    <li>[[Köln]]</li>
  </ul>
</div>
=== Navbar ===
<div class="navbar navbar-default">
  <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>[[KDZ]]</li>
    <li>[[Wien]]</li>
    <li>[[Bonn]]</li>
    <li role="separator" class="divider"></li>
    <li>[[Köln]]</li>
  </ul>
</div>
=== Semantic Navbar  ===
<div class="navbar navbar-default">
  <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:Organisationen]]
|format=ul
|intro=<span class="dropdown-menu">
|outro=</span>
}}
</div>

Aktuelle Version vom 24. Oktober 2023, 18:53 Uhr

Normaler Text und Links: Bootstrap-Test Bootstrap-Test red link KM-A

nothing Bootstrap-Test Bootstrap-Test red link KM-A
Light Bootstrap-Test Bootstrap-Test red link KM-A
Dark Bootstrap-Test Bootstrap-Test red link KM-A
Darker Bootstrap-Test Bootstrap-Test red link KM-A
primary Bootstrap-Test Bootstrap-Test red link KM-A
secondary Bootstrap-Test Bootstrap-Testred link KM-A
info Bootstrap-Test Bootstrap-Test red link KM-A
success Bootstrap-Test Bootstrap-Test red link KM-A
warning Bootstrap-Test Bootstrap-Test red link KM-A
danger Bootstrap-Test Bootstrap-Test red link KM-A

Dropdowns

manual

secondary

Semantic


Navbar (unwichtig)

Semantic Navbar (unwichtig)

Cards

Bootstrap-Test Bootstrap-Test red link KM-A

test

Primary Bootstrap-Test Bootstrap-Test red link KM-A

test

Secondary Bootstrap-Test Bootstrap-Test red link KM-A

test

Light Bootstrap-Test Bootstrap-Test red link KM-A

test

dark Bootstrap-Test Bootstrap-Test red link KM-A

test

darker Bootstrap-Test Bootstrap-Test red link KM-A

test

Info Bootstrap-Test Bootstrap-Test red link KM-A

test

Success Bootstrap-Test Bootstrap-Test red link KM-A

test

Warning Bootstrap-Test Bootstrap-Test red link KM-A

test

Danger Bootstrap-Test Bootstrap-Test red link KM-A

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 Dark 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 Info-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 Dark 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 Info-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.

Progress Bars

60%