From 13d414e675a1aed945ba9a4ccc2d4421b308b19a Mon Sep 17 00:00:00 2001
From: Dan Scott <dan@coffeecode.net>
Date: Sun, 8 Jan 2012 17:53:03 -0500
Subject: [PATCH] TPAC: Simply record summary navigation markup

Currently we have the next / previous links on the far right side of the
record summary page, whereas the "Showing item # of #" is on the left
hand side of the page. On wide screens, this leads to a large gap
between the two informational elements. In addition, as the elements are
floated, the vertical alignment is thrown off if you attempt to bring
them together.

The solution is to group the elements inside a SPAN with inline-block
displays for the embedded DIVs. This enables the elements to reflow
appropriately on mobile sized screens while keeping the alignment clean.
In addition, some inline style gets moved to style.css and some
unnecessary elements are removed.

Signed-off-by: Dan Scott <dan@coffeecode.net>
Signed-off-by: Bill Erickson <berick@esilibrary.com>
---
 Open-ILS/src/templates/opac/parts/record/body.tt2 | 10 +++----
 Open-ILS/web/css/skin/default/opac/style.css      | 33 +++++++++++------------
 2 files changed, 19 insertions(+), 24 deletions(-)

diff --git a/Open-ILS/src/templates/opac/parts/record/body.tt2 b/Open-ILS/src/templates/opac/parts/record/body.tt2
index 6a64e4ecae..c5d9ec8923 100644
--- a/Open-ILS/src/templates/opac/parts/record/body.tt2
+++ b/Open-ILS/src/templates/opac/parts/record/body.tt2
@@ -7,12 +7,12 @@
 
     [% IF ctx.search_result_index >= 0 %]
     <div id="rdetail_header">
-        <div style="float:left;">
+        <span id="rdetail_results">
             <a href='[% mkurl(ctx.opac_root _ '/results', {}, stop_parms); %]'>[% l('&#9668; Search Results') %]</a>
             <span id="rdetail_result_count">
                 [% l('Showing Item [_1] of [_2]', ctx.search_result_index + 1, ctx.hit_count) %]
             </span>
-        </div>
+        </span>
         <div id="rdetail_result_nav">
             [%
                 IF ctx.prev_search_record;
@@ -23,11 +23,9 @@
                     ctx.prev_rec_url = mkurl(ctx.prev_search_record, prev_args, stop_parms);
             %]
             <a class='np_nav_link classic_link' title='[% l("Previous Record") %]'
-                href='[% ctx.prev_rec_url %]'><span class="nav_arrow_fix">&#9668; </span>[% l('Previous') %]</a>
+                href='[% ctx.prev_rec_url %]'>&#9668; [% l('Previous') %]</a>
             [% END %]
 
-            <span style="padding:0px 10px;"> </span>
-
             [% 
                 IF ctx.next_search_record;
                     next_args = {};
@@ -37,7 +35,7 @@
                     ctx.next_rec_url = mkurl(ctx.next_search_record, next_args, stop_parms);
             %]
             <a class='np_nav_link classic_link' title='[% l("Next Record") %]'
-                href='[% ctx.next_rec_url %]'>[% l('Next') %]<span class="nav_arrow_fix"> &#9658;</span></a>
+                href='[% ctx.next_rec_url %]'>[% l('Next') %] &#9658;</a>
             [% END %]
 
         </div>
diff --git a/Open-ILS/web/css/skin/default/opac/style.css b/Open-ILS/web/css/skin/default/opac/style.css
index 9848bba580..62eb298246 100644
--- a/Open-ILS/web/css/skin/default/opac/style.css
+++ b/Open-ILS/web/css/skin/default/opac/style.css
@@ -316,25 +316,28 @@ span.dash_divider {
 }
 
 #rdetail_header {
-	font-size:14px;
-	font-weight:bold;
-	color:#074079;
-	padding: 5px 7px 6px 0px;
+    padding: 5px 7px 6px 0px;
     margin-left: 1em;
-	border-bottom: 1px dotted #ccc;
+    border-bottom: 1px dotted #ccc;
+}
+
+#rdetail_results a {
+    color:#074079;
+    font-weight:bold;
+    font-size: 1.2em;
 }
 
 #rdetail_result_count {
-	color: black;
-	font-size: 11px;
-	font-weight: normal;
-    padding-left: 10px;
+    color: black;
+    font-weight: normal;
+    padding-left: 1em;
+    display: inline-block;
 }
 
 #rdetail_result_nav {
-	float:right;
-	font-size: 11px;
-	font-weight:normal;
+    font-weight:normal;
+    padding-left: 1em;
+    display: inline-block;
 }
 
 #rdetail_details_table {
@@ -712,12 +715,6 @@ div.format_icon {
 	font-size: 11px;
 }
 
-.nav_arrow_fix {
-	font-size:8px;
-	position:relative;
-	top:-1px;
-}
-
 #result_table_div {
 	margin-top: 1em;
 }
-- 
2.11.0