From 8d8b587e5fd7b164984455362811cfce000cd05e Mon Sep 17 00:00:00 2001 From: Daniel Ritz Date: Tue, 17 Nov 2015 15:04:15 +0100 Subject: [PATCH 4/4] Pagination: change to a GitHub like style This also looks nice in the new responsive mode. --- public/stylesheets/application.css | 32 ++++++++++++++++++++++++++++++-- 1 file changed, 30 insertions(+), 2 deletions(-) diff --git a/public/stylesheets/application.css b/public/stylesheets/application.css index 2fd4bc1..78cb1a4 100644 --- a/public/stylesheets/application.css +++ b/public/stylesheets/application.css @@ -498,7 +498,7 @@ textarea#custom_field_default_value {width: 95%; resize:vertical} input#content_comments {width: 99%} -span.pagination {margin-top:8px; font-size: 90%} +span.pagination {margin-left:3px} .pagination ul.pages { margin: 0 5px 0 0; padding: 0; @@ -506,7 +506,35 @@ span.pagination {margin-top:8px; font-size: 90%} } .pagination ul.pages li { display: inline-block; - padding-right: 4px; + padding: 0; + border: 1px solid #BBB; + margin-left: -1px; + line-height: 2em; +} +.pagination ul.pages li a, +.pagination ul.pages li span { + padding: 4px 10px; +} +.pagination ul.pages li:first-child { + border-top-left-radius: 4px; + border-bottom-left-radius: 4px; +} +.pagination ul.pages li:last-child { + border-top-right-radius: 4px; + border-bottom-right-radius: 4px; +} +.pagination ul.pages li.current { + color: white; + background-color: #628DB6; + border-color: #628DB6; +} +.pagination ul.pages li.page:hover { + background-color: #EEE; +} +.pagination ul.pages li.page a:hover, +.pagination ul.pages li.page a:active { + color: inherit; + text-decoration: inherit; } #search-form fieldset p {margin:0.2em 0;} -- 2.6.2