Going for the Jungle skin feel (like Amazon)

Signed-off-by: Dan Scott <dscott@laurentian.ca>
Signed-off-by: Thomas Berezansky <tsbere@mvlc.org>

diff --git a/Open-ILS/src/templates/opac/parts/record/authors.tt2 b/Open-ILS/src/templates/opac/parts/record/authors.tt2
index 0fabf46..304e272 100644 (file)
--- a/Open-ILS/src/templates/opac/parts/record/authors.tt2
+++ b/Open-ILS/src/templates/opac/parts/record/authors.tt2
@@ -3,19 +3,19 @@
 authors = [
     {
         type => 'author', 
-        label => l('Authors: '),
+        label => l('Author'),
         xpath => '//*[@tag="100"]|//*[@tag="110"]|//*[@tag="111"]'
     }, {
         type => 'added', 
-        label => l('Added Authors: '),
+        label => l('Added Author'),
         xpath => '//*[@tag="700"]|//*[@tag="710"]|//*[@tag="711"]'
     }, {
         type => 'credits', 
-        label => l('Credits: '),
+        label => l('Credited'),
         xpath => '//*[@tag="100"]|//*[@tag="110"]|//*[@tag="111"]'
     }, {
         type => 'cast', 
-        label => l('Cast: '),
+        label => l('Cast'),
         xpath => '//*[@tag="508"]'
     }, {
         type => 'notes', 
@@ -26,14 +26,20 @@ authors = [
 
 BLOCK build_author_links;
     FOR node IN ctx.marc_xml.findnodes(xpath);
+        term = '';
+        qterm = '';
         FOR subfield IN node.childNodes;
             NEXT UNLESS subfield.nodeName == "subfield";
             code = subfield.getAttribute('code');
             NEXT UNLESS code.match('[a-z]');
-            term = subfield.textContent | html;
-            url = mkurl(ctx.opac_root _ '/results', {query => subfield.textContent, qtype => 'author'}, ['page', 'expand']);
-            '<br/><a href="' _ url _ '">' _ term _ '</a>';
+            sf_raw = subfield.textContent;
+            sf = subfield.textContent | html;
+            term = term _ ' ' _ sf;
+            qterm = qterm _ ' ' _ sf_raw;
         END;
+        url = mkurl(ctx.opac_root _ '/results', {query => qterm, qtype => 'author'}, ['page', 'expand']);
+        author_type = label | html;
+        '<a href="' _ url _ '">' _ term _ '</a> (' _ author_type _ '). ';
     END;
 END;
 %]
@@ -41,10 +47,9 @@ END;
 <div class='rdetail_extras_div'>
 [% FOREACH author IN authors;
     NEXT UNLESS author.xpath; 
-    links = PROCESS build_author_links(xpath=author.xpath);
+    links = PROCESS build_author_links(xpath=author.xpath, label=author.label);
     IF links.match('\S') %]
-    <strong>[% author.label | html %]</strong>
-    <div class='rdetail-author-div'>[% links %]</div>
+    <span class='rdetail-author-div'>[% links %]</span>
     [% END %]
 [% END %]
 </div>

diff --git a/Open-ILS/src/templates/opac/parts/record/body.tt2 b/Open-ILS/src/templates/opac/parts/record/body.tt2
index bc42f5d..7010b46 100644 (file)
--- a/Open-ILS/src/templates/opac/parts/record/body.tt2
+++ b/Open-ILS/src/templates/opac/parts/record/body.tt2
@@ -50,7 +50,5 @@
         [% l("This record has been deleted from the database.  We recommend that you remove this title from any bookbags it may have been added to.") %]
     </div>
     [% INCLUDE "opac/parts/record/summary.tt2" %]
-    <br />
-    [% INCLUDE "opac/parts/record/extras.tt2" %]
 </div>
 <!-- ****************** end; page_rdetail.xml ***************************** -->

diff --git a/Open-ILS/src/templates/opac/parts/record/extras.tt2 b/Open-ILS/src/templates/opac/parts/record/extras.tt2
index 5bf5716..c6e403e 100644 (file)
--- a/Open-ILS/src/templates/opac/parts/record/extras.tt2
+++ b/Open-ILS/src/templates/opac/parts/record/extras.tt2
@@ -15,10 +15,8 @@
         END;
 
         extras = [
-            {name => 'subjects', label => l('Subject')}, 
             {name => 'summaryplus',  label => l('Summaries & More'), hide => hide_summary}, 
             {name => 'contents',  label => l('Contents'), hide => !attrs.contents},
-            {name => 'authors',  label => l('Authors')}, 
             {name => 'series',   label => l('Series')},
             {name => 'annotation', label => l('Annotation'), hide => 1}, 
             {name => 'awards',  label => l('Awards, Reviews, & Suggested Reads')}, 

diff --git a/Open-ILS/src/templates/opac/parts/record/subjects.tt2 b/Open-ILS/src/templates/opac/parts/record/subjects.tt2
index 25f6e2e..34f80b1 100644 (file)
--- a/Open-ILS/src/templates/opac/parts/record/subjects.tt2
+++ b/Open-ILS/src/templates/opac/parts/record/subjects.tt2
@@ -48,23 +48,26 @@
     END 
 %]
 
-<div>
-    <table cellpadding="0" cellspacing="0" border="0">
-    [%  any_subjects = 0;
-        FOREACH subj IN subjects;
-            content = PROCESS render_subject(xpath=subj.xpath);
-            IF content.match('\S');
-                any_subjects = 1; %]
-            <tr>
-                <td width="1" style="padding:5px 7px 0px 0px;" valign="top">
-                    <strong>[% subj.label %]</strong>
-                </td>
-                <td style="padding-top:5px;"><div>[% content %] </div></td>
-            </tr>
-            [% END; %]
-        [% END; %]
-    [% IF any_subjects == 0 %]
-        <tr><td><i>[% l('No Subjects') %]</i></td></tr>
-    [% END; %]
-    </table>
-</div>
+[%  BLOCK render_all_subjects;
+    FOREACH subj IN subjects;
+        content = PROCESS render_subject(xpath=subj.xpath);
+        IF content.match('\S');
+%]
+        <table class='rdetail_subject'>
+            <tbody>
+                <tr>
+                    <td class='rdetail_subject_type'>[% subj.label %]</td>
+                    <td class='rdetail_subject_value'>[% content %]</td>
+                </tr>
+            </tbody>
+        </table>
+        [%- END; %]
+    [%- END; %]
+[%- END %]
+
+[%-  subject_html = PROCESS render_all_subjects;
+    IF subject_html.length > 0;
+%]
+<h2 class='rdetail_related_subjects'>[% l('Search for related items by subject') %]</h2>
+[%- subject_html %]
+[%- END %]

diff --git a/Open-ILS/src/templates/opac/parts/record/summary.tt2 b/Open-ILS/src/templates/opac/parts/record/summary.tt2
index a44e447..a77e3e1 100644 (file)
--- a/Open-ILS/src/templates/opac/parts/record/summary.tt2
+++ b/Open-ILS/src/templates/opac/parts/record/summary.tt2
@@ -9,151 +9,132 @@
     [% INCLUDE 'opac/parts/record/refworks.tt2' %]
 [%- END %]
 
-<!-- This holds the record summary information -->
-
-<table width="100%" border="0" cellpadding="0" cellspacing="0" id="rdetail_details_table">
-    <tbody>
-        <tr>
-            <td width="90" valign="top" id="rdetail_image_cell">
-                [% ident = attrs.isbn_clean || attrs.upc; IF ident; %]
-                <a href='[% ctx.media_prefix %]/opac/extras/ac/jacket/large/[% ident | uri %]'><img
-                    alt="[% l('Image of item') %]" id='rdetail_image'
-                    src='[% ctx.media_prefix %]/opac/extras/ac/jacket/[% record.summary.jacket_size %]/[% ident | uri %]' /></a>
-                [% END %]
-                <br />
-            </td>
-    
-            <td valign="top">
-                <table border="0" cellpadding="0" cellspacing="0" width="100%">
-                    <tr>
-                        <td valign="top">
-                            <span id='rdetail_title'>[% attrs.title_extended | html %]</span><br />
-                            [% IF attrs.author %]
-                            <span class='opac-auto-030'>[% l("Author") %]:</span>
-                            <em><a title='[% l("Perform an author search") %]'
-                                    href="[%- 
-                                        authorquery = attrs.author | replace('[,\.:;]', '');
-                                        mkurl(ctx.opac_root _ '/results', {qtype => 'author', query => authorquery}, ['page'])
-                                        -%]">[% attrs.author | html %]</a></em>
-                            [% END %]
-                        </td>
-                        <td align="right" valign="top" nowrap="nowrap" style="white-space:nowrap;">
-                            <div style="width:280px;text-align:left;margin-top:3px;">
-                                <div style="float:right;">
-                                    <div class="rdetail_aux_utils opac-auto-010">
-                                        <a href="[% mkurl(ctx.opac_root _ '/place_hold', {hold_target => ctx.bre_id, hold_type => 'T'}) %]" 
-                                            class="no-dec"><img src="[% ctx.media_prefix %]/images/green_check.png" alt="[% l('place hold') %]" /><span 
-                                                    style="position:relative;top:-3px;left:3px;">[% l('Place Hold') %]</span></a>
-                                    </div>
-                                    <div class="rdetail_aux_utils opac-auto-121">
-                                        [%  
-                                            operation = ctx.mylist.grep(ctx.bre_id).size ? "delete" : "add";
-                                            label = (operation == "add") ? l("Add to my list") : l("Remove from my list"); 
-                                        %]
-                                        <a href="[% ctx.opac_root %]/mylist/[% operation %]?record=[% ctx.bre_id %]" class="no-dec">
-                                            <img src="[% ctx.media_prefix %]/images/clipboard.png" alt="" />
-                                            [% label %]
-                                        </a>
-                                    </div>
-                                </div>
-                                <div style="float:right;margin-right:17px;">
-                                    [% IF attrs.format_icon %]
-                                    <img alt="[% attrs.format_label %]" title="[% attrs.format_label | html %]" src="[% attrs.format_icon %]" />
-                                    [% END %]
-                                </div>
-                            </div>
-                        </td>
-                    </tr>
-                </table>
-                <div class='opac-auto-018'>
-                    <table border="0" cellpadding="0" width="100%">
-                        <tr>
-                            <td nowrap='nowrap' valign="top">
-                                [% IF attrs.isbns.0 %]<strong>[% l("ISBN") %]</strong>[% END %]
-                            </td>
-                            <td valign="top">
-                                [% FOR isbn IN attrs.isbns %][% IF !loop.first; %]<br/>[% END; isbn | html ; END %]
-                            </td>
-                            <td nowrap='nowrap' valign="top">
-                                [% IF attrs.phys_desc %]<strong>[% l("Physical Description") %]</strong>[% END %]
-                            </td>
-                            <td valign="top">[% attrs.phys_desc | html %]</td>
-                        </tr>
-                        [%- IF openurl.enabled == 'true';
-                            FOR issn IN args.issns;
-                                sfx = ResolverResolver.resolve_issn(issn, openurl.baseurl);
-                                FOR res IN sfx;
-                        %]
-                            <tr name="results_issn_tr">
-                                <td valign="top">
-                                    <strong><a href="[% res.target_url %]">
-                                        [% res.public_name %]</a></strong>
-                                </td>
-                                <td>[% res.target_coverage %]</td>
-                            </tr>
-                                [% END %]
-                            [% END %]
-                        [% END %]
-                        <tr>
-                            <td nowrap='nowrap' valign="top">
-                                <strong>[% IF attrs.marc_cn; l("Call Number"); END %]</strong>
-                            </td>
-                            <td valign="top">[% attrs.marc_cn | html %]</td>
-                            <td nowrap='nowrap' valign="top">
-                                <strong>[% IF attrs.edition; l("Edition"); END %]</strong>
-                            </td>
-                            <td valign="top">[% attrs.edition | html %]</td>
-                        </tr>
-                        <tr>
-                            <td nowrap='nowrap' valign="top">
-                                <strong>[% IF attrs.publisher; l("Publisher"); END %]</strong>
-                            </td>
-                            <td valign="top">[% attrs.publisher | html %]</td>
-                            <td nowrap='nowrap' valign="top">
-                                <strong>[% IF attrs.pubdate; l("Publication Date"); END %]</strong>
-                            </td>
-                            <td valign="top">[% attrs.pubdate | html %]</td>
-                        </tr>
-                    </table>
-
-                    <!-- hold/copy summary -->
-                    <div style="padding-top:15px;">
-                        <div>
-                            [% l("[quant,_1,Hold,Holds] with [quant,_2,total copy,total copies]", 
-                                ctx.record_hold_count, ctx.copy_summary.0.count) %]
-                        </div>
-                        <div>[% l('[quant,_1,Copy,Copies] available', ctx.copy_summary.0.available) %]</div>
-                    </div>
-
-                </div>
-            </td>
-        </tr>
-    </tbody>
-</table>
-<br />
+[%- # This holds the record summary information %]
+<div id="rdetail_image_div" style="float: left; margin-right: 1em;">
+    [% ident = attrs.isbn_clean || attrs.upc; IF ident; %]
+    <a href='[% ctx.media_prefix %]/opac/extras/ac/jacket/large/[% ident | uri %]'><img
+        alt="[% l('Image of item') %]" id='rdetail_image'
+        src='[% ctx.media_prefix %]/opac/extras/ac/jacket/[% record.summary.jacket_size %]/[% ident | uri %]' /></a>
+    [% END %]
+    <br />
+</div>
+ 
+<div id="rdetail_actions_div" style="float: right; margin-left: 1em;">
+    <div class="rdetail_aux_utils opac-auto-010">
+        <a href="[% mkurl(ctx.opac_root _ '/place_hold', {hold_target => ctx.bre_id, hold_type => 'T'}) %]" 
+        class="no-dec"><img src="[% ctx.media_prefix %]/images/green_check.png" alt="[% l('place hold') %]" /><span 
+        style="position:relative;top:-3px;left:3px;">[% l('Place Hold') %]</span></a>
+    </div>
+    <div class="rdetail_aux_utils opac-auto-121">
+    [%-  
+        operation = ctx.mylist.grep(ctx.bre_id).size ? "delete" : "add";
+        label = (operation == "add") ? l("Add to my list") : l("Remove from my list"); 
+    %]
+        <a href="[% ctx.opac_root %]/mylist/[% operation %]?record=[% ctx.bre_id %]" class="no-dec">
+            <img src="[% ctx.media_prefix %]/images/clipboard.png" alt="" />
+            [% label %]
+        </a>
+    </div>
+</div>
 
-[% FOR uri IN args.uris %]
-<div class="rdetail_uri">
-    <a href="[% uri.href %]">[% uri.link %]</a>[% ' - ' _ uri.note IF uri.note %]
+<div id='rdetail_title_div'>
+    <h1 id='rdetail_title'>[% attrs.title_extended | html %]</h1><br />
+    [%- INCLUDE "opac/parts/record/authors.tt2" %]
+    [%- IF attrs.format_icon %]
+    <div style="float:right;margin-right:17px;">
+        <img alt="[% attrs.format_label %]" title="[% attrs.format_label | html %]" src="[% attrs.format_icon %]" />
+    </div>
+    [%- END %]
+    [%- IF openurl.enabled == 'true';
+        sfx = []
+        FOR issn IN args.issns;
+            sfx = sfx.import(ResolverResolver.resolve_issn(issn, openurl.baseurl));
+        END;
+        IF sfx.size && sfx.0 != '';
+    %]
+        <div id='rdetail_openurl'>
+            <strong class='rdetail_openurl_title'>[% l("Electronic resources") %]</strong>
+    [%-
+            FOR res IN sfx;
+    %]
+            <div class="rdetail_openurl_entry" style="margin-left: 1em;">
+                <strong><a href="[% res.target_url %]">
+                        [% res.public_name %]</a></strong>
+                <span>[% res.target_coverage %]</td>
+            </div>
+        [%- END %]
+    [%- END %]
+    [%- IF sfx.size && sfx.0 != '' %]
+        </div>    
+    [%- END %]
+    [%- FOR uri IN args.uris; %]
+    <div class="rdetail_uri">
+        <a href="[% uri.href %]">[% uri.link %]</a>[% ' - ' _ uri.note IF uri.note %]
+    </div>
+    [%- END %]
+    [%- # hold/copy summary %]
+    [%- IF ctx.copy_summary.0.count %]
+    <div class="rdetail_copy_counts">
+        <span>
+            [%- l("[quant,_1,current hold,current holds] with [quant,_2,total copy,total copies].", 
+                ctx.record_hold_count, ctx.copy_summary.0.count) %]
+        </span>
+        <span>[% l('[quant,_1,copy,copies] currently available.', ctx.copy_summary.0.available) %]</span>
+    </div>
+    [% END %]
 </div>
-[% END %]
 
-<br />
+<h2 id='rdetail_record_details'>[% l("Record details") %]</h2>
+<ul>
+    [%- IF attrs.isbns.0; FOR isbn IN attrs.isbns %]
+    <li class='rdetail_isbns'>
+        <strong class='rdetail_label'>[% l('ISBN:'); %]</strong>
+        <span class='rdetail_value'>[% isbn | html  %]</span>
+    </li>
+        [%- END %]
+    [%- END %]
+    [%- IF attrs.issns.0; FOR issn IN attrs.issns %]
+    <li class='rdetail_issns'>
+        <strong class='rdetail_label'>[% l('ISSN:'); %]</strong>
+        <span class='rdetail_value'>[% issn | html  %]</span>
+    </li>
+        [%- END %]
+    [%- END %]
+
+    [%- IF attrs.phys_desc %]
+    <li id='rdetail_phys_desc'>
+        <strong class='rdetail_label'>[% l("Physical Description:") %]</strong>
+        <span class='rdetail_value'>[% attrs.phys_desc | html %]</span>
+    </li>
+    [%- END %]
+    [%- IF attrs.edition %]
+    <li id='rdetail_edition'>
+        <strong class='rdetail_label'>[% l("Edition:") %]</strong>
+        <span class='rdetail_value'>[% attrs.edition | html %]</span>
+    </li>
+    [%- END %]
+    [%- IF attrs.publisher %]
+    <li id='rdetail_publisher'>
+        <strong class='rdetail_label'>[% l("Publisher:") %]</strong>
+        <span class='rdetail_value'>[% attrs.publisher | html %] [% IF attrs.pubdate; attrs.pubdate | html; END %]</span>
+    </li>
+    [%- END %]
+</ul>
 
 <table cellpadding="0" cellspacing="0" border="0" width="100%" id="rdetails_status">
     <thead>
         <tr>
-            <td>[% l("Location") %]</td>
-            <td>[% l("Call Number") %]</td>
-            <td>[% l("Barcode") %]</td>
-            <td>[% l("Shelving Location") %]</td>
+            <th id='copy_header_library'>[% l("Location") %]</th>
+            <th id='copy_header_callnmber'>[% l("Call Number") %]</th>
+            <th id='copy_header_barcode'>[% l("Barcode") %]</th>
+            <th id='copy_header_shelfloc'>[% l("Shelving Location") %]</th>
             [% IF ctx.is_staff %]
-            <td>[% l("Age Hold Protection") %]</td>
-            <td>[% l("Create Date") %]</td>
-            <td>[% l("Holdable?") %]</td>
+            <th id='copy_header_age_hold'>[% l("Age Hold Protection") %]</th>
+            <th id='copy_header_create_date'>[% l("Create Date") %]</th>
+            <th id='copy_header_holdable'>[% l("Holdable?") %]</th>
             [% END %]
-            <td>[% l("Status") %]</td>
-            <td>[% l("Due Date") %]</td>
+            <th id='copy_header_status'>[% l("Status") %]</th>
+            <th id='copy_header_due_date'>[% l("Due Date") %]</th>
         </tr>
     </thead>
     <tbody class="copy_details_table">
@@ -161,25 +142,25 @@
         FOR copy_info IN ctx.copies;
             NEXT IF copy_info.call_number_label == '##URI##' %]
         <tr>
-            <td>
+            <td header='copy_header_library'>
             [%-
                 org_name = ctx.get_aou(copy_info.circ_lib).name;
                 org_name | html
             -%]
             </td>
-            <td>[% copy_info.call_number_label | html %]</td>
-            <td>[% copy_info.barcode | html %]</td>
-            <td>[% copy_info.copy_location | html %]</td>
+            <td header='copy_header_callnumber'>[% copy_info.call_number_label | html %]</td>
+            <td header='copy_header_barcode'>[% copy_info.barcode | html %]</td>
+            <td header='copy_header_shelfloc'>[% copy_info.copy_location | html %]</td>
             [% IF ctx.is_staff %]
-            <td>
+            <td header='copy_header_age_hold'>
                 [% copy_info.age_protect ?
                     ctx.get_crahp(copy_info.age_protect).name : l('None') | html %]
             </td>
-            <td>[% date.format(
+            <td header='copy_header_date_format'>[% date.format(
                 ctx.parse_datetime(copy_info.create_date),
                 DATE_FORMAT
             ) %]</td>
-            <td>[%  # Show copy/volume hold links to staff (without
+            <td header='copy_header_holdable'>[%  # Show copy/volume hold links to staff (without
                     # checking whether they have permissions to do those).
                     overall_holdable = (copy_info.holdable == 't' AND
                         copy_info.location_holdable == 't' AND
@@ -196,8 +177,8 @@
                         l("No");
                     END %]</td>
             [% END %]
-            <td>[% copy_info.copy_status | html %]</td>
-            <td>[%
+            <td header='copy_header_status'>[% copy_info.copy_status | html %]</td>
+            <td header='due_date'>[%
                 IF copy_info.due_date;
                     date.format(
                         ctx.parse_datetime(copy_info.due_date),
@@ -240,21 +221,24 @@
                 [% END %]
             </td>
         </tr>
-        <tr>
-            <td>
-                [% IF CGI.param('expand') == 'all' %]
-                    <img src="[% ctx.media_prefix %]/images/minus_sign.png" />
-                    <a href="[% mkurl('', {}, ['expand']) %]">[% l('Collapse all tabs') %]</a>
-                [% ELSE %]
-                    <img src="[% ctx.media_prefix %]/images/plus_sign.png" />
-                    <a href="[% mkurl('', {expand => 'all'}) %]">[% l('Expand all tabs') %]</a>
-                [% END %]
-            </td>
-        </tr>
-
     </tbody>
 </table>
 
+[%- INCLUDE "opac/parts/record/subjects.tt2" %]
+
+<h2 class='rdetail_related_series'>[% l('Search for related items by series') %]</h2>
+[%- INCLUDE "opac/parts/record/series.tt2" %]
+
+<div>
+    [%- IF CGI.param('expand') == 'all' %]
+        <img src="[% ctx.media_prefix %]/images/minus_sign.png" />
+        <a href="[% mkurl('', {}, ['expand']) %]">[% l('Collapse all tabs') %]</a>
+    [%- ELSE %]
+        <img src="[% ctx.media_prefix %]/images/plus_sign.png" />
+        <a href="[% mkurl('', {expand => 'all'}) %]">[% l('Expand all tabs') %]</a>
+    [%- END %]
+</div>
+
 <div id="rdetail_extras_expand" class="hide_me">
     <a href="#"><img
         src="[% ctx.media_prefix %]/images/plus_sign.png" /></a>

diff --git a/Open-ILS/web/css/skin/default/opac/style.css b/Open-ILS/web/css/skin/default/opac/style.css
index cc8dcf4..2b747eb 100644 (file)
--- a/Open-ILS/web/css/skin/default/opac/style.css
+++ b/Open-ILS/web/css/skin/default/opac/style.css
@@ -384,21 +384,27 @@ div.select-wrapper:hover {
        padding-right: 50px;
 }
 
+#rdetails_status {
+    margin-top: 1.5em;
+}
+
 #rdetails_status td, #rdetails_status2 td {
        white-space:nowrap !important;
        padding: 7px 0px 3px 13px;
 }
 
-#rdetails_status thead td {
+#rdetails_status thead th {
        background-color: #d8d8d8;
        padding: 13px 0px 13px 13px;
        font-size: 10px;
        text-transform: uppercase;
        font-weight: bold;
+    text-align: left;
 }
 
 #rdetails_status tbody td {
-       padding-left: 13px;;
+       padding-left: 13px;
+    text-align: left;
 }
 
 .rdetail_extras {
@@ -1044,7 +1050,30 @@ a.opac-button {
     width: 100%;
 }
 
+.rdetail_copy_counts {
+    margin-top: 1em;
+}
+
+#rdetail_record_details {
+    clear: both;
+    margin-top: 1.5em;
+    padding-top: 1.5em;
+}
+
+.rdetail_subject_type {
+    vertical-align: top;
+    font-weight: bold;
+}
+
 .bookbag-item-row td { vertical-align: top; }
 
 .error { color: red; font-weight: bold; }
 .success { color: green; font-weight: bold; }
+
+.rdetail_related_subjects {
+    margin-top: 1.5em;
+}
+
+.rdetail_related_series {
+    margin-top: 1.5em;
+}