From 63a67a2c8bc64af72f8bd749b6e544e7441d84b1 Mon Sep 17 00:00:00 2001
From: Owen Leonard <oleonard@myacpl.org>
Date: Sat, 11 Jul 2020 12:09:49 +0000
Subject: [PATCH] Bug 25906: Style corrections for OPAC serial pages

This patch makes some CSS changes to the OPAC SCSS and to the OPAC
"full serial issues" page to improve the style.

I've expanded the in-page CSS on the full serial issues page for
readability and added Template Toolkit's "collapse" filter to remove the
whitespace on rendering.

To test, apply the patch and rebuild the OPAC CSS
(https://wiki.koha-community.org/wiki/Working_with_SCSS_in_the_OPAC_and_staff_client)

- Locate a serial record in the OPAC.
- Click "More details" to view the issues page.
- Confirm that the "view" tabs look correct, with consistent padding.
- Click the "Full history" tab.
- In the sidebar, the filter should have full-width dropdowns and clear
  button.

Signed-off-by: Timothy Alexis Vass <timothy_alexis.vass@ub.lu.se>

Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>
---
 koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss    |  7 +---
 .../en/modules/opac-full-serial-issues.tt          | 49 ++++++++++++++++++++--
 .../bootstrap/en/modules/opac-serial-issues.tt     |  9 +++-
 3 files changed, 53 insertions(+), 12 deletions(-)

diff --git a/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss b/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss
index cf255ffec3..ea5a396094 100644
--- a/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss
+++ b/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss
@@ -1460,6 +1460,7 @@ div {
         font-size: 14px;
         line-height: 20px;
         text-align: center;
+        text-decoration: none;
         vertical-align: middle;
     }
 }
@@ -1475,12 +1476,6 @@ div {
     font-weight: bold;
 }
 
-#Fullhistory,
-#Briefhistory {
-    background:  transparent none;
-    padding-left: 0;
-}
-
 /* pagination */
 
 .pagination {
diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-full-serial-issues.tt b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-full-serial-issues.tt
index 42d63dd77a..b4f5aa574d 100644
--- a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-full-serial-issues.tt
+++ b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-full-serial-issues.tt
@@ -5,9 +5,50 @@
 <title>[% IF ( LibraryNameTitle ) %][% LibraryNameTitle | html %][% ELSE %]Koha online[% END %] catalog &rsaquo;  Full subscription history for [% bibliotitle | html %]</title>
 [% INCLUDE 'doc-head-close.inc' %]
 [% BLOCK cssinclude %]
+    [% FILTER collapse %]
     <style>
-        #search-facets fieldset { border: 0; margin: 0;padding:0;}#search-facets ol{padding:.3em;}#search-facets li {list-style-type:none;padding:4px 4px;}#search-facets label{font-weight:bold;display:block;margin:.2em 0;}#search-facets fieldset.action {padding-left:4px;margin:.3em;}div.tabsub { clear:both;}#subtabs a { display:block;float:left;border:1px solid #CCC;padding:.2em .4em;margin:.3em;text-decoration:none;font-size:115%;}#subtabs strong { display:block; float: left; font-size:115%;padding:.2em .4em; margin: 0.3em 0;}#subtabs { margin-top : 1em; }a.currentsubtab { background-color:#FFC;}
+        div.tabsub {
+            clear: both;
+        }
+        #filterform label {
+            font-weight: bold;
+        }
+        #filterform select {
+            width: 100%;
+        }
+        #subtabs a {
+            display: block;
+            float: left;
+            border: 1px solid #CCC;
+            padding: .2em .4em;
+            margin: .3em;
+            text-decoration: none;
+            font-size: 115%;
+        }
+
+        #subtabs strong {
+            display: block;
+            float: left;
+            font-size: 115%;
+            padding: .2em .4em;
+            margin: 0.3em 0;
+        }
+
+        #subtabs {
+            margin-top: 1em;
+        }
+        .action .btn {
+            font-size: 90%;
+            width: 100%;
+        }
+        .menu-collapse {
+            padding: .5em;
+        }
+        a.currentsubtab {
+            background-color: #FFC;
+        }
     </style>
+    [% END %]
 [% END %]
 </head>
 [% INCLUDE 'bodytag.inc' bodyid='opac-full-serial-issues' bodyclass='scrollto' %]
@@ -30,12 +71,12 @@
                             <ul class="menu-collapse">
                                 <li>
                                     <label for="libraryfilter">Library: </label>
-                                    <select id="libraryfilter" name="libraryfilter" style="width:10em;"></select>
+                                    <select id="libraryfilter" name="libraryfilter"></select>
                                     <label for="subscriptionidfilter">Subscription: </label>
-                                    <select id="subscriptionidfilter" name="subscriptionfilter" style="width:10em;" disabled="disabled"></select>
+                                    <select id="subscriptionidfilter" name="subscriptionfilter" disabled="disabled"></select>
                                 </li>
                                 <li class="action">
-                                    <input type="reset" id="reset" class="btn" value="Clear" />
+                                    <input type="reset" id="reset" class="btn btn-default" value="Clear" />
                                 </li>
                             </ul>
                             </form>
diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-serial-issues.tt b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-serial-issues.tt
index 4be2764a6b..27d5e1f756 100644
--- a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-serial-issues.tt
+++ b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-serial-issues.tt
@@ -2,7 +2,12 @@
 [% INCLUDE 'doc-head-open.inc' %]
 <title>[% IF ( LibraryNameTitle ) %][% LibraryNameTitle | html %][% ELSE %]Koha online[% END %] catalog &rsaquo;  Issues for a subscription</title>
 [% INCLUDE 'doc-head-close.inc' %]
-[% BLOCK cssinclude %][% END %]
+[% BLOCK cssinclude %]
+    .subscriptionline {
+        border-bottom: 1px solid #EEE;
+        padding: 1em 0;
+    }
+[% END %]
 </head>
 [% INCLUDE 'bodytag.inc' bodyid='opac-serials-issues' %]
 [% INCLUDE 'masthead.inc' %]
@@ -37,7 +42,7 @@
                         </div>
                         <form method="post" name="f">
                             [% FOREACH subscription_LOO IN subscription_LOOP %]
-                                <div id="subscriptionline[% subscription_LOO.subscriptionid | html %]" style="border-bottom:1px solid #EEE;">
+                                <div id="subscriptionline[% subscription_LOO.subscriptionid | html %]" class="subscriptionline">
                                     <h3>Subscription information for [% subscription_LOO.bibliotitle | html %]</h3>
                                     <p>
                                         The current subscription began on [% subscription_LOO.startdate | html %] and is issued
-- 
2.11.0