[Koha-patches] [PATCH] Bug 7500 [FOLLOW-UP] Use CSS Sprites for faster page loading
Owen Leonard
oleonard at myacpl.org
Tue May 15 20:37:03 CEST 2012
This patch adds a new sprite image for social network links.
The page markup has been modified to accommodate the image-
replacement technique used to display the images.
When testing be sure to clear your cache to load the new CSS.
---
koha-tmpl/opac-tmpl/prog/en/css/opac.css | 42 ++++++++++++++++++++
koha-tmpl/opac-tmpl/prog/en/modules/opac-detail.tt | 14 +++----
koha-tmpl/opac-tmpl/prog/images/social-sprite.png | Bin 0 -> 2802 bytes
3 files changed, 49 insertions(+), 7 deletions(-)
create mode 100644 koha-tmpl/opac-tmpl/prog/images/social-sprite.png
diff --git a/koha-tmpl/opac-tmpl/prog/en/css/opac.css b/koha-tmpl/opac-tmpl/prog/en/css/opac.css
index 0cc7f2d..f0690d8 100644
--- a/koha-tmpl/opac-tmpl/prog/en/css/opac.css
+++ b/koha-tmpl/opac-tmpl/prog/en/css/opac.css
@@ -2405,6 +2405,48 @@ span.sep {
text-shadow: 1px 1px 0 #FFF;
}
+#social_networks span {
+ color: #274D7F;
+ display : block;
+ float : left;
+ font-size: 85%;
+ font-weight: bold;
+ line-height: 2em;
+ margin : .5em 0 .5em .5em !important;
+}
+#social_networks a {
+ background: transparent url("../../images/social-sprite.png") no-repeat;
+ display: block;
+ height : 20px !important;
+ width : 20px;
+ text-indent : -999em;
+}
+
+#social_networks div {
+ float : left !important;
+ margin : .5em 0 .5em .2em !important;
+}
+
+#social_networks #facebook {
+ background-position : -7px -35px;
+}
+
+#social_networks #twitter {
+ background-position : -7px -5px;
+}
+
+#social_networks #linkedin {
+ background-position : -7px -95px;
+}
+
+#social_networks #delicious {
+ background-position : -7px -66px;
+}
+
+#social_networks #email {
+ background-position : -7px -126px;
+}
+
/* ## BABELTHEQUE ## */
/* Uncomment if babeltheque configuration no contains these 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 cc59fb2..2ab8f80 100644
--- a/koha-tmpl/opac-tmpl/prog/en/modules/opac-detail.tt
+++ b/koha-tmpl/opac-tmpl/prog/en/modules/opac-detail.tt
@@ -1206,14 +1206,14 @@ YAHOO.util.Event.onContentReady("furtherm", function () {
[% END %]
[% IF ( SocialNetworks ) %]
- <div class="social_networks">
+ <div id="social_networks">
<span>Share</span>
- <a href="http://www.facebook.com/sharer.php?u=[% current_url |url %]&t=[% title |url %]" title="Share on Facebook"><img alt="Share on Facebook" src="/opac-tmpl/prog/images/socnet/facebook16.png" /></a>
- <a href="http://twitter.com/share" title="Share on Twitter"><img alt="Share on Twitter" src="/opac-tmpl/prog/images/socnet/twitter16.png" /></a>
- <a href="http://www.linkedin.com/shareArticle?mini=true&url=[% current_url |url %]&title=[% title |url %]" title="Share on LinkedIn"><img alt="Share on LinkedIn" src="/opac-tmpl/prog/images/socnet/linkedin16.png" /></a>
- <a href="http://www.delicious.com/save?url=[% current_url |url %]&title=[% title |url %]" title="Share on Delicious"><img alt="Share on Delicious" src="/opac-tmpl/prog/images/socnet/delicious16.gif" /></a>
- <g:plusone size="small"></g:plusone>
- <a href="mailto:ADRESSE?subject=TO READ : [% title %]>&body=[% title %]> [% current_url |url %]" title="Share by email"><img alt="Share by email" src="/opac-tmpl/prog/images/socnet/mailto16.png" /></a>
+ <div><a id="facebook" href="http://www.facebook.com/sharer.php?u=[% current_url |url %]&t=[% title |url %]" title="Share on Facebook">Facebook</a></div>
+ <div><a id="twitter" href="http://twitter.com/share" title="Share on Twitter">Twitter</a></div>
+ <div><a id="linkedin" href="http://www.linkedin.com/shareArticle?mini=true&url=[% current_url |url %]&title=[% title |url %]" title="Share on LinkedIn">LinkedIn</a></div>
+ <div><a id="delicious" href="http://www.delicious.com/save?url=[% current_url |url %]&title=[% title |url %]" title="Share on Delicious">Delicious</a></div>
+ <div><a id="email" href="mailto:ADRESSE?subject=TO READ : [% title %]>&body=[% title %]> [% current_url |url %]" title="Share by email">Email</a></div>
+ <div><g:plusone size="small"></g:plusone></div>
</div>
[% END %]
diff --git a/koha-tmpl/opac-tmpl/prog/images/social-sprite.png b/koha-tmpl/opac-tmpl/prog/images/social-sprite.png
new file mode 100644
index 0000000000000000000000000000000000000000..63d6b74b31cd5d37dfced08b0e918e65c48a5402
GIT binary patch
literal 2802
zcmd^BX;c$g8Z8nU5k-T>1+f`KK^CzU8wZ?5mL_dj#UvmqA|RkP3W^Nk$Ou6Yh$tok
zii(mzSOX#m2w at WlghdE~4aTs9orFLL5fYYUD#3G{K683ze$2nAbLv&ScfR`GefPWf
zI~C{bbWBxchYA1ys<ucQ6!_c&-pR^PaKy5h-QYv<f|a8c0KB6A`8(VsI9CrwxCNsF
z{eo|J1^EJ2K7ro8TDDibF8HE+y?kz7YxeyK0HA=g0|s%uv|`^r(bY~#Q49BJcW+Ee
zZTINX{nWa)FXGR0qUh*oCX at NNWVpJzx`jDW%;D9s7R{myo;T9pG|@FQG~Djz*+(@%
zAds=Ku`}seN5V*Xb&Z>x|0WWN-ZisIK78sK9GVxeMD|MTqsWgkTI#3xlV60{#SNzD
z$CqE1a2KVKwB}F4Q-UvxX4ey`9~Z<+D_MPmZQabjrgVyzrDRGap^APpr;a%^eEwF^
zh5XludI at WiH_Dwm9hCFDsGQ1}+T<AObb(Yp&RJewL59_5)23QmTilY$^79KCI8$aW
zPmagcy9SU`%DRc4SY6yH|MYi6GWkqwS?|P(S6Ci{F%a<L?Wd915Ngfo7Rlwjf)Rnh
zA-=F>ipSzec=KX5n;n<K6bgk8SrYT$>U{Rd at Fed?=cJ&!Z$i^6)zs8d^V%+k6>Qib
zVf7DpejLTWsEnly8B-;`d9RF&jNId!%gV|${RnBK4Bni`JE3i}3zj=Ax{a at J!58=T
zarOtNYPd%~BGMA`spz{jb8MCmG2JsWmoq(AI5g^#QXyDaeom&=*ViM?J-<XG>$pcI
zkc&g&O5fGBC$x2Nx!i_nsZhLBIXUGVPw$%)-+J&?_k1jsBhfq={*su%==uzIi|&}2
zCDu$%f02w$iwCA8yZw{*+YyT1&#IrqKFw}y<4YfAm3Fc at A3m})HOFc{4wh86Z*j+&
z#k>XpX<uI-pU*#?{FcFB at cB|Uo0U$^Wb;<WXC<6D$sk8OJS85Pk-YC8 at QrxXJ}4?4
zop1<xMekrIRr0&KI*!ml;Vhi6iVuM4T&?4gm-(ZPeE#G_YAo()J+YiGJXjVCa=
z;!`tYNEsOgjcH}9`-Q_op){<vfkN-0b};UzH62DjJCpX#{Nxh{LTMtYCXFpYqvtg=
zmQTgfgK_1d_sX78KKLcHolB``8y at jaubmJ{19O at JDXre2d0f%L?BWuCQPMxL at LT_&
za9Ju{S(M7JU#SaW0H6Q_qnyyIEC076fL>Um0{}{wZEdVDp-gYlaYaB`OUWCqpa?sG
z10b<_2tdImQ9A<Awo|hN)X2(O5wR#mm?aW-yJ5B-%emnL21Gggz?z6EYj%39MS>qG
z6ZQITW)@#(d21;^a*sWfC9}pOn6m{m3ybg>J9{pNGZY at 10p@xL7i;XeUDG0rIn>_D
zU=*%91 at 5v--`mSeTmUx-<ekn3wr&lV?~#FAYQ&i6`1^AYIas&_uwcK)a3~{G7D`Ia
zKcOU{P-C=<13kaE%F$`>-hKW_dzfTlW~Q4?U!u!k*{VVB_*vQ=?7Eld58b|9n~aws
zBWOE18WLZgpwVb2)~<iLULH!ExbeotHg0*Lq$}(C?S1;4HnOyI+>wX~D<qOm$w-GH
zWJuv><4Yk11V!wF2b&CiVxZtbJI^hx<y}3%{_V#-GHMbrgw{Lr)>aR*6oXI-%37pN
z-~Tg at Hu?~7?LX4}`!HqO6XWUbrrBLqGE~ZlB7aOT+cMhxds{iC(Vma*bD&tWz`e&`
z)K{plE?%KWMK*JSf+&IAtH&k<!p6g>{F#9oKYO$sY6iV$!}>4{NvhBLlAl*IuUks3
z1+p*Re}oSIfdHz&8YL87vVfVIY+vpwS()E1FPEV}2`f>099}X0yb`|!q!g#Es>PqK
zk-SpR)|5qf>3v}6iJGcWtEA}*+JQU8-$~t0`lY>H3yL683%*G)L{%CT#@mO7ZU$HE
zl1yeWmV<bnMfouUGqhYns2uOp$_md$1GXKtNN~>u6k&Eb5Pg)vHbox7$OY7Dw#^!t
z<?osLL;e0yn6<%yv^1O=#G|E-EK at SlyUF4}Z)%z9`or1;xUAyW?9=pz?%My0LFzEU
z8_{z04)rT2jeCq at -!<~C>dQF8JXKZFMyu3Cc(UP9wxB37kTyFZPUo0V$h5LdBsqGw
zP7Z~@EM<!RhHNWhdb`|%k3b~$u+aHgh}EBdu$I@@ac;y~0ZHBnBGNe$$73Nqsfya2
zGEmLizFPEKqJQh;Z(%`abgt%U!7uYX5-2inqOjr~OH+|xZFxQfbiC2h^v1uKbId~`
zu}zyt=1pZ}sM8u7Z}UH^uT$ul`YNl^!}`VHW2h^hTD_607B}$-z$oS73Aid&sMxqj
zE+foql6GsUhsTAg*38B&Te$KH6G)jx_u8a!0`({h(cX%S>*TSnZ;-m&mjc~qJ37Nj
z#`ko0$t<%6k>`I^_5w#d at I)As_LCl%$enu%AK&Jlqib%SqFbe_4wtc;OIK60gy+ik
z{nffXA8!?bpsVfxXL>>9X4j7HbodF!as{oKSlSY4r{@;IluiB at KK-UXYdwLz@$GYG
z&$_zKSCqI=Oibacw(L8|Fu?-bwmp8q^pu;>*@x14=+-6Vvf%GA3x=Bea8IIFSyZPC
zrSw5DL6)=5ojC^bmgp?(kGQg>!- at vAcTDc9%1j`EWrN{7G@=U2b-p(~cq%#A(Gpl~
zROLIOcAgIz7Js?d^j_6brXfS`>!w>tH9m1iKOgkN$lG{g?nG^Am{<V*%E8j`rC(d2
zO;Ucq at s9O~1KC4AZ`dp2O{I$Pl*2L59fK<A?b-lpmiAvawFm`ZILEL&x#I-*^9lgA
M2q&8YYtP7k0K&X`^Z)<=
literal 0
HcmV?d00001
--
1.7.9.5
More information about the Koha-patches
mailing list