Bug 7500 [FOLLOW-UP][Missing images] Use CSS Sprites for faster page loading

- Adds shelf browser navigational arrows to the main sprite.
- Removes "caret.gif" (a sort of breadcrumbs separator in the OPAC) and replaces
  it with a similar Unicode arrow entity.
- Replaces item-bullet.gif (a custom list bullet used in the Cart) with data URI
  encoding the image in the CSS

Signed-off-by: Chris Cormack <chrisc@catalyst.net.nz>

diff --git a/koha-tmpl/opac-tmpl/prog/en/css/opac.css b/koha-tmpl/opac-tmpl/prog/en/css/opac.css
index 6a1d5e4..53b93ae 100644 (file)
--- a/koha-tmpl/opac-tmpl/prog/en/css/opac.css
+++ b/koha-tmpl/opac-tmpl/prog/en/css/opac.css
@@ -2012,7 +2012,6 @@ a#MARCview, a#MARCviewPop, a#ISBDview, a#Normalview, a#Fullhistory, a#Briefhisto
        text-decoration : none;
 }
 #shelfbrowser td, #shelfbrowser th {
-       vertical-align : bottom;
        width : 20%;
 }
 #shelfbrowser td.top {
@@ -2024,6 +2023,30 @@ a#MARCview, a#MARCviewPop, a#ISBDview, a#Normalview, a#Fullhistory, a#Briefhisto
 #shelfbrowser a {
        display : block;
 }
+#shelfbrowser #browser_next,
+#shelfbrowser #browser_previous {
+    background-image : url("../../images/sprite.png");
+    background-position : -5px -988px;
+    background-repeat: no-repeat;
+    width : 16px;
+}
+#shelfbrowser #browser_next a,
+#shelfbrowser #browser_previous a {
+    cursor: pointer;
+    display : block;
+    height: 0 !important;
+    margin: 0;
+    overflow: hidden;
+    padding: 50px 0 0;
+    text-decoration: none;
+    width: 16px;
+}
+#shelfbrowser #browser_previous {
+background-position: -9px -1001px;
+}
+#shelfbrowser #browser_next {
+background-position: -9px -1051px;
+}
 
 #comments .commentline {
        border-bottom : 2px solid #eeeeeb;
@@ -2133,7 +2156,7 @@ div.ft {
 }
 #basket td ul li {
        font-size:90%;
-       list-style:disc outside url("../../images/item-bullet.gif");
+    list-style:disc outside url(data:image/gif;base64,R0lGODlhBQAHAJECAP///5zD6v///wAAACH5BAEAAAIALAAAAAAFAAcAAAIMjCUGkbvhFGQSmVAAADs=);
        padding:0.2em 0;
 }
 

diff --git a/koha-tmpl/opac-tmpl/prog/en/modules/opac-account.tt b/koha-tmpl/opac-tmpl/prog/en/modules/opac-account.tt
index 581b948..eb9ee87 100644 (file)
--- a/koha-tmpl/opac-tmpl/prog/en/modules/opac-account.tt
+++ b/koha-tmpl/opac-tmpl/prog/en/modules/opac-account.tt
@@ -13,7 +13,7 @@
                <div id="useraccount" class="container">
 <!--CONTENT-->
     [% FOREACH BORROWER_INF IN BORROWER_INFO %]
-        <h3><a href="/cgi-bin/koha/opac-user.pl">[% BORROWER_INF.firstname %] [% BORROWER_INF.surname %]'s account</a> <img src="[% themelang %]../../images/caret.gif" width="16" height="16" alt="&gt;" border="0" /> Fines and charges</h3>
+        <h3><a href="/cgi-bin/koha/opac-user.pl">[% BORROWER_INF.firstname %] [% BORROWER_INF.surname %]'s account</a> &#8674; Fines and charges</h3>
     [% END %]
 
     [% IF ( ACCOUNT_LINES ) %]

diff --git a/koha-tmpl/opac-tmpl/prog/en/modules/opac-detail.tt b/koha-tmpl/opac-tmpl/prog/en/modules/opac-detail.tt
index 99a21b3..5c9447f 100644 (file)
--- a/koha-tmpl/opac-tmpl/prog/en/modules/opac-detail.tt
+++ b/koha-tmpl/opac-tmpl/prog/en/modules/opac-detail.tt
@@ -811,7 +811,7 @@ YAHOO.util.Event.onContentReady("furtherm", function () {
 
         
         <table><tr>
-        <td rowspan="2" style="width:20px;"><a style="height: 10em;" href="/cgi-bin/koha/opac-detail.pl?biblionumber=[% IF ( shelfbrowser_prev_biblionumber ) %][% shelfbrowser_prev_biblionumber %][% ELSE %][% biblionumber %][% END %]&amp;shelfbrowse_itemnumber=[% shelfbrowser_prev_itemnumber %]#shelfbrowser"><img src="/opac-tmpl/prog/images/browse-prev.gif" alt="Previous" border="0" /></a></td>
+        <td rowspan="2" style="width:20px;"><div id="browser_previous"><a href="/cgi-bin/koha/opac-detail.pl?biblionumber=[% IF ( shelfbrowser_prev_biblionumber ) %][% shelfbrowser_prev_biblionumber %][% ELSE %][% biblionumber %][% END %]&amp;shelfbrowse_itemnumber=[% shelfbrowser_prev_itemnumber %]#shelfbrowser">Previous</a></div></td>
 [% FOREACH PREVIOUS_SHELF_BROWS IN PREVIOUS_SHELF_BROWSE %]
         <td><a href="/cgi-bin/koha/opac-detail.pl?biblionumber=[% PREVIOUS_SHELF_BROWS.biblionumber %]&amp;shelfbrowse_itemnumber=[% PREVIOUS_SHELF_BROWS.itemnumber %]#shelfbrowser">
     [% IF ( OPACAmazonCoverImages ) %][% IF ( PREVIOUS_SHELF_BROWS.browser_normalized_isbn ) %]<img border="0" src="http://images.amazon.com/images/P/[% PREVIOUS_SHELF_BROWS.browser_normalized_isbn %].01._AA75_PU_PU-5_.jpg" alt="" />[% ELSE %]<span class="no-image">No cover image available</span>[% END %][% END %]
@@ -845,7 +845,7 @@ YAHOO.util.Event.onContentReady("furtherm", function () {
 
 </a></td>
 [% END %]
-<td rowspan="2" style="width:20px;"><a style="height: 10em;" href="/cgi-bin/koha/opac-detail.pl?biblionumber=[% IF ( shelfbrowser_next_biblionumber ) %][% shelfbrowser_next_biblionumber %][% ELSE %][% biblionumber %][% END %]&amp;shelfbrowse_itemnumber=[% shelfbrowser_next_itemnumber %]#shelfbrowser"><img src="/opac-tmpl/prog/images/browse-next.gif" alt="Next" border="0" /></a></td>
+<td rowspan="2"><div id="browser_next"><a href="/cgi-bin/koha/opac-detail.pl?biblionumber=[% IF ( shelfbrowser_next_biblionumber ) %][% shelfbrowser_next_biblionumber %][% ELSE %][% biblionumber %][% END %]&amp;shelfbrowse_itemnumber=[% shelfbrowser_next_itemnumber %]#shelfbrowser">Next</a></div></td>
 </tr>
 
 <tr>
@@ -854,7 +854,7 @@ YAHOO.util.Event.onContentReady("furtherm", function () {
 [% END %]
 
 [% FOREACH NEXT_SHELF_BROWS IN NEXT_SHELF_BROWSE %]
-       <td class="top">[% NEXT_SHELF_BROWS.itemcallnumber %]<a href="/cgi-bin/koha/opac-detail.pl?biblionumber=[% NEXT_SHELF_BROWS.biblionumber %]&amp;shelfbrowse_itemnumber=[% NEXT_SHELF_BROWS.itemnumber %]#shelfbrowser">[% NEXT_SHELF_BROWS.title |html %]</a></td>
+       <td class="top" style="width:20px;">[% NEXT_SHELF_BROWS.itemcallnumber %]<a href="/cgi-bin/koha/opac-detail.pl?biblionumber=[% NEXT_SHELF_BROWS.biblionumber %]&amp;shelfbrowse_itemnumber=[% NEXT_SHELF_BROWS.itemnumber %]#shelfbrowser">[% NEXT_SHELF_BROWS.title |html %]</a></td>
 [% END %]
 </tr>
 </table>

diff --git a/koha-tmpl/opac-tmpl/prog/en/modules/opac-messaging.tt b/koha-tmpl/opac-tmpl/prog/en/modules/opac-messaging.tt
index 8cfd5eb..8f8e6b4 100644 (file)
--- a/koha-tmpl/opac-tmpl/prog/en/modules/opac-messaging.tt
+++ b/koha-tmpl/opac-tmpl/prog/en/modules/opac-messaging.tt
@@ -25,7 +25,7 @@
        <div class="yui-b"><div class="yui-g" id="usermessaging">
 
 [% FOREACH BORROWER_INF IN BORROWER_INFO %]
-<h3><a href="/cgi-bin/koha/opac-user.pl">[% BORROWER_INF.firstname %] [% BORROWER_INF.surname %]'s account</a> <img src="[% themelang %]../../images/caret.gif" width="16" height="16" alt="&gt;" border="0" /> Your messaging settings</h3>
+<h3><a href="/cgi-bin/koha/opac-user.pl">[% BORROWER_INF.firstname %] [% BORROWER_INF.surname %]'s account</a> &#8674; Your messaging settings</h3>
 [% END %]
 
 <form action="/cgi-bin/koha/opac-messaging.pl" method="get" name="opacmessaging">

diff --git a/koha-tmpl/opac-tmpl/prog/en/modules/opac-passwd.tt b/koha-tmpl/opac-tmpl/prog/en/modules/opac-passwd.tt
index 3be0ef8..907835f 100644 (file)
--- a/koha-tmpl/opac-tmpl/prog/en/modules/opac-passwd.tt
+++ b/koha-tmpl/opac-tmpl/prog/en/modules/opac-passwd.tt
@@ -9,7 +9,7 @@
        <div id="yui-main">
        <div class="yui-b"><div class="yui-g">
        <div id="userpasswd" class="container">
-    <h3><a href="/cgi-bin/koha/opac-user.pl">[% firstname %] [% surname %]'s account</a> <img src="[% themelang %]l../../images/caret.gif" width="16" height="16" alt="&gt;" border="0" /> Change your password </h3>
+    <h3><a href="/cgi-bin/koha/opac-user.pl">[% firstname %] [% surname %]'s account</a> &#8674; Change your password </h3>
 
     [% IF ( Error_messages ) %]
 <div class="dialog error">        <h3>There was a problem with your submission</h3>

diff --git a/koha-tmpl/opac-tmpl/prog/en/modules/opac-privacy.tt b/koha-tmpl/opac-tmpl/prog/en/modules/opac-privacy.tt
index adbc8f0..6440351 100644 (file)
--- a/koha-tmpl/opac-tmpl/prog/en/modules/opac-privacy.tt
+++ b/koha-tmpl/opac-tmpl/prog/en/modules/opac-privacy.tt
@@ -9,7 +9,7 @@
        <div id="yui-main">
        <div class="yui-b"><div class="yui-g">
        <div id="userprivacy" class="container">
-       <h3><a href="/cgi-bin/koha/opac-user.pl">[% firstname %] [% surname %]'s account</a> <img src="[% themelang %]l../../images/caret.gif" width="16" height="16" alt="&gt;" border="0" /> Privacy policy </h3>
+    <h3><a href="/cgi-bin/koha/opac-user.pl">[% firstname %] [% surname %]'s account</a> &#8674; Privacy policy </h3>
 
     [% IF ( deleted ) %]
         <div class="dialog message">Your reading history has been deleted.</div>

diff --git a/koha-tmpl/opac-tmpl/prog/en/modules/opac-readingrecord.tt b/koha-tmpl/opac-tmpl/prog/en/modules/opac-readingrecord.tt
index 57d1a9e..c1047ae 100644 (file)
--- a/koha-tmpl/opac-tmpl/prog/en/modules/opac-readingrecord.tt
+++ b/koha-tmpl/opac-tmpl/prog/en/modules/opac-readingrecord.tt
@@ -24,7 +24,7 @@ $(document).ready(function(){
        <div class="yui-b"><div class="yui-g">
 <div id="userreadingrecord" class="container">
 <!--CONTENT-->
-<h3><a href="/cgi-bin/koha/opac-user.pl">[% firstname %] [% surname %]'s account</a> <img src="[% themelang %]../../images/caret.gif" width="16" height="16" alt="&gt;" border="0" /> Checkout history</h3>
+<h3><a href="/cgi-bin/koha/opac-user.pl">[% firstname %] [% surname %]'s account</a> &#8674; Checkout history</h3>
 
 [% UNLESS ( count ) %]
 You have never borrowed anything from this library.

diff --git a/koha-tmpl/opac-tmpl/prog/en/modules/opac-shelves.tt b/koha-tmpl/opac-tmpl/prog/en/modules/opac-shelves.tt
index 52f8717..9e782fb 100644 (file)
--- a/koha-tmpl/opac-tmpl/prog/en/modules/opac-shelves.tt
+++ b/koha-tmpl/opac-tmpl/prog/en/modules/opac-shelves.tt
@@ -257,7 +257,7 @@ $(function() {
             <div class="yui-g">
 
             [% IF ( viewshelf ) %]<!--  Viewing a particular shelf -->
-              <h3><a href="/cgi-bin/koha/opac-shelves.pl">Lists</a> <img src="[% themelang %]/../images/caret.gif" width="16" height="16" alt="&gt;" border="0" /> <em>[% shelfname |html %]</em></h3>
+              <h3><a href="/cgi-bin/koha/opac-shelves.pl">Lists</a> &#8674; <em>[% shelfname |html %]</em></h3>
               [% IF ( itemsloop ) %]
                   <div id="toolbar" class="list-actions">
 

diff --git a/koha-tmpl/opac-tmpl/prog/en/modules/opac-userdetails.tt b/koha-tmpl/opac-tmpl/prog/en/modules/opac-userdetails.tt
index 0befa83..e695a7a 100644 (file)
--- a/koha-tmpl/opac-tmpl/prog/en/modules/opac-userdetails.tt
+++ b/koha-tmpl/opac-tmpl/prog/en/modules/opac-userdetails.tt
@@ -9,7 +9,7 @@
        <div id="yui-main">
        <div class="yui-b"><div class="yui-g">
 
-<h3><a href="/cgi-bin/koha/opac-user.pl">[% firstname %] [% surname %]'s account</a> <img src="[% themelang %]../../images/caret.gif" width="16" height="16" alt="&gt;" border="0" /> Personal details</h3>
+<h3><a href="/cgi-bin/koha/opac-user.pl">[% firstname %] [% surname %]'s account</a> &#8674; Personal details</h3>
 
 <table>
 <tr><th scope="row">Name:</th><td> [% firstname %] [% surname %]</td></tr>

diff --git a/koha-tmpl/opac-tmpl/prog/en/modules/opac-userupdate.tt b/koha-tmpl/opac-tmpl/prog/en/modules/opac-userupdate.tt
index 82cfaa2..320b30b 100644 (file)
--- a/koha-tmpl/opac-tmpl/prog/en/modules/opac-userupdate.tt
+++ b/koha-tmpl/opac-tmpl/prog/en/modules/opac-userupdate.tt
@@ -13,7 +13,7 @@
 
 <div id="userupdatecontainer" class="container">
 [% FOREACH BORROWER_INF IN BORROWER_INFO %]
-<h3><a href="/cgi-bin/koha/opac-user.pl">[% INCLUDE 'patron-title.inc' firstname = BORROWER_INF.firstname surname = BORROWER_INF.surname othernames = BORROWER_INF.othernames cardnumber = BORROWER_INF.cardnumber %]'s account</a> <img src="[% themelang %]../../images/caret.gif" width="16" height="16" alt="&gt;" border="0" /> Your personal details</h3>
+<h3><a href="/cgi-bin/koha/opac-user.pl">[% INCLUDE 'patron-title.inc' firstname = BORROWER_INF.firstname surname = BORROWER_INF.surname othernames = BORROWER_INF.othernames cardnumber = BORROWER_INF.cardnumber %]'s account</a> &#8674; Your personal details</h3>
 
 [% IF ( OPACPatronDetails ) %]
 <form action="/cgi-bin/koha/opac-userupdate.pl" method="get">

diff --git a/koha-tmpl/opac-tmpl/prog/images/browse-next.gif b/koha-tmpl/opac-tmpl/prog/images/browse-next.gif
deleted file mode 100644 (file)
index 7fcd3f0..0000000
Binary files a/koha-tmpl/opac-tmpl/prog/images/browse-next.gif and /dev/null differ

diff --git a/koha-tmpl/opac-tmpl/prog/images/browse-prev.gif b/koha-tmpl/opac-tmpl/prog/images/browse-prev.gif
deleted file mode 100644 (file)
index feca93e..0000000
Binary files a/koha-tmpl/opac-tmpl/prog/images/browse-prev.gif and /dev/null differ

diff --git a/koha-tmpl/opac-tmpl/prog/images/caret.gif b/koha-tmpl/opac-tmpl/prog/images/caret.gif
deleted file mode 100644 (file)
index 8c3bf7b..0000000
Binary files a/koha-tmpl/opac-tmpl/prog/images/caret.gif and /dev/null differ

diff --git a/koha-tmpl/opac-tmpl/prog/images/item-bullet.gif b/koha-tmpl/opac-tmpl/prog/images/item-bullet.gif
deleted file mode 100644 (file)
index eae920d..0000000
Binary files a/koha-tmpl/opac-tmpl/prog/images/item-bullet.gif and /dev/null differ

diff --git a/koha-tmpl/opac-tmpl/prog/images/sprite.png b/koha-tmpl/opac-tmpl/prog/images/sprite.png
index 797c0f5..734328b 100644 (file)
Binary files a/koha-tmpl/opac-tmpl/prog/images/sprite.png and b/koha-tmpl/opac-tmpl/prog/images/sprite.png differ