From ecfede43bb24bd1371f41b1fffbcacc3d89fcb68 Mon Sep 17 00:00:00 2001
From: sLorenzini <sarah.lorenzini@prestashop.com>
Date: Wed, 6 Mar 2013 10:22:46 +0100
Subject: [PATCH] [-] FO: fixed bug Module crosselling not working properly
 (Scroll / JS) - #PSCFV-8080

---
 modules/crossselling/crossselling.css         |  51 ++++--------------
 modules/crossselling/crossselling.tpl         |   2 +-
 modules/crossselling/img/thumbs_left.gif      | Bin 0 -> 201 bytes
 modules/crossselling/img/thumbs_right.gif     | Bin 0 -> 197 bytes
 modules/productscategory/productscategory.css |  10 +++-
 5 files changed, 21 insertions(+), 42 deletions(-)
 create mode 100644 modules/crossselling/img/thumbs_left.gif
 create mode 100644 modules/crossselling/img/thumbs_right.gif

diff --git a/modules/crossselling/crossselling.css b/modules/crossselling/crossselling.css
index 055965f2e..ab5e87231 100644
--- a/modules/crossselling/crossselling.css
+++ b/modules/crossselling/crossselling.css
@@ -6,21 +6,27 @@
 	color:#333
 }
 
+#crossselling {overflow:auto}
+
 #crossselling ul {list-style-type:none}
 #crossselling li {
 	float:left;
-	margin-right:25px;
-	height:80px;
+	margin: 0 8px;
+    padding: 0 5px;
 }
 #crossselling li a.lnk_img {display:block}
 #crossselling li a img {border:1px solid #ccc}
 #crossselling li p.product_name {text-align:center}
 
-#crossselling_list {overflow: hidden;}
+#crossselling_list {
+	float: left;
+    overflow: hidden;
+    width: 96%;
+}
 
 #crossselling_scroll_left,
  #crossselling_scroll_right {
-	background: url('../../../img/thumbs_left.gif') no-repeat center;
+	background: url('img/thumbs_left.gif') no-repeat center;
 	text-indent: -3000px;
 	display: block;
 	width: 9px;
@@ -28,39 +34,4 @@
 	float: left;
 	margin-top: 30px
 }
-#crossselling_scroll_right { background-image: url('../../../img/thumbs_right.gif') }
-/*
-div#crossselling {
-	padding-top: 10px;
-	clear: both;
-	margin-bottom: 10px
-}
-#crossselling {
-	margin: 0 auto 0;
-	height: 170px;
-	width: 100%
-}
-#crossselling_noscroll {
-	margin: 0 auto 0;
-	height: 120px;
-	width: 100%
-}
-#crossselling_list {
-	overflow: hidden;
-	float: left;
-	width: 96%
-}
-#crossselling_list ul {
-	padding-left: 0;
-	list-style-type: none
-}
-#crossselling_list li {
-	float: left;
-	margin: 0 3px;
-	cursor: pointer;
-	text-align: center;
-	width: 100px;
-	overflow: hidden
-}
-#crossselling_list li a { margin: auto }
-*/
\ No newline at end of file
+#crossselling_scroll_right { background-image: url('img/thumbs_right.gif') }
diff --git a/modules/crossselling/crossselling.tpl b/modules/crossselling/crossselling.tpl
index 6c3c0fa17..c537cb2a8 100755
--- a/modules/crossselling/crossselling.tpl
+++ b/modules/crossselling/crossselling.tpl
@@ -30,7 +30,7 @@
 	<div id="{if count($orderProducts) > 5}crossselling{else}crossselling_noscroll{/if}">
 		{if count($orderProducts) > 5}<a id="crossselling_scroll_left" title="{l s='Previous' mod='crossselling'}" href="javascript:{ldelim}{rdelim}">{l s='Previous' mod='crossselling'}</a>{/if}
 		<div id="crossselling_list">
-			<ul class="clearfix">
+			<ul class="clearfix" {if count($orderProducts) > 5}style="width: {math equation="width * nbImages" width=107 nbImages=$orderProducts|@count}px"{/if}>
 				{foreach from=$orderProducts item='orderProduct' name=orderProduct}
 				<li>
 					<a href="{$orderProduct.link}" title="{$orderProduct.name|htmlspecialchars}" class="lnk_img"><img src="{$orderProduct.image}" alt="{$orderProduct.name|htmlspecialchars}" /></a>
diff --git a/modules/crossselling/img/thumbs_left.gif b/modules/crossselling/img/thumbs_left.gif
new file mode 100644
index 0000000000000000000000000000000000000000..2830a5fc8fe7f8ed6e754fe6324c236d2362b76d
GIT binary patch
literal 201
zcmZ?wbhEHb<YW+HI3mID?c2BW=g)ut{{8FMulMiY|NZ;-lP6E^-Me?^&Yh=EpMLrB
z<?-XkSFc{ZapT6rhYx@L{CV->#mkp3|NHmv+O=ypZ{ECp`}VJ2zwX|>`~Uxc25dm_
zCkrD3g9L*PND^cx1FM^YTHlN>6BbR0SdkL*MnhLr$2vsT`^c2rlbnw%pB$rbcs{G3
qgHU2)TF~+ai>WglQ?gDQ%`@a#&?w8OWhL_9k}4-hV!0v<gEauFcw<5U

literal 0
HcmV?d00001

diff --git a/modules/crossselling/img/thumbs_right.gif b/modules/crossselling/img/thumbs_right.gif
new file mode 100644
index 0000000000000000000000000000000000000000..8fc57752281038fd4dda77fc47d5134666f63243
GIT binary patch
literal 197
zcmZ?wbhEHb<YW+HI3mXI?c296U%uSEd-wkR`%j-fy>a8l^XJch{P^+n=g%iko_ziK
z_3G8D4<A0fef##!n>VjryY}zjzsr{|U%Ytn{Q2`|&z}AM{rms_{~2%t#h)yU3=Con
zIv^z=I~iD=6c{2?GDFX0%nMmOP1KZA-`exA^nJm_?<Sp4He}+GW$F0%FhgS6S;mlp
f2s5p135>I284@;~5Z4J@qc!=!siuJS&J5N7EjL_V

literal 0
HcmV?d00001

diff --git a/modules/productscategory/productscategory.css b/modules/productscategory/productscategory.css
index 54ff31133..6430cb011 100644
--- a/modules/productscategory/productscategory.css
+++ b/modules/productscategory/productscategory.css
@@ -19,8 +19,16 @@ h2.productscategory_h2 {
 }
 #productscategory_list li {
 	float:left;
-	margin-right:30px
+	margin: 0 9px;
+    padding: 0 5px;
 }
+
+@media screen and (-webkit-min-device-pixel-ratio:0) {
+	#productscategory_list li   {
+		margin: 0 7px;
+	}
+}
+
 #productscategory_list li a.lnk_img {display:block}
 #productscategory_list li a img {border:1px solid #ccc}
 #productscategory_list li p.product_name {text-align:center}