Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse files

fix broken "Pagination 101" link

closes #102
  • Loading branch information...
commit f169dcc1fbb8ab2600103dd5cde9b7c3b45bf763 1 parent 260c1c4
@mislav mislav authored
Showing with 128 additions and 149 deletions.
  1. +1 −1  README.rdoc
  2. +59 −59 examples/index.haml
  3. +68 −89 examples/index.html
View
2  README.rdoc
@@ -98,7 +98,7 @@ are {showcased online here}[http://mislav.uniqpath.com/will_paginate/].
More reading about pagination as design pattern:
-* {Pagination 101}[http://kurafire.net/log/archive/2007/06/22/pagination-101]
+* {Pagination 101}[https://gist.github.com/622561]
* {Pagination gallery}[http://www.smashingmagazine.com/2007/11/16/pagination-gallery-examples-and-good-practices/]
* {Pagination on Yahoo Design Pattern Library}[http://developer.yahoo.com/ypatterns/parent.php?pattern=pagination]
View
118 examples/index.haml
@@ -1,69 +1,69 @@
!!!
%html
-%head
- %title Samples of pagination styling for will_paginate
- %link{ :rel => 'stylesheet', :type => 'text/css', :href => 'pagination.css' }
- %style{ :type => 'text/css' }
- :sass
- html
- :margin 0
- :padding 0
- :background #999
- :font normal 76% "Lucida Grande", Verdana, Helvetica, sans-serif
- body
- :margin 2em
- :padding 2em
- :border 2px solid gray
- :background white
- :color #222
- h1
- :font-size 2em
- :font-weight normal
- :margin 0 0 1em 0
- h2
- :font-size 1.4em
- :margin 1em 0 .5em 0
- pre
- :font-size 13px
- :font-family Monaco, "DejaVu Sans Mono", "Bitstream Vera Mono", "Courier New", monospace
+ %head
+ %title Samples of pagination styling for will_paginate
+ %link{ :rel => 'stylesheet', :type => 'text/css', :href => 'pagination.css' }
+ %style{ :type => 'text/css' }
+ :sass
+ html
+ :margin 0
+ :padding 0
+ :background #999
+ :font normal 76% "Lucida Grande", Verdana, Helvetica, sans-serif
+ body
+ :margin 2em
+ :padding 2em
+ :border 2px solid gray
+ :background white
+ :color #222
+ h1
+ :font-size 2em
+ :font-weight normal
+ :margin 0 0 1em 0
+ h2
+ :font-size 1.4em
+ :margin 1em 0 .5em 0
+ pre
+ :font-size 13px
+ :font-family Monaco, "DejaVu Sans Mono", "Bitstream Vera Mono", "Courier New", monospace
-- pagination = '<span class="disabled prev_page">&laquo; Previous</span> <span class="current">1</span> <a href="./?page=2" rel="next">2</a> <a href="./?page=3">3</a> <a href="./?page=4">4</a> <a href="./?page=5">5</a> <a href="./?page=6">6</a> <a href="./?page=7">7</a> <a href="./?page=8">8</a> <a href="./?page=9">9</a> <span class="gap">&hellip;</span> <a href="./?page=29">29</a> <a href="./?page=30">30</a> <a href="./?page=2" rel="next" class="next_page">Next &raquo;</a>'
-- pagination_no_page_links = '<span class="disabled prev_page">&laquo; Previous</span> <a href="./?page=2" rel="next" class="next_page">Next &raquo;</a>'
+ - pagination = '<span class="disabled prev_page">&laquo; Previous</span> <span class="current">1</span> <a href="./?page=2" rel="next">2</a> <a href="./?page=3">3</a> <a href="./?page=4">4</a> <a href="./?page=5">5</a> <a href="./?page=6">6</a> <a href="./?page=7">7</a> <a href="./?page=8">8</a> <a href="./?page=9">9</a> <span class="gap">&hellip;</span> <a href="./?page=29">29</a> <a href="./?page=30">30</a> <a href="./?page=2" rel="next" class="next_page">Next &raquo;</a>'
+ - pagination_no_page_links = '<span class="disabled prev_page">&laquo; Previous</span> <a href="./?page=2" rel="next" class="next_page">Next &raquo;</a>'
-%body
- %h1 Samples of pagination styling for will_paginate
- %p
- Find these styles in <b>"examples/pagination.css"</b> of <i>will_paginate</i> library.
- There is a Sass version of it for all you sassy people.
- %p
- Read about good rules for pagination:
- %a{ :href => 'http://kurafire.net/log/archive/2007/06/22/pagination-101' } Pagination 101
- %p
- %em Warning:
- page links below don't lead anywhere (so don't click on them).
+ %body
+ %h1 Samples of pagination styling for will_paginate
+ %p
+ Find these styles in <b>"examples/pagination.css"</b> of <i>will_paginate</i> library.
+ There is a Sass version of it for all you sassy people.
+ %p
+ Read about good rules for pagination:
+ %a{ :href => 'https://gist.github.com/622561' } Pagination 101
+ %p
+ %em Warning:
+ page links below don't lead anywhere (so don't click on them).
- %h2 Unstyled pagination <span style="font-weight:normal">(<i>ewww!</i>)</span>
- %div= pagination
+ %h2 Unstyled pagination <span style="font-weight:normal">(<i>ewww!</i>)</span>
+ %div= pagination
- %h2 Digg.com
- .digg_pagination= pagination
+ %h2 Digg.com
+ .digg_pagination= pagination
- %h2 Digg-style, no page links
- .digg_pagination= pagination_no_page_links
- %p Code that renders this:
- %pre= '<code>%s</code>' % %[<%= will_paginate @posts, :page_links => false %>].gsub('<', '&lt;').gsub('>', '&gt;')
+ %h2 Digg-style, no page links
+ .digg_pagination= pagination_no_page_links
+ %p Code that renders this:
+ %pre= '<code>%s</code>' % %[<%= will_paginate @posts, :page_links => false %>].gsub('<', '&lt;').gsub('>', '&gt;')
- %h2 Digg-style, extra content
- .digg_pagination
- .page_info Displaying entries <b>1&nbsp;-&nbsp;6</b> of <b>180</b> in total
- = pagination
- %p Code that renders this:
- %pre= '<code>%s</code>' % %[<div class="digg_pagination">\n <div clas="page_info">\n <%= page_entries_info @posts %>\n </div>\n <%= will_paginate @posts, :container => false %>\n</div>].gsub('<', '&lt;').gsub('>', '&gt;')
+ %h2 Digg-style, extra content
+ .digg_pagination
+ .page_info Displaying entries <b>1&nbsp;-&nbsp;6</b> of <b>180</b> in total
+ = pagination
+ %p Code that renders this:
+ %pre= '<code>%s</code>' % %[<div class="digg_pagination">\n <div clas="page_info">\n <%= page_entries_info @posts %>\n </div>\n <%= will_paginate @posts, :container => false %>\n</div>].gsub('<', '&lt;').gsub('>', '&gt;')
- %h2 Apple.com store
- .apple_pagination= pagination
+ %h2 Apple.com store
+ .apple_pagination= pagination
- %h2 Flickr.com
- .flickr_pagination
- = pagination
- .page_info (118 photos)
+ %h2 Flickr.com
+ .flickr_pagination
+ = pagination
+ .page_info (118 photos)
View
157 examples/index.html
@@ -1,92 +1,71 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
-</html>
-<head>
- <title>Samples of pagination styling for will_paginate</title>
- <link href='pagination.css' rel='stylesheet' type='text/css' />
- <style type='text/css'>
- html {
- margin: 0;
- padding: 0;
- background: #999;
- font: normal 76% "Lucida Grande", Verdana, Helvetica, sans-serif; }
-
- body {
- margin: 2em;
- padding: 2em;
- border: 2px solid gray;
- background: white;
- color: #222; }
-
- h1 {
- font-size: 2em;
- font-weight: normal;
- margin: 0 0 1em 0; }
-
- h2 {
- font-size: 1.4em;
- margin: 1em 0 .5em 0; }
-
- pre {
- font-size: 13px;
- font-family: Monaco, "DejaVu Sans Mono", "Bitstream Vera Mono", "Courier New", monospace; }
- </style>
-</head>
-<body>
- <h1>Samples of pagination styling for will_paginate</h1>
- <p>
- Find these styles in <b>"examples/pagination.css"</b> of <i>will_paginate</i> library.
- There is a Sass version of it for all you sassy people.
- </p>
- <p>
- Read about good rules for pagination:
- <a href='http://kurafire.net/log/archive/2007/06/22/pagination-101'>Pagination 101</a>
- </p>
- <p>
- <em>Warning:</em>
- page links below don't lead anywhere (so don't click on them).
- </p>
- <h2>
- Unstyled pagination <span style="font-weight:normal">(<i>ewww!</i>)</span>
- </h2>
- <div>
- <span class="disabled prev_page">&laquo; Previous</span> <span class="current">1</span> <a href="./?page=2" rel="next">2</a> <a href="./?page=3">3</a> <a href="./?page=4">4</a> <a href="./?page=5">5</a> <a href="./?page=6">6</a> <a href="./?page=7">7</a> <a href="./?page=8">8</a> <a href="./?page=9">9</a> <span class="gap">&hellip;</span> <a href="./?page=29">29</a> <a href="./?page=30">30</a> <a href="./?page=2" rel="next" class="next_page">Next &raquo;</a>
- </div>
- <h2>Digg.com</h2>
- <div class='digg_pagination'>
- <span class="disabled prev_page">&laquo; Previous</span> <span class="current">1</span> <a href="./?page=2" rel="next">2</a> <a href="./?page=3">3</a> <a href="./?page=4">4</a> <a href="./?page=5">5</a> <a href="./?page=6">6</a> <a href="./?page=7">7</a> <a href="./?page=8">8</a> <a href="./?page=9">9</a> <span class="gap">&hellip;</span> <a href="./?page=29">29</a> <a href="./?page=30">30</a> <a href="./?page=2" rel="next" class="next_page">Next &raquo;</a>
- </div>
- <h2>Digg-style, no page links</h2>
- <div class='digg_pagination'>
- <span class="disabled prev_page">&laquo; Previous</span> <a href="./?page=2" rel="next" class="next_page">Next &raquo;</a>
- </div>
- <p>Code that renders this:</p>
- <pre>
- <code>&lt;%= will_paginate @posts, :page_links =&gt; false %&gt;</code>
- </pre>
- <h2>Digg-style, extra content</h2>
- <div class='digg_pagination'>
- <div class='page_info'>
- Displaying entries <b>1&nbsp;-&nbsp;6</b> of <b>180</b> in total
+ <head>
+ <title>Samples of pagination styling for will_paginate</title>
+ <link href='pagination.css' rel='stylesheet' type='text/css' />
+ <style type='text/css'>
+ html {
+ margin: 0;
+ padding: 0;
+ background: #999999;
+ font: normal 76% "Lucida Grande", Verdana, Helvetica, sans-serif; }
+
+ body {
+ margin: 2em;
+ padding: 2em;
+ border: 2px solid gray;
+ background: white;
+ color: #222222; }
+
+ h1 {
+ font-size: 2em;
+ font-weight: normal;
+ margin: 0 0 1em 0; }
+
+ h2 {
+ font-size: 1.4em;
+ margin: 1em 0 0.5em 0; }
+
+ pre {
+ font-size: 13px;
+ font-family: Monaco, "DejaVu Sans Mono", "Bitstream Vera Mono", "Courier New", monospace; }
+ </style>
+ </head>
+ <body>
+ <h1>Samples of pagination styling for will_paginate</h1>
+ <p>
+ Find these styles in <b>"examples/pagination.css"</b> of <i>will_paginate</i> library.
+ There is a Sass version of it for all you sassy people.
+ </p>
+ <p>
+ Read about good rules for pagination:
+ <a href='https://gist.github.com/622561'>Pagination 101</a>
+ </p>
+ <p>
+ <em>Warning:</em>
+ page links below don't lead anywhere (so don't click on them).
+ </p>
+ <h2>Unstyled pagination <span style="font-weight:normal">(<i>ewww!</i>)</span></h2>
+ <div><span class="disabled prev_page">&laquo; Previous</span> <span class="current">1</span> <a href="./?page=2" rel="next">2</a> <a href="./?page=3">3</a> <a href="./?page=4">4</a> <a href="./?page=5">5</a> <a href="./?page=6">6</a> <a href="./?page=7">7</a> <a href="./?page=8">8</a> <a href="./?page=9">9</a> <span class="gap">&hellip;</span> <a href="./?page=29">29</a> <a href="./?page=30">30</a> <a href="./?page=2" rel="next" class="next_page">Next &raquo;</a></div>
+ <h2>Digg.com</h2>
+ <div class='digg_pagination'><span class="disabled prev_page">&laquo; Previous</span> <span class="current">1</span> <a href="./?page=2" rel="next">2</a> <a href="./?page=3">3</a> <a href="./?page=4">4</a> <a href="./?page=5">5</a> <a href="./?page=6">6</a> <a href="./?page=7">7</a> <a href="./?page=8">8</a> <a href="./?page=9">9</a> <span class="gap">&hellip;</span> <a href="./?page=29">29</a> <a href="./?page=30">30</a> <a href="./?page=2" rel="next" class="next_page">Next &raquo;</a></div>
+ <h2>Digg-style, no page links</h2>
+ <div class='digg_pagination'><span class="disabled prev_page">&laquo; Previous</span> <a href="./?page=2" rel="next" class="next_page">Next &raquo;</a></div>
+ <p>Code that renders this:</p>
+ <pre><code>&lt;%= will_paginate @posts, :page_links =&gt; false %&gt;</code></pre>
+ <h2>Digg-style, extra content</h2>
+ <div class='digg_pagination'>
+ <div class='page_info'>Displaying entries <b>1&nbsp;-&nbsp;6</b> of <b>180</b> in total</div>
+ <span class="disabled prev_page">&laquo; Previous</span> <span class="current">1</span> <a href="./?page=2" rel="next">2</a> <a href="./?page=3">3</a> <a href="./?page=4">4</a> <a href="./?page=5">5</a> <a href="./?page=6">6</a> <a href="./?page=7">7</a> <a href="./?page=8">8</a> <a href="./?page=9">9</a> <span class="gap">&hellip;</span> <a href="./?page=29">29</a> <a href="./?page=30">30</a> <a href="./?page=2" rel="next" class="next_page">Next &raquo;</a>
+ </div>
+ <p>Code that renders this:</p>
+ <pre><code>&lt;div class="digg_pagination"&gt;&#x000A; &lt;div clas="page_info"&gt;&#x000A; &lt;%= page_entries_info @posts %&gt;&#x000A; &lt;/div&gt;&#x000A; &lt;%= will_paginate @posts, :container =&gt; false %&gt;&#x000A;&lt;/div&gt;</code></pre>
+ <h2>Apple.com store</h2>
+ <div class='apple_pagination'><span class="disabled prev_page">&laquo; Previous</span> <span class="current">1</span> <a href="./?page=2" rel="next">2</a> <a href="./?page=3">3</a> <a href="./?page=4">4</a> <a href="./?page=5">5</a> <a href="./?page=6">6</a> <a href="./?page=7">7</a> <a href="./?page=8">8</a> <a href="./?page=9">9</a> <span class="gap">&hellip;</span> <a href="./?page=29">29</a> <a href="./?page=30">30</a> <a href="./?page=2" rel="next" class="next_page">Next &raquo;</a></div>
+ <h2>Flickr.com</h2>
+ <div class='flickr_pagination'>
+ <span class="disabled prev_page">&laquo; Previous</span> <span class="current">1</span> <a href="./?page=2" rel="next">2</a> <a href="./?page=3">3</a> <a href="./?page=4">4</a> <a href="./?page=5">5</a> <a href="./?page=6">6</a> <a href="./?page=7">7</a> <a href="./?page=8">8</a> <a href="./?page=9">9</a> <span class="gap">&hellip;</span> <a href="./?page=29">29</a> <a href="./?page=30">30</a> <a href="./?page=2" rel="next" class="next_page">Next &raquo;</a>
+ <div class='page_info'>(118 photos)</div>
</div>
- <span class="disabled prev_page">&laquo; Previous</span> <span class="current">1</span> <a href="./?page=2" rel="next">2</a> <a href="./?page=3">3</a> <a href="./?page=4">4</a> <a href="./?page=5">5</a> <a href="./?page=6">6</a> <a href="./?page=7">7</a> <a href="./?page=8">8</a> <a href="./?page=9">9</a> <span class="gap">&hellip;</span> <a href="./?page=29">29</a> <a href="./?page=30">30</a> <a href="./?page=2" rel="next" class="next_page">Next &raquo;</a>
- </div>
- <p>Code that renders this:</p>
- <pre>
- <code>&lt;div class="digg_pagination"&gt;
- &lt;div clas="page_info"&gt;
- &lt;%= page_entries_info @posts %&gt;
- &lt;/div&gt;
- &lt;%= will_paginate @posts, :container =&gt; false %&gt;
- &lt;/div&gt;</code>
- </pre>
- <h2>Apple.com store</h2>
- <div class='apple_pagination'>
- <span class="disabled prev_page">&laquo; Previous</span> <span class="current">1</span> <a href="./?page=2" rel="next">2</a> <a href="./?page=3">3</a> <a href="./?page=4">4</a> <a href="./?page=5">5</a> <a href="./?page=6">6</a> <a href="./?page=7">7</a> <a href="./?page=8">8</a> <a href="./?page=9">9</a> <span class="gap">&hellip;</span> <a href="./?page=29">29</a> <a href="./?page=30">30</a> <a href="./?page=2" rel="next" class="next_page">Next &raquo;</a>
- </div>
- <h2>Flickr.com</h2>
- <div class='flickr_pagination'>
- <span class="disabled prev_page">&laquo; Previous</span> <span class="current">1</span> <a href="./?page=2" rel="next">2</a> <a href="./?page=3">3</a> <a href="./?page=4">4</a> <a href="./?page=5">5</a> <a href="./?page=6">6</a> <a href="./?page=7">7</a> <a href="./?page=8">8</a> <a href="./?page=9">9</a> <span class="gap">&hellip;</span> <a href="./?page=29">29</a> <a href="./?page=30">30</a> <a href="./?page=2" rel="next" class="next_page">Next &raquo;</a>
- <div class='page_info'>(118 photos)</div>
- </div>
-</body>
+ </body>
+</html>
Please sign in to comment.
Something went wrong with that request. Please try again.