From 4aa8e4913a5df0f00535fc569b9ec6570d917c10 Mon Sep 17 00:00:00 2001
From: Benjamin Vray <bvr@odoo.com>
Date: Mon, 24 Aug 2020 11:33:52 +0000
Subject: [PATCH] [FIX] website, *: fix background layer elsewhere than in a
 section

*: web_editor

Before this commit, the elements (other than section) and with the
background layer options avaible (shape, color filter, etc.) did not
have the relative position added on their children. So all the
children were hidden behind the layer element which is in absolute
position.

Part of https://github.com/odoo/odoo/pull/58850
task-2312878

X-original-commit: 9c08e119b125b82e2c42dc944920dd8a96789e25
---
 .../static/src/scss/web_editor.common.scss           |  2 +-
 addons/website/static/src/scss/website.scss          | 12 ++++++++++--
 .../static/src/snippets/s_color_blocks_2/000.scss    |  1 -
 3 files changed, 11 insertions(+), 4 deletions(-)

diff --git a/addons/web_editor/static/src/scss/web_editor.common.scss b/addons/web_editor/static/src/scss/web_editor.common.scss
index e4e0a6f48d2..cd3b6c5a189 100644
--- a/addons/web_editor/static/src/scss/web_editor.common.scss
+++ b/addons/web_editor/static/src/scss/web_editor.common.scss
@@ -770,7 +770,7 @@ blockquote {
     pointer-events: none;
 }
 
-section {
+section, .oe_img_bg, [data-oe-shape-data] {
     @extend %o-we-background-layer-parent;
 }
 .o_we_bg_filter {
diff --git a/addons/website/static/src/scss/website.scss b/addons/website/static/src/scss/website.scss
index 1cb8c0f70af..9be0325620c 100644
--- a/addons/website/static/src/scss/website.scss
+++ b/addons/website/static/src/scss/website.scss
@@ -373,6 +373,9 @@ font[class*='bg-'] {
 .o_bg_video_loading {
     @include o-position-absolute(0, 0 ,0 ,0);
 }
+.o_background_video, .parallax {
+    @extend %o-we-background-layer-parent;
+}
 
 // Probably outdated
 // Lists
@@ -487,6 +490,7 @@ table.table_desc tr td {
     // Controls
     .carousel-control-prev,
     .carousel-control-next {
+        position: absolute;
         cursor: pointer;
         width: 8%;
         opacity: 1;
@@ -513,8 +517,12 @@ table.table_desc tr td {
         }
     }
     // Indicators
-    .carousel-indicators li:hover:not(.active) {
-        background-color: rgba(255,255,255,.8);
+    .carousel-indicators {
+        position: absolute;
+
+        li:hover:not(.active) {
+            background-color: rgba(255,255,255,.8);
+        }
     }
 
     // Default
diff --git a/addons/website/static/src/snippets/s_color_blocks_2/000.scss b/addons/website/static/src/snippets/s_color_blocks_2/000.scss
index 8982f8e87b0..555cab58f55 100644
--- a/addons/website/static/src/snippets/s_color_blocks_2/000.scss
+++ b/addons/website/static/src/snippets/s_color_blocks_2/000.scss
@@ -19,7 +19,6 @@
         }
     }
     [class*="col-lg-"] {
-        @extend %o-we-background-layer-parent;
         padding: 8% 5%;
         padding-top: 8vw; // A flex item cannot have % padding top and bottom (even if it works on chrome)
         padding-bottom: 8vw; // Solution is vw units but we keep 8% as a fallback