From 2d71c81a1371c25071103636b9b93b43fbc63c7b Mon Sep 17 00:00:00 2001
From: Owen Leonard <oleonard@myacpl.org>
Date: Fri, 10 Aug 2018 16:09:56 +0000
Subject: [PATCH] Bug 15287: Use font-awesome on the OPAC

This patch replaces Bootstrap's glyphicons with Font Awesome icons.

To test, apply the patch and clear your browser cache and regenerate the
OPAC CSS from the LESS file if necessary. Check these icons and confirm
they look correct:

- Cart and Lists icons in the OPAC header
- User icon in the header when the browser window is narrow
- Languages menu when multiple languages are installed and
  the OpacLangSelectorMode system preference is "top" or "both top and
  footer."
- Set the  SuspendHoldsOpac system preference to "allow" and log in to
  the OPAC as a user who has one or more holds.
  - Check the appearance of the "suspend" and "resume" buttons both in
    the table of holds and at the bottom.
- With one or more clubs defined, log in to the OPAC and check the
  "Clubs" tab on the user summary page. The "Enroll" and "Cancel
  enrollment" buttons should look correct.
- On the "your messaging" tab in the OPAC, the "Digests only"
  information icon should look correct.

Signed-off-by: Katrin Fischer <katrin.fischer.83@web.de>

Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org>
---
 koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss            |  5 +++++
 .../opac-tmpl/bootstrap/en/includes/masthead-langmenu.inc  |  6 +++---
 koha-tmpl/opac-tmpl/bootstrap/en/includes/masthead.inc     |  6 +++---
 .../opac-tmpl/bootstrap/en/modules/clubs/clubs-tab.tt      |  6 +++---
 koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-messaging.tt |  2 +-
 koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-user.tt      | 14 +++++++-------
 6 files changed, 22 insertions(+), 17 deletions(-)

diff --git a/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss b/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss
index 1f13274..95b7b2f 100644
--- a/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss
+++ b/koha-tmpl/opac-tmpl/bootstrap/css/src/opac.scss
@@ -41,6 +41,11 @@ body {
     // margin: 0 auto -60px;
 }
 
+.fa.fa-icon-black,
+.fa.fa-icon-white {
+    color: #FFF;
+}
+
 #changelanguage {
     /* Set the fixed height of the footer here */
     // height: 60px;
diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/includes/masthead-langmenu.inc b/koha-tmpl/opac-tmpl/bootstrap/en/includes/masthead-langmenu.inc
index e0723be..1d31707 100644
--- a/koha-tmpl/opac-tmpl/bootstrap/en/includes/masthead-langmenu.inc
+++ b/koha-tmpl/opac-tmpl/bootstrap/en/includes/masthead-langmenu.inc
@@ -1,7 +1,7 @@
 [%# Following on one line for translatability %]
 [% IF ( ( opaclanguagesdisplay ) && ( ! one_language_enabled ) && ( languages_loop ) && ( OpacLangSelectorMode == 'both' || OpacLangSelectorMode == 'top') ) %]
 <li class="dropdown">
-  <a href="#" title="Switch languages" class="dropdown-toggle" id="langmenu" data-toggle="dropdown" role="button"><i class="icon-flag icon-white"></i> <span class="langlabel">Languages</span> <b class="caret"></b></a>
+  <a href="#" title="Switch languages" class="dropdown-toggle" id="langmenu" data-toggle="dropdown" role="button"><i class="fa fa-flag fa-icon-white"></i> <span class="langlabel">Languages</span> <b class="caret"></b></a>
     <ul aria-labelledby="langmenu" role="menu" class="dropdown-menu">
     [% FOREACH languages_loo IN languages_loop %]
         [% IF ( languages_loo.group_enabled ) %]
@@ -9,7 +9,7 @@
                 [% FOREACH sublanguages_loo IN languages_loo.sublanguages_loop %]
                     [% IF ( sublanguages_loo.enabled ) %]
                         [% IF ( sublanguages_loo.sublanguage_current ) %]
-                         <li role="presentation"> <a href="#" tabindex="-1" role="menuitem">[% sublanguages_loo.native_description | html %] [% sublanguages_loo.script_description | html %] [% sublanguages_loo.region_description | html %] [% sublanguages_loo.variant_description | html %]&nbsp;<i class="icon-ok"></i></a></li>
+                         <li role="presentation"> <a href="#" tabindex="-1" role="menuitem">[% sublanguages_loo.native_description | html %] [% sublanguages_loo.script_description | html %] [% sublanguages_loo.region_description | html %] [% sublanguages_loo.variant_description | html %]&nbsp;<i class="fa fa-check"></i></a></li>
                         [% ELSE %]
                         <li role="presentation"><a href="/cgi-bin/koha/opac-changelanguage.pl?language=[% sublanguages_loo.rfc4646_subtag | html %]"  tabindex="-1" role="menuitem"> [% sublanguages_loo.native_description | html %] [% sublanguages_loo.script_description | html %] [% sublanguages_loo.region_description | html %] [% sublanguages_loo.variant_description | html %]</a></li>
                         [% END %]
@@ -18,7 +18,7 @@
             [% ELSE %]
                 [% IF ( languages_loo.group_enabled ) %]
                     [% IF ( languages_loo.current ) %]
-                    <li role="presentation"><a href="#" tabindex="-1" class="menu-inactive" role="menuitem">[% IF ( languages_loo.native_description ) %][% languages_loo.native_description | html %][% ELSE %][% languages_loo.rfc4646_subtag | html %][% END %]&nbsp;<i class="icon-ok"></i></a></li>
+                    <li role="presentation"><a href="#" tabindex="-1" class="menu-inactive" role="menuitem">[% IF ( languages_loo.native_description ) %][% languages_loo.native_description | html %][% ELSE %][% languages_loo.rfc4646_subtag | html %][% END %]&nbsp;<i class="fa fa-check"></i></a></li>
                     [% ELSE %]
                     <li role="presentation"><a href="/cgi-bin/koha/opac-changelanguage.pl?language=[% languages_loo.rfc4646_subtag | html %]"  tabindex="-1" role="menuitem">[% IF ( languages_loo.native_description ) %][% languages_loo.native_description | html %][% ELSE %][% languages_loo.rfc4646_subtag | html %][% END %]</a></li>
                     [% END %]
diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/includes/masthead.inc b/koha-tmpl/opac-tmpl/bootstrap/en/includes/masthead.inc
index 9d543b8..37d7a1a 100644
--- a/koha-tmpl/opac-tmpl/bootstrap/en/includes/masthead.inc
+++ b/koha-tmpl/opac-tmpl/bootstrap/en/includes/masthead.inc
@@ -23,7 +23,7 @@
                         [% IF ( Koha.Preference( 'opacbookbag' ) == 1 ) %]
                             <li class="dropdown">
                                 <a href="#" title="Collect items you are interested in" class="dropdown-toggle" id="cartmenulink" data-toggle="dropdown" role="button">
-                                    <i id="carticon" class="icon-shopping-cart icon-white"></i> <span class="cartlabel">Cart</span> <span id="basketcount"></span> <b class="caret"></b>
+                                    <i id="carticon" class="fa fa-shopping-cart fa-icon-white"></i> <span class="cartlabel">Cart</span> <span id="basketcount"></span> <b class="caret"></b>
                                 </a>
                                 <ul aria-labelledby="cartmenulink" role="menu" class="dropdown-menu">
                                     <li role="presentation">
@@ -37,7 +37,7 @@
                         [% END %]
                         [% IF ( Koha.Preference( 'virtualshelves' ) == 1 ) %]
                             <li class="dropdown">
-                                <a href="#" title="Show lists" class="dropdown-toggle" id="listsmenu" data-toggle="dropdown" role="button"><i class="icon-list icon-white"></i> <span class="listslabel">Lists</span> <b class="caret"></b></a>
+                                <a href="#" title="Show lists" class="dropdown-toggle" id="listsmenu" data-toggle="dropdown" role="button"><i class="fa fa-list fa-icon-white"></i> <span class="listslabel">Lists</span> <b class="caret"></b></a>
                                 <ul aria-labelledby="listsmenu" role="menu" class="dropdown-menu">
                                 [% IF some_public_shelves.count %]
                                     <li role="presentation"><a href="/cgi-bin/koha/opac-shelves.pl?op=list&amp;category=2" tabindex="-1" role="menuitem"><strong>Public lists</strong></a></li>
@@ -86,7 +86,7 @@
                     </ul> <!-- / .nav -->
                     [% IF Koha.Preference( 'virtualshelves' ) == 1 %]<div id="listsDetails"></div>[% END %]
                     [% IF Koha.Preference( 'opacuserlogin' ) == 1 || opaclanguagesdisplay || EnableOpacSearchHistory %]
-                        <a id="user-menu-trigger" class="pull-right" href="#"><i class="icon-user"></i> <span class="caret"></span></a>
+                        <a id="user-menu-trigger" class="pull-right" href="#"><i class="fa fa-user fa-icon-white"></i> <span class="caret"></span></a>
                         <div id="members">
                             <ul class="nav pull-right">
 
diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/modules/clubs/clubs-tab.tt b/koha-tmpl/opac-tmpl/bootstrap/en/modules/clubs/clubs-tab.tt
index bf89be2..0b8e2bd 100644
--- a/koha-tmpl/opac-tmpl/bootstrap/en/modules/clubs/clubs-tab.tt
+++ b/koha-tmpl/opac-tmpl/bootstrap/en/modules/clubs/clubs-tab.tt
@@ -23,7 +23,7 @@
                     <td>
                         [% IF e.club.club_template.is_enrollable_from_opac %]
                             <button class="btn btn-xs btn-default" onclick="cancelEnrollment( [% e.id | html %] )">
-                                <i class="icon-remove"></i> Cancel enrollment
+                                <i class="fa fa-remove"></i> Cancel enrollment
                             </button>
                         [% ELSE %]
                             Contact your library to be disenrolled from this club.
@@ -55,8 +55,8 @@
                     <td>[% c.description | html %]</td>
                     <td>
                         [% IF !c.club_template.is_email_required || ( c.club_template.is_email_required && borrower.first_valid_email_address ) %]
-                            <button class="btn btn-xs btn-default" onclick="loadEnrollmentForm([% c.id | html %])">
-                                <i class="icon-plus"></i> Enroll
+                            <button class="btn btn-xs btn-default" onclick="loadEnrollmentForm([% c.id | html%])">
+                                <i class="fa fa-plus"></i> Enroll
                             </button>
                         [% ELSE %]
                             <span class="hint">You must have an email address to enroll</span>
diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-messaging.tt b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-messaging.tt
index e08754f..7a190c6 100644
--- a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-messaging.tt
+++ b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-messaging.tt
@@ -39,7 +39,7 @@
                                         [% IF ( SMSSendDriver ) %]<th>SMS</th>[% END %]
                                         [% IF ( TalkingTechItivaPhone ) %]<th>Phone</th>[% END %]
                                         <th>Email</th>
-                                        <th>Digests only <i id="info_digests" data-toggle="tooltip" title="You can ask for a digest to reduce the number of messages. Messages will be saved and sent as a single message." data-placement="right" class="icon icon-info-sign"></i></th>
+                                        <th>Digests only <i id="info_digests" data-toggle="tooltip" title="You can ask for a digest to reduce the number of messages. Messages will be saved and sent as a single message." data-placement="right" class="fa fa-info-circle"></i></th>
                                         <!-- <th>RSS</th> --><th>Do not notify</th>
                                     </tr>
                                 </thead>
diff --git a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-user.tt b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-user.tt
index 2ea2295..728ddaf 100644
--- a/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-user.tt
+++ b/koha-tmpl/opac-tmpl/bootstrap/en/modules/opac-user.tt
@@ -704,11 +704,11 @@
                                                         [% IF RESERVE.suspend %]
                                                             <form class="form-inline" action="/cgi-bin/koha/opac-modrequest-suspend.pl" method="post">
                                                                 <input type="hidden" name="reserve_id" value="[% RESERVE.reserve_id | html %]" />
-                                                                <button class="btn btn-link" type="submit" name="submit"><i class="icon-play"></i> Resume</button>
+                                                                <button class="btn btn-link" type="submit" name="submit"><i class="fa fa-play"></i> Resume</button>
                                                             </form>
                                                         [% ELSE %]
                                                             [% IF AutoResumeSuspendedHolds %]
-                                                                <a class="btn btn-link js-show" href="#suspendModal[% RESERVE.reserve_id | html %]" role="button" data-toggle="modal"><i class="icon-pause"></i> Suspend</a>
+                                                                <a class="btn btn-link js-show" href="#suspendModal[% RESERVE.reserve_id | html %]" role="button" data-toggle="modal"><i class="fa fa-pause"></i> Suspend</a>
                                                                 [% # hold suspend modal form %]
                                                                 <div id="suspendModal[% RESERVE.reserve_id | html %]" class="modal-nojs" tabindex="-1" role="dialog" aria-labelledby="suspendModal[% RESERVE.reserve_id | html %]Label" aria-hidden="true">
                                                                     <form class="form-inline" action="/cgi-bin/koha/opac-modrequest-suspend.pl" method="post">
@@ -737,7 +737,7 @@
                                                             [% ELSE %]
                                                                 <form class="form-inline" action="/cgi-bin/koha/opac-modrequest-suspend.pl" method="post">
                                                                     <input type="hidden" name="reserve_id" value="[% RESERVE.reserve_id | html %]" />
-                                                                    <button class="btn btn-link" type="submit" name="submit"><i class="icon-pause"></i> Suspend</button>
+                                                                    <button class="btn btn-link" type="submit" name="submit"><i class="fa fa-pause"></i> Suspend</button>
                                                                 </form>
                                                             [% END # / IF AutoResumeSuspendedHolds %]
                                                         [% END # / IF RESERVE.suspend %]
@@ -749,7 +749,7 @@
                                                     <form action="/cgi-bin/koha/opac-modrequest.pl" method="post">
                                                     <input type="hidden" name="biblionumber" value="[% RESERVE.biblionumber | html %]" />
                                                     <input type="hidden" name="reserve_id" value="[% RESERVE.reserve_id | html %]" />
-                                                    <button type="submit" name="submit" class="btn btn-mini btn-danger" onclick="return confirmDelete(MSG_CONFIRM_DELETE_HOLD);"><i class="icon-remove icon-white"></i> Cancel</button></form>
+                                                    <button type="submit" name="submit" class="btn btn-xs btn-danger" onclick="return confirmDelete(MSG_CONFIRM_DELETE_HOLD);"><i class="fa fa-remove"></i> Cancel</button></form>
                                                 [% END %]
                                             </td>
                                         </tr>
@@ -760,7 +760,7 @@
                             [% IF SuspendHoldsOpac %]
                                 <div>
                                     <form class="form-inline" action="/cgi-bin/koha/opac-modrequest-suspend.pl" method="post">
-                                        <button type="submit" name="submit" class="btn" onclick="return confirmDelete(MSG_CONFIRM_SUSPEND_HOLDS);"><i class="icon-pause"></i> Suspend all holds</button>
+                                        <button type="submit" name="submit" class="btn" onclick="return confirmDelete(MSG_CONFIRM_SUSPEND_HOLDS);"><i class="fa fa-pause"></i> Suspend all holds</button>
                                         <input type="hidden" name="suspend" value="1" />
 
                                         [% IF AutoResumeSuspendedHolds %]
@@ -773,7 +773,7 @@
                                 <br/>
                                 <div>
                                     <form action="/cgi-bin/koha/opac-modrequest-suspend.pl" method="post">
-                                        <button type="submit" name="submit" class="btn" onclick="return confirmDelete(MSG_CONFIRM_RESUME_HOLDS);"><i class="icon-play"></i> Resume all suspended holds</button>
+                                        <button type="submit" name="submit" class="btn" onclick="return confirmDelete(MSG_CONFIRM_RESUME_HOLDS);"><i class="fa fa-play"></i> Resume all suspended holds</button>
                                         <input type="hidden" name="suspend" value="0" />
                                     </form>
                                 </div>
@@ -869,7 +869,7 @@
 
                                                 <td class="article-request-cancel">
                                                     <span class="tdlabel">Cancel:</span>
-                                                    <a class="btn btn-mini btn-danger" href="opac-article-request-cancel.pl?id=[% ar.id | html %]" onclick="return confirmDelete(MSG_CONFIRM_DELETE_ARTREQ);"><i class="icon-remove icon-white"></i> Cancel</a>
+                                                    <a class="btn btn-xs btn-danger" href="opac-article-request-cancel.pl?id=[% ar.id | html %]" onclick="return confirmDelete(MSG_CONFIRM_DELETE_ARTREQ);"><i class="fa fa-remove"></i> Cancel</a>
                                                 </td>
                                             </tr>
                                         [% END %]
-- 
2.1.4