From af96efffc9d12e827374841361e2fa89b426a59f Mon Sep 17 00:00:00 2001
From: Christophe Matthieu <chm@openerp.com>
Date: Mon, 30 Sep 2013 10:47:08 +0200
Subject: [PATCH] [IMP] website_sale: responsible design for products grid

bzr revid: chm@openerp.com-20130930084708-is68jozdizp1c9z9
---
 .../static/src/css/website_sale.css           | 19 +++++++++++++++++--
 .../static/src/css/website_sale.sass          | 15 ++++++++++++++-
 2 files changed, 31 insertions(+), 3 deletions(-)

diff --git a/addons/website_sale/static/src/css/website_sale.css b/addons/website_sale/static/src/css/website_sale.css
index 9fad582c61d..f253f5badd9 100644
--- a/addons/website_sale/static/src/css/website_sale.css
+++ b/addons/website_sale/static/src/css/website_sale.css
@@ -111,6 +111,23 @@
   height: 280px;
 }
 
+@media (max-width: 728px) {
+  .oe_product {
+    float: left;
+    width: 100%;
+    height: 200px;
+    display: inline-block;
+  }
+
+  #products_grid table, #products_grid tbody, #products_grid tr, #products_grid td {
+    float: left;
+    width: 100%;
+    display: inline-block;
+  }
+  #products_grid table td.oe-height-2 {
+    display: none;
+  }
+}
 @media (min-width: 992px) {
   .col-md-12 .oe-height-1 {
     height: 95px;
@@ -138,7 +155,6 @@
     height: 288px;
   }
 }
-
 @media (min-width: 1200px) {
   .col-md-12 .oe-height-1 {
     height: 125px;
@@ -166,7 +182,6 @@
     height: 380px;
   }
 }
-
 /* ---- Product list style ---- */
 .oe_list_products {
   border: none;
diff --git a/addons/website_sale/static/src/css/website_sale.sass b/addons/website_sale/static/src/css/website_sale.sass
index 2005fba89f3..6edcdae16f3 100644
--- a/addons/website_sale/static/src/css/website_sale.sass
+++ b/addons/website_sale/static/src/css/website_sale.sass
@@ -103,6 +103,20 @@
     .oe-height-4
         height: 280px
 
+@media (max-width: 728px)
+    .oe_product
+        float: left
+        width: 100%
+        height: 200px
+        display: inline-block
+    #products_grid
+        table, tbody,tr, td
+            float: left
+            width: 100%
+            display: inline-block
+        table td.oe-height-2
+            display: none
+
 @media (min-width: 992px)
     .col-md-12
         .oe-height-1
@@ -143,7 +157,6 @@
         .oe-height-4
             height: 380px
 
-
 /* ---- Product list style ---- */
 .oe_list_products
     border: none