Commit 6e0b1eff3eec336057bb3b7b4cae3f66eca90c1e
1 parent
363d9f15
Exists in
master
and in
1 other branch
Style the pagination
Showing
4 changed files
with
48 additions
and
13 deletions
Show diff stats
app/views/errs/_table.html.haml
| @@ -24,4 +24,5 @@ | @@ -24,4 +24,5 @@ | ||
| 24 | - if errs.none? | 24 | - if errs.none? |
| 25 | %tr | 25 | %tr |
| 26 | %td{:colspan => (@app ? 5 : 6)} | 26 | %td{:colspan => (@app ? 5 : 6)} |
| 27 | - %em No errs have been caught, yet | ||
| 28 | \ No newline at end of file | 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 | \ No newline at end of file | 30 | \ No newline at end of file |
app/views/errs/all.html.haml
| 1 | - content_for :title, 'All Errs' | 1 | - content_for :title, 'All Errs' |
| 2 | - content_for :action_bar do | 2 | - content_for :action_bar do |
| 3 | - = will_paginate(@errs) | ||
| 4 | = link_to 'hide resolved', errs_path, :class => 'button' | 3 | = link_to 'hide resolved', errs_path, :class => 'button' |
| 5 | = render 'table', :errs => @errs | 4 | = render 'table', :errs => @errs |
| 6 | \ No newline at end of file | 5 | \ No newline at end of file |
app/views/errs/index.html.haml
| 1 | - content_for :title, 'Unresolved Errs' | 1 | - content_for :title, 'Unresolved Errs' |
| 2 | - content_for :action_bar do | 2 | - content_for :action_bar do |
| 3 | - = will_paginate(@errs) | ||
| 4 | = link_to 'show resolved', all_errs_path, :class => 'button' | 3 | = link_to 'show resolved', all_errs_path, :class => 'button' |
| 5 | = render 'table', :errs => @errs | 4 | = render 'table', :errs => @errs |
| 6 | \ No newline at end of file | 5 | \ No newline at end of file |
public/stylesheets/application.css
| @@ -265,22 +265,58 @@ pre { | @@ -265,22 +265,58 @@ pre { | ||
| 265 | 265 | ||
| 266 | /* Pagination */ | 266 | /* Pagination */ |
| 267 | .pagination { | 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 | display: inline-block; | 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 | .pagination a:hover { | 283 | .pagination a:hover { |
| 280 | text-decoration: none !important; | 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 | /* Buttons */ | 322 | /* Buttons */ |