From 20450829eb5132966dc1d8a37cfdceb696f91b65 Mon Sep 17 00:00:00 2001
From: Owen Leonard <oleonard@myacpl.org>
Date: Fri, 30 Oct 2020 12:33:54 +0000
Subject: [PATCH] Bug 26838: Improve styling of checkin message

This patch makes some changes to the style and use of the "problem"
class in the staff interface:

- Remove the background color
- Remove the extra line height

Some changes to the template:

 - Remove the problem class from the checkin message. The checkin
   message configuration determines whether the dialog is an alert or a
   message-style dialog.
 - Add Font Awesome icons to the "problem" messages in patron details
   and serials collection. This is to help emphasize the message for
   users  who might have difficulty seeing the color difference.

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

 - Go to Administration -> Item types and configure a checkin message
   for an item type: Add a message and select "Message" as the checkin
   message type.
 - Check in an item with that item type and confirm that you see the
   checkin message. It should be displayed in a message-style dialog
   without any additional styling.
 - Change the item type configuration to use "Alert" as the checkin
   message type. Confirm that the correct style is shown in this case as
   well.

 - Locate a patron with a NULL value in borrowers.password. View the
   detail page for that patron.
 - Under the "Library use" heading, the "Password" line should contain a
   link with the text "Undefined," preceded by a red-colored Font
   Awesome  icon.

 - In Serials, locate a subscription which is expired.
 - View the details for the subscription, and then open "serial
   collection" from the sidebar menu.
 - On the serial collection page there should be a cell in the
   subscription summary table showing the message "Subscription expired"
   preceded by a red-colored Font Awesome icon.

Signed-off-by: Salman Ali <salman.ali@inLibro.com>

Signed-off-by: Nick Clemens <nick@bywatersolutions.com>

Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
---
 .../prog/css/src/staff-global.scss            | 19 ++++++++-----------
 .../prog/en/modules/circ/returns.tt           |  2 +-
 .../prog/en/modules/members/moremember.tt     |  2 +-
 .../en/modules/serials/serials-collection.tt  |  2 +-
 4 files changed, 11 insertions(+), 14 deletions(-)

diff --git a/koha-tmpl/intranet-tmpl/prog/css/src/staff-global.scss b/koha-tmpl/intranet-tmpl/prog/css/src/staff-global.scss
index 6d9db96973..1d6077dc51 100644
--- a/koha-tmpl/intranet-tmpl/prog/css/src/staff-global.scss
+++ b/koha-tmpl/intranet-tmpl/prog/css/src/staff-global.scss
@@ -615,10 +615,8 @@ ol {
 }
 
 .problem {
-    background-color: #FFFFCC;
     color: #990000;
     font-weight: bold;
-    line-height: 1.7em;
 }
 
 fieldset {
@@ -1775,7 +1773,7 @@ i {
     h2,
     h3,
     h4 {
-        margin: auto;
+        margin: 5px auto;
         text-align: center;
     }
 
@@ -1798,6 +1796,13 @@ i {
         list-style-position: inside;
     }
 
+    p {
+        margin-top: 0;
+        &+p {
+            margin-top: 5px;
+        }
+    }
+
     table {
         margin: .5em auto;
 
@@ -2350,19 +2355,11 @@ td {
         &.alert {
             background: #FFFADE none;
             border-color: #E0C726;
-
-            .problem {
-                background-color: transparent;
-            }
         }
 
         &.message {
             background: #E8EDF6 none;
             border-color: #A4BEDD;
-
-            .problem {
-                background-color: transparent;
-            }
         }
     }
 
diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/circ/returns.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/circ/returns.tt
index e03a07d758..eec665f6b1 100644
--- a/koha-tmpl/intranet-tmpl/prog/en/modules/circ/returns.tt
+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/circ/returns.tt
@@ -344,7 +344,7 @@
                                 [% ELSE %]
                                     <div class="dialog message">
                                 [% END %]
-                                        <p class="problem ret_checkinmsg">[% checkinmsg | html_line_break %]</p>
+                                        <p class="ret_checkinmsg">[% checkinmsg | html_line_break %]</p>
                                     </div>
                             [% END # /IF checkinmsg %]
                         [% END # /BLOCK all_checkin_messages %]
diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/members/moremember.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/members/moremember.tt
index eaa0d18841..bd2aabb741 100644
--- a/koha-tmpl/intranet-tmpl/prog/en/modules/members/moremember.tt
+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/members/moremember.tt
@@ -560,7 +560,7 @@
                                             [% IF ( patron.password ) %]
                                                 *******
                                             [% ELSE %]
-                                                <span class="problem"><a href="/cgi-bin/koha/members/member-password.pl?member=[% patron.borrowernumber | uri %]">Undefined</a></span>
+                                                <i class="fa fa-exclamation-circle problem" aria-hidden="true"></i> <a href="/cgi-bin/koha/members/member-password.pl?member=[% patron.borrowernumber | uri %]">Undefined</a>
                                             [% END %]
                                         </li>
 
diff --git a/koha-tmpl/intranet-tmpl/prog/en/modules/serials/serials-collection.tt b/koha-tmpl/intranet-tmpl/prog/en/modules/serials/serials-collection.tt
index 7cd50d57ab..e84e59908c 100644
--- a/koha-tmpl/intranet-tmpl/prog/en/modules/serials/serials-collection.tt
+++ b/koha-tmpl/intranet-tmpl/prog/en/modules/serials/serials-collection.tt
@@ -101,7 +101,7 @@
         <td> [% subscription.notes | html | html_line_break %]
             [% UNLESS subscription.closed %]
                 [% IF ( subscription.subscriptionexpired ) %]
-                    <br /><span class="problem"> Subscription expired</span>
+                    <p class="problem"><i class="fa fa-exclamation-circle problem" aria-hidden="true"></i> Subscription expired</p>
                 [% END %]
             [% ELSE %]
                 <br /> Subscription closed
-- 
2.39.5