Bootstrap

From Freephile Wiki
The printable version is no longer supported and may have rendering errors. Please update your browser bookmarks and please use the default browser print function instead.
Bootstrap
Bootstrap logo
Bootstrap logo
Image shows: Bootstrap logo
Summary
Title: Bootstrap
Description: A front-end web framework. Bootstrap allows you to easily create aesthetically pleasing layouts for your content. Bootstrap provides responsive, mobile-first front-end web development. It contains CSS- and JavaScript-based design templates for typography, forms, buttons, navigation, and other interface components.
More
Notes: mw:Extension:Bootstrap first added here in January 2016, makes that framework available to this wiki. This is in addition to the built-in OOUI (Object Oriented User Interface) of MediaWiki
Test: go to preferences->appearance, and try the Chameleon skin
Example: We used Bootstrap to prototype a page for QualityBox https://wiki.freephile.org/wiki/index.php?title=QualityBox&useskin=chameleon





Bootstrap is a front-end web framework, that started life at Twitter.

Working with Bootstrap[edit]

I used Bootstrap on the Wiki report project. I saw some code for creating a working Contact form using Bootstrap. That code inspired me to use Bootstrap in my project to display MediaWiki API response data.

Bootstrap has table formatting CSS already defined http://getbootstrap.com/css/#tables

Not only does Bootstrap have CSS handled, but there is a whole lot of JavaScript functionality that is built-in and which can be extended. (See http://getbootstrap.com/javascript/)

By default, Bootstrap relies on jQuery, and includes a bunch of plugins. If you need to turn off the first-class API, unbind all events on the namespaced 'data-api' class: $(document).off('.data-api')

Examples[edit]

Layouts[edit]

.col-xs-12 .col-md-8
.col-xs-6 .col-md-4
.col-xs-6 .col-md-4
.col-xs-6 .col-md-4
.col-xs-6 .col-md-4
.col-xs-6
.col-xs-6

Buttons[edit]

Link