diff options
| author | Mark Otto <[email protected]> | 2013-01-12 13:15:19 -0800 |
|---|---|---|
| committer | Mark Otto <[email protected]> | 2013-01-12 13:15:19 -0800 |
| commit | 7a3f078fb487323246ccf64460b7efaf7d478afc (patch) | |
| tree | d184d0bd3976bc76cf68744049ff8d40bb2a7315 /docs/components.html | |
| parent | 3773b999695c74c21959c046b511ba26efa65dbc (diff) | |
| download | bootstrap-7a3f078fb487323246ccf64460b7efaf7d478afc.tar.xz bootstrap-7a3f078fb487323246ccf64460b7efaf7d478afc.zip | |
Remove parent div from pagination component
* No more div.pagination; it's now just ul.pagination
* No more .pagination-right or .pagination-centered
* Sizes remain
* Any further customization, such as alignment, should be done on the individual application or site level.
Diffstat (limited to 'docs/components.html')
| -rw-r--r-- | docs/components.html | 171 |
1 files changed, 57 insertions, 114 deletions
diff --git a/docs/components.html b/docs/components.html index a8a71842f..8811a7e5e 100644 --- a/docs/components.html +++ b/docs/components.html @@ -1189,29 +1189,25 @@ <h2>Standard pagination</h2> <p>Simple pagination inspired by Rdio, great for apps and search results. The large block is hard to miss, easily scalable, and provides large click areas.</p> <div class="bs-docs-example"> - <div class="pagination"> - <ul> - <li><a href="#">«</a></li> - <li><a href="#">1</a></li> - <li><a href="#">2</a></li> - <li><a href="#">3</a></li> - <li><a href="#">4</a></li> - <li><a href="#">5</a></li> - <li><a href="#">»</a></li> - </ul> - </div> + <ul class="pagination"> + <li><a href="#">«</a></li> + <li><a href="#">1</a></li> + <li><a href="#">2</a></li> + <li><a href="#">3</a></li> + <li><a href="#">4</a></li> + <li><a href="#">5</a></li> + <li><a href="#">»</a></li> + </ul> </div> <pre class="prettyprint linenums"> -<div class="pagination"> - <ul> - <li><a href="#">Prev</a></li> - <li><a href="#">1</a></li> - <li><a href="#">2</a></li> - <li><a href="#">3</a></li> - <li><a href="#">4</a></li> - <li><a href="#">Next</a></li> - </ul> -</div> +<ul class="pagination"> + <li><a href="#">Prev</a></li> + <li><a href="#">1</a></li> + <li><a href="#">2</a></li> + <li><a href="#">3</a></li> + <li><a href="#">4</a></li> + <li><a href="#">Next</a></li> +</ul> </pre> @@ -1223,43 +1219,37 @@ <h3>Disabled and active states</h3> <p>Links are customizable for different circumstances. Use <code>.disabled</code> for unclickable links and <code>.active</code> to indicate the current page.</p> <div class="bs-docs-example"> - <div class="pagination pagination-centered"> - <ul> - <li class="disabled"><a href="#">«</a></li> - <li class="active"><a href="#">1</a></li> - <li><a href="#">2</a></li> - <li><a href="#">3</a></li> - <li><a href="#">4</a></li> - <li><a href="#">5</a></li> - <li><a href="#">»</a></li> - </ul> - </div> - </div> -<pre class="prettyprint linenums"> -<div class="pagination"> - <ul> - <li class="disabled"><a href="#">Prev</a></li> - <li class="active"><a href="#">1</a></li> - ... - </ul> -</div> + <ul class="pagination"> + <li class="disabled"><a href="#">«</a></li> + <li class="active"><a href="#">1</a></li> + <li><a href="#">2</a></li> + <li><a href="#">3</a></li> + <li><a href="#">4</a></li> + <li><a href="#">5</a></li> + <li><a href="#">»</a></li> + </ul> + </div> +<pre class="prettyprint linenums"> +<ul class="pagination"> + <li class="disabled"><a href="#">Prev</a></li> + <li class="active"><a href="#">1</a></li> + ... +</ul> </pre> <p>You can optionally swap out active or disabled anchors for spans to remove click functionality while retaining intended styles.</p> <pre class="prettyprint linenums"> -<div class="pagination"> - <ul> - <li class="disabled"><span>Prev</span></li> - <li class="active"><span>1</span></li> - ... - </ul> -</div> +<ul class="pagination"> + <li class="disabled"><span>Prev</span></li> + <li class="active"><span>1</span></li> + ... +</ul> </pre> <h3>Sizes</h3> <p>Fancy larger or smaller pagination? Add <code>.pagination-large</code>, <code>.pagination-small</code>, or <code>.pagination-mini</code> for additional sizes.</p> <div class="bs-docs-example"> - <div class="pagination pagination-large"> - <ul> + <div> + <ul class="pagination pagination-large"> <li><a href="#">«</a></li> <li><a href="#">1</a></li> <li><a href="#">2</a></li> @@ -1269,19 +1259,8 @@ <li><a href="#">»</a></li> </ul> </div> - <div class="pagination"> - <ul> - <li><a href="#">«</a></li> - <li><a href="#">1</a></li> - <li><a href="#">2</a></li> - <li><a href="#">3</a></li> - <li><a href="#">4</a></li> - <li><a href="#">5</a></li> - <li><a href="#">»</a></li> - </ul> - </div> - <div class="pagination pagination-small"> - <ul> + <div> + <ul class="pagination"> <li><a href="#">«</a></li> <li><a href="#">1</a></li> <li><a href="#">2</a></li> @@ -1291,8 +1270,8 @@ <li><a href="#">»</a></li> </ul> </div> - <div class="pagination pagination-mini"> - <ul> + <div> + <ul class="pagination pagination-small"> <li><a href="#">«</a></li> <li><a href="#">1</a></li> <li><a href="#">2</a></li> @@ -1302,53 +1281,8 @@ <li><a href="#">»</a></li> </ul> </div> - </div> -<pre class="prettyprint linenums"> -<div class="pagination pagination-large"> - <ul> - ... - </ul> -</div> -<div class="pagination"> - <ul> - ... - </ul> -</div> -<div class="pagination pagination-small"> - <ul> - ... - </ul> -</div> -<div class="pagination pagination-mini"> - <ul> - ... - </ul> -</div> -</pre> - - <h3>Alignment</h3> - <p>Add one of two optional classes to change the alignment of pagination links: <code>.pagination-centered</code> and <code>.pagination-right</code>.</p> - <div class="bs-docs-example"> - <div class="pagination pagination-centered"> - <ul> - <li><a href="#">«</a></li> - <li><a href="#">1</a></li> - <li><a href="#">2</a></li> - <li><a href="#">3</a></li> - <li><a href="#">4</a></li> - <li><a href="#">5</a></li> - <li><a href="#">»</a></li> - </ul> - </div> - </div> -<pre class="prettyprint linenums"> -<div class="pagination pagination-centered"> - ... -</div> -</pre> - <div class="bs-docs-example"> - <div class="pagination pagination-right"> - <ul> + <div> + <ul class="pagination pagination-mini"> <li><a href="#">«</a></li> <li><a href="#">1</a></li> <li><a href="#">2</a></li> @@ -1360,9 +1294,18 @@ </div> </div> <pre class="prettyprint linenums"> -<div class="pagination pagination-right"> +<ul class="pagination pagination-large"> ... -</div> +</ul> +<ul class="pagination"> + ... +</ul> +<ul class="pagination pagination-small"> + ... +</ul> +<ul class="pagination pagination-mini"> + ... +</ul> </pre> |
