Download as
Browse Code »

Commit 6e0b1eff3eec336057bb3b7b4cae3f66eca90c1e

Authored by Jared Pace
1 parent 363d9f15
Exists in master and in 1 other branch production

Style the pagination

Showing 4 changed files with 48 additions and 13 deletions   Show diff stats
app/views/errs/_table.html.haml
  Diff comments   View file @6e0b1ef
... ... @@ -24,4 +24,5 @@
24 24 - if errs.none?
25 25 %tr
26 26 %td{:colspan => (@app ? 5 : 6)}
27   - %em No errs have been caught, yet
28 27 \ No newline at end of file
  28 + %em No errs have been caught, yet
  29 += will_paginate @errs, :previous_label => '« Previous', :next_label => 'Next »'
29 30 \ No newline at end of file
... ...
app/views/errs/all.html.haml
  Diff comments   View file @6e0b1ef
1 1 - content_for :title, 'All Errs'
2 2 - content_for :action_bar do
3   - = will_paginate(@errs)
4 3 = link_to 'hide resolved', errs_path, :class => 'button'
5 4 = render 'table', :errs => @errs
6 5 \ No newline at end of file
... ...
app/views/errs/index.html.haml
  Diff comments   View file @6e0b1ef
1 1 - content_for :title, 'Unresolved Errs'
2 2 - content_for :action_bar do
3   - = will_paginate(@errs)
4 3 = link_to 'show resolved', all_errs_path, :class => 'button'
5 4 = render 'table', :errs => @errs
6 5 \ No newline at end of file
... ...
public/stylesheets/application.css
  Diff comments   View file @6e0b1ef
... ... @@ -265,22 +265,58 @@ pre {
265 265  
266 266 /* Pagination */
267 267 .pagination {
268   - float: left;
269   - margin-right: 0.8em;
270   - text-align: left;
271   - font-size: 0.9em;
  268 + margin: 24px 0;
  269 + text-align: center;
272 270 }
273   -.pagination a, .pagination span {
  271 +.pagination a, .pagination em, .pagination span {
274 272 display: inline-block;
275   - padding: 0 0.3em;
276   - background-color: #666666;
277   - border: 1px solid #505050;
  273 + padding: 0 0.8em;
  274 + margin: 0 0.2em;
  275 + line-height: 30px;
  276 + color: #666;
  277 + background: #FFF url(images/button-bg.png) 0 50% repeat-x;
  278 + border: 1px solid #BBB;
  279 + border-radius: 5px;
  280 + -moz-border-radius: 5px;
  281 + -webkit-border-radius: 5px;
278 282 }
279 283 .pagination a:hover {
280 284 text-decoration: none !important;
  285 + box-shadow: 0px 0px 4px #69C;
  286 + -moz-box-shadow: 0px 0px 4px #69C;
  287 + -webkit-box-shadow: 0px 0px 4px #69C
  288 +}
  289 +.pagination .previous_page, .pagination .next_page {
  290 + padding: 0 1em;
  291 + margin: 0 2.5em 0 0;
  292 + line-height: 39px;
  293 + border-radius: 39px;
  294 + -moz-border-radius: 39px;
  295 + -webkit-border-radius: 39px;
  296 +}
  297 +.pagination .next_page {
  298 + margin: 0 0 0 2.5em;
  299 +}
  300 +.pagination .disabled {
  301 + opacity: 0.5;
  302 + -moz-opacity: 0.5;
  303 + -webkit-opacity: 0.5;
  304 +}
  305 +.pagination em {
  306 + padding: 0em 0.6em;
  307 + line-height: 26px;
  308 + background-color: #CCC;
  309 + background-image: none;
  310 + border-color: #FFF;
  311 + box-shadow: inset 0 0 5px #999;
  312 + -moz-box-shadow: inset 0 0 5px #999;
  313 + -webkit-box-shadow: inset 0 0 5px #999;
  314 + font-style: normal;
281 315 }
282   -.pagination span {
283   - color: #AAA;
  316 +.pagination .gap {
  317 + padding: 0 0.4em;
  318 + border: none;
  319 + background: none;
284 320 }
285 321  
286 322 /* Buttons */
... ...