fix broken "Pagination 101" link

closes mislav#102
keating · Feb 25, 2011 · f169dcc · f169dcc
1 parent 260c1c4
commit f169dcc
Show file tree

Hide file tree

Showing 3 changed files with 128 additions and 149 deletions.
diff --git a/README.rdoc b/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]
 

diff --git a/examples/index.haml b/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)
diff --git a/examples/index.html b/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>