Adapt pagination for smaller screens (#19097).

git-svn-id: http://svn.redmine.org/redmine/trunk@14947 e93f8b46-1217-0410-a6f0-8f06a7374b81

diff --git a/lib/redmine/pagination.rb b/lib/redmine/pagination.rb
index e6faa8a68b3d96faa3a5e728ed959d0522a86f2e..f1d05c7612c2cf05d398adb0e0a76ef9aac01f9c 100644 (file)
--- a/lib/redmine/pagination.rb
+++ b/lib/redmine/pagination.rb
@@ -220,11 +220,12 @@ module Redmine
         end
         html << '</ul>'
 
-        html << content_tag('span', "(#{paginator.first_item}-#{paginator.last_item}/#{paginator.item_count})", :class => 'items') + ' '
-
+        info = ''.html_safe
+        info << content_tag('span', "(#{paginator.first_item}-#{paginator.last_item}/#{paginator.item_count})", :class => 'items') + ' '
         if per_page_links != false && links = per_page_links(paginator, &block)
-          html << content_tag('span', links.to_s, :class => 'per-page')
+          info << content_tag('span', links.to_s, :class => 'per-page')
         end
+        html << content_tag('span', info)
 
         html.html_safe
       end

diff --git a/public/stylesheets/application.css b/public/stylesheets/application.css
index 7e3b94a76530cf1c60a74bd43287e2caeeb01680..55981e908ebd6db9042f6fbfba23dda3126b87d7 100644 (file)
--- a/public/stylesheets/application.css
+++ b/public/stylesheets/application.css
@@ -506,6 +506,9 @@ span.pagination {margin-left:3px; color:#888;}
   border: 1px solid #ccc;
   margin-left: -1px;
   line-height: 2em;
+  margin-bottom: 1em;
+  white-space: nowrap;
+  text-align: center;
 }
 .pagination ul.pages li a,
 .pagination ul.pages li span {
@@ -532,6 +535,7 @@ span.pagination {margin-left:3px; color:#888;}
   color: inherit;
   text-decoration: inherit;
 }
+span.pagination>span {white-space:nowrap;}
 
 #search-form fieldset p {margin:0.2em 0;}
 

diff --git a/public/stylesheets/responsive.css b/public/stylesheets/responsive.css
index dc3ebba8a829fdfd87b26f20fd6b1b40f69b465e..73b40875d98a62672ebaca33960af69569957be4 100644 (file)
--- a/public/stylesheets/responsive.css
+++ b/public/stylesheets/responsive.css
@@ -825,3 +825,11 @@
         width: 100%;
     }
 }
+
+@media all and (max-width: 599px) {
+  .pagination ul.pages li {display:none;}
+  .pagination ul.pages li.current,
+  .pagination ul.pages li.previous,
+  .pagination ul.pages li.next {display:inline-block; width:32%; overflow:hidden;}
+}
+