From fd122aec52166a2d19fe80579dbf9c98c6ab41fa Mon Sep 17 00:00:00 2001
From: len-odoo <len@odoo.com>
Date: Tue, 25 Sep 2018 13:52:46 +0000
Subject: [FIX] website: fix image carousel

We fix a number of problems:
    - grayscale filter not being applied except on desktop Firefox
    - incorrect vertical-align on iOS
    - image sliders being displayed below the margin on iOS
    - carousel indicators flickering at initial load
    - very short indicator panel, almost unusable on mobile
    - misaligned indicators because of first margin
There are two modes on which these fixes apply:
    - image gallery in slideshow
    - slideshow in modal
       (e.g. obtained by clicking on the gallery set on masonry mode)
Note that due to a refactoring, the gallerySlider was not loaded in the modal,
completely breaking the indicators.

Coauthored by @nle-odoo

opw 1874274

closes odoo/odoo#27226
---
 addons/website/static/src/xml/website.gallery.xml | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

(limited to 'addons/website/static/src/xml/website.gallery.xml')

diff --git a/addons/website/static/src/xml/website.gallery.xml b/addons/website/static/src/xml/website.gallery.xml
index 76bf650e76d..919da3c53d4 100644
--- a/addons/website/static/src/xml/website.gallery.xml
+++ b/addons/website/static/src/xml/website.gallery.xml
@@ -20,11 +20,11 @@
             </div>
 
             <ul class="carousel-indicators">
-                <li class="fa fa-chevron-left o_indicators_left" style="overflow: hidden; padding: 12px; border: 0;"></li>
+                <li class="fa fa-chevron-left o_indicators_left" style="overflow: hidden; padding: 12px; border: 0; visibility: hidden;"></li>
                 <t t-foreach="srcs" t-as="src">
-                    <li t-attf-data-target="##{id}" t-att-data-slide-to="src_index" t-att-class="src_index == index and 'active'" t-attf-style="background-image: url(#{src})"></li>
+                    <li t-attf-data-target="##{id}" t-att-data-slide-to="src_index" t-att-class="'hidden ' + (src_index == index and 'active')" t-attf-style="background-image: url(#{src})"></li>
                 </t>
-                <li class="fa fa-chevron-right o_indicators_right" style="overflow: hidden; padding: 12px; border: 0;"></li>
+                <li class="fa fa-chevron-right o_indicators_right" style="overflow: hidden; padding: 12px; border: 0; visibility: hidden;"></li>
             </ul>
 
             <a class="carousel-control left" t-attf-href="##{id}" data-slide="prev"><span class="fa fa-chevron-left" /></a>
-- 
cgit v1.2.3