Bug 26838: Improve styling of checkin message
authorOwen Leonard <oleonard@myacpl.org>
Fri, 30 Oct 2020 12:33:54 +0000 (12:33 +0000)
committerJonathan Druart <jonathan.druart@bugs.koha-community.org>
Mon, 21 Jun 2021 12:01:50 +0000 (14:01 +0200)
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>
koha-tmpl/intranet-tmpl/prog/css/src/staff-global.scss
koha-tmpl/intranet-tmpl/prog/en/modules/circ/returns.tt
koha-tmpl/intranet-tmpl/prog/en/modules/members/moremember.tt
koha-tmpl/intranet-tmpl/prog/en/modules/serials/serials-collection.tt

index 6d9db96..1d6077d 100644 (file)
@@ -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;
-            }
         }
     }
 
index e03a07d..eec665f 100644 (file)
                                 [% 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 %]
index eaa0d18..bd2aabb 100644 (file)
                                             [% 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>
 
index 7cd50d5..e84e599 100644 (file)
         <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