[deltacloud-devel] [PATCH 2/2] Style pagination somewhat.

[Jakub Steiner]

The inputbuttons still have some issues:
- Cannot do dynamic width. Three digit pages won't fit quite, single digit are too
wide. In future I will probably replace these with links for JS version.
- previous and next buttons might be nice with an arrow icon in future.
- :active state suffers from some jumping on FF
---
 src/app/helpers/templates_helper.rb             |    2 +-
 src/app/stylesheets/aggregator.scss             |   40 +++++++++++++++++++++++
 src/app/views/templates/_searched_packages.haml |    4 ++-
 3 files changed, 44 insertions(+), 2 deletions(-)

diff --git a/src/app/helpers/templates_helper.rb b/src/app/helpers/templates_helper.rb
index 6323233..1ffcd2f 100644
--- a/src/app/helpers/templates_helper.rb
+++ b/src/app/helpers/templates_helper.rb
@@ -2,7 +2,7 @@ module TemplatesHelper
   class ButtonPaginationRenderer < WillPaginate::LinkRenderer
     def page_link(page, text, attributes = {})
       #submit_tag text, :name => 'page'
-      "<input type=submit value='#{text}' name='page'/>"
+      "<input type=submit value='#{text}' name='page'
class='#{attributes[:class]}' />"
     end
   end
 end
diff --git a/src/app/stylesheets/aggregator.scss b/src/app/stylesheets/aggregator.scss
index 7f1d6e3..2a4711b 100644
--- a/src/app/stylesheets/aggregator.scss
+++ b/src/app/stylesheets/aggregator.scss
@@ -865,6 +865,46 @@ fieldset.gap {
     color: $errorcl;
   }
 }
+
+.pagination {
+  font-size: 90%;
+  text-align: right;
+  .disabled {
+    display: none;
+  }
+  input {
+    display: inline-block;
+    text-align: center;
+    background: none;
+    border: 1px solid $strokecl;
+    width: 18px; padding: 3px; margin-right: 4px;
+    @include border-radius(0);
+    &.prev_page, &.next_page {
+      width: 54px;
+      &:active, &:hover, &:focus { /* behave like links, not buttons */
+        width: 54px;
+      }
+    }
+    &:active, &:hover, &:focus { /* behave like links, not buttons */
+      text-align: center;
+      background: none;
+      @include no-box-shadow();
+      width: 18px; padding: 3px; margin-right: 4px;
+    }
+  }
+  .current {
+    text-align: center;
+    display: inline-block;
+    width: 22px;
+    border: none;
+    font-weight: bold;
+  }
+}
+
+.pageinfo {
+  float: left;
+}
+
 /* simple two column label + input pairs */
 .dcloud_form {
   fieldset {
diff --git a/src/app/views/templates/_searched_packages.haml
b/src/app/views/templates/_searched_packages.haml
index fdc8ad1..7122ea5 100644
--- a/src/app/views/templates/_searched_packages.haml
+++ b/src/app/views/templates/_searched_packages.haml
@@ -35,7 +35,9 @@
       - disabled = params[:selected_packages].to_a.include?(pkg)
       = check_box_tag 'packages[]', pkg, selected, {:disabled => disabled, :id
=> "pkg_#{pkg}"}
       = label_tag "pkg_#{pkg}", pkg
+.pageinfo
+  = page_entries_info @searched_packages, :entry_name => 'package'
 = will_paginate @searched_packages, :params => {:package_search =>
params[:package_search]}, :renderer => TemplatesHelper::ButtonPaginationRenderer.new,
:previous_label => 'Previous', :next_label => 'Next'
-= page_entries_info @searched_packages, :entry_name => 'package'
+
 
 = render :partial => 'addbuttons'
-- 
1.7.2.3