20 merge requests!14752.0 wip,!1403warningText and warningBackground docs fix,!985Fix id anchor javascript,!906Twipsy now respects custom classes,!873Clicking a dropdown will always toggle it,!858Bordered Arrow Mixin - updated for 2.0,!832Fix thumbnails in Built With Bootstrap,!13512.0 wip - relative font sizes,!1315[2.0-wip] Fix mustache glob when building,!1268[wip-2.0] IE 7/8 Typehead JS fix,!12362.0 wip - Fix for issue #1202,!1219Removed dotted outline on navbar dropdown menu,!1210Missing icon class from examples,!1195Fixed display of secondary container,!1090Fixed typo,!1084Default `.border-radius-custom` values,!1064Typo Fix in tables.less,!10572.0 wip,!1052Missing data attribute to close modal,!10212.0 wip
<pclass="lead">The core typography, form, and table styles of Bootstrap</p>
<pclass="lead">On top of the scaffolding, basic HTML elements are styled and enhanced with extensible classes to provide a fresh, consistent look and feel.</p>
</header>
...
...
@@ -519,7 +519,7 @@
<h2>Table options</h2>
<tableclass="bordered-table striped-table">
<thead>
<thead>
<tr>
<th>Name</th>
<th>Class</th>
...
...
@@ -551,7 +551,7 @@
<td>
<code>.condensed-table</code>
</td>
<td>Cuts padding in half, from 10px to 5px, within all <code>td</code> and <code>th</code> elements</td>
<td>Cuts vertical padding in half, from 8px to 4px, within all <code>td</code> and <code>th</code> elements</td>
</tr>
</tbody>
</table>
...
...
@@ -630,7 +630,49 @@
<table class="striped-table">
...
</table></pre>
<h3>3. Condensed table</h3>
<h3>3. Bordered table</h3>
<p>Add borders around the entire table and between each row, plus a bit of rounded corners for aesthetic purposes.</p>
<p><spanclass="label">Note</span> Bordered tables do not work well with <code>rowspan</code> due to somewhat hacky CSS applied to the tables. Sorry about that!</p>
<tableclass="bordered-table">
<thead>
<tr>
<th>#</th>
<th>First Name</th>
<th>Last Name</th>
<th>Language</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<tdcolspan="2">Some One</td>
<td>English</td>
</tr>
<tr>
<td>2</td>
<td>Joe</td>
<td>Sixpack</td>
<td>English</td>
</tr>
</tr>
<td>Joe</td>
<td>Sixpack</td>
<td>English</td>
</tr>
<tr>
<td>3</td>
<td>Stu</td>
<td>Dent</td>
<td>Code</td>
</tr>
</tbody>
</table>
<p><strong>Note:</strong> Zebra-striping is a progressive enhancement not available for older browsers like IE8 and below.</p>
<preclass="prettyprint linenums">
<table class="striped-table">
...
</table></pre>
<h3>4. Condensed table</h3>
<p>Make your tables more compact by adding the <code>.condensed-table</code> class to cut table cell padding in half (from 10px to 5px).</p>
<tableclass="condensed-table">
<thead>
...
...
@@ -666,7 +708,7 @@
<table class="condensed-table">
...
</table></pre>
<h3>4. Striped table w/ TableSorter.js</h3>
<h3>5. Striped table w/ TableSorter.js</h3>
<p>Taking the previous example, we improve the usefulness of our tables by providing sorting functionality via <ahref="http://jquery.com">jQuery</a> and the <ahref="http://tablesorter.com/docs/">Tablesorter</a> plugin. <strong>Click any column’s header to change the sort.</strong></p>
<pclass="lead">Bootstrap is a responsive frontend toolkit from Twitter designed to kickstart web development, complete with core HTML, CSS, and JS for grids, type, forms, navigation, and many more components.</p>
<pclass="download-info">
<ahref="#"class="btn primary btn-large">Download on GitHub</a>
<ahref="https://github.com/twitter/bootstrap/"class="btn primary btn-large">Download on GitHub</a>
<pclass="lead">Bring Bootstrap's components to life with custom plugins for<ahref="http://jquery.com/"target="_blank">jQuery</a> and <ahref="http://ender.no.de"target="_blank">Ender</a></p>
<pclass="lead">Bring Bootstrap's components to life with flexible, custom javascript plugins for many of our custom components that work with<ahref="http://jquery.com/"target="_blank">jQuery</a> and <ahref="http://ender.no.de"target="_blank">Ender</a>.</p>
<pclass="lead">Be a boss and use Bootstrap's built-in variables, mixins, and more via LESS</p>
<pclass="lead">Customize and extend Bootstrap with <ahref="http://lesscss.org"target="_blank">LESS</a>, a CSS preprocessor, to take advantage of the variables, mixins, and more used to build Bootstrap's CSS.</p>
<pclass="lead">Responsive 12-column grid and fixed- and fluid-width layouts</p>
<pclass="lead">Bootstrap is built on a responsive 12-column grid. We've also included fixed- and fluid-width layouts based on that system.</p>
</header>
<!-- Work in progress sub nav for docs -->
<divclass="navbar subnav docked-top">
<ulclass="nav">
<liclass="active"><ahref="#">Grid system</a></li>
<li><ahref="#">Layouts</a></li>
<li><ahref="#">Responsive</a></li>
</ul>
</div>
<!-- Grid system
...
...
@@ -162,7 +171,7 @@
</div>
<h2>Grid customization</h2>
<tableclass="striped-table">
<tableclass="bordered-table striped-table">
<thead>
<tr>
<th>Variable</th>
...
...
@@ -173,12 +182,12 @@
<tbody>
<tr>
<td><code>@gridColumns</code></td>
<td>16</td>
<td>12</td>
<td>The number of columns within the grid</td>
</tr>
<tr>
<td><code>@gridColumnWidth</code></td>
<td>40px</td>
<td>60px</td>
<td>The width of each column within the grid</td>
</tr>
<tr>
...
...
@@ -274,7 +283,7 @@
<divclass="span8">
<h2>Supported devices</h2>
<p>Bootstrap supports a handful of media queries to help make your projects more appropriate on different devices and screen resolutions. Here's what's included:</p>
These are the highlevel design rules which guide the developement of Bootstrap's js plugins.
## 2.0 BOOTSTRAP JS PHILOSOPHY
These are the high-level design rules which guide the development of Bootstrap's JS plugins.
---
### DATA-ATTRIBUTE API
We believe you should be able to use all plugins provided by bootstrap purely through the markup api without writing a single line of javascript.
We believe you should be able to use all plugins provided by Bootstrap purely through the markup API without writing a single line of javascript.
We acknoledge that this isn't always the most performant and sometimes it may be desirable to turn this functionality off altogether. Therefore, as of 2.0 we provide the ability to disable the data attribute api by unbinding all events on the body namespaced with `'data-api'`. This looks like this:
We acknowledge that this isn't always the most performant and sometimes it may be desirable to turn this functionality off altogether. Therefore, as of 2.0 we provide the ability to disable the data attribute API by unbinding all events on the body namespaced with `'data-api'`. This looks like this:
$('body').unbind('.data-api')
...
...
@@ -19,13 +19,13 @@ To target a specific plugin, just include the plugins name as a namespace along
### PROGRAMATIC API
We also believe you should be able to use all plugins provided by bootstrap purely through the JS api.
We also believe you should be able to use all plugins provided by Bootstrap purely through the JS API.
All pubilc APIs should be a single, chainable method, and return the collection acted upon.
All public APIs should be a single, chainable method, and return the collection acted upon.
$(".btn.danger").button("toggle").addClass("fat")
All methods should accept an optional options object, a string which targets a particular method, or null which innitiates the default behavior:
All methods should accept an optional options object, a string which targets a particular method, or null which initiates the default behavior:
$("#myModal").modal() // initialized with defaults
...
...
@@ -39,7 +39,7 @@ All plugins should have a default object which can be modified to effect all ins
$.fn.modal.defaults = { … }
An options definiton should take the following form:
An options definition should take the following form:
*noun*: *adjective* - describes or modifies a quality of an instance