From 5ee96757e662d2089558aeacb30a172cd6c7a25f Mon Sep 17 00:00:00 2001 From: Benjamin Vray Date: Tue, 27 Jun 2023 13:47:01 +0000 Subject: [PATCH] [FIX] website: fix carousel arrows hidden with grid mode Steps to reproduce the bug: - Drag and drop a Carousel snippet onto the homepage. - Add an image inside a Carousel slide. - Set the "Content width" option of the slide to "Full". - Set the "Layout" option of the slide to "Grid". - Make sure the image touches the edge of the page. - Bug: The arrows are below the image and are no longer accessible. To fix this bug, we add 'isolation: isolate;' on the Carousel content to create a new stacking context. This ensures that elements like indicators and arrows will always appear on top of the carousel content. task-3383061 closes odoo/odoo#127491 X-original-commit: 99133cafbb0cb0aa9563475eb364dfffc412d2fe Signed-off-by: Quentin Smetz (qsm) --- addons/website/static/src/scss/website.scss | 3 +++ 1 file changed, 3 insertions(+) diff --git a/addons/website/static/src/scss/website.scss b/addons/website/static/src/scss/website.scss index 98095ead397..a4b25122a6b 100644 --- a/addons/website/static/src/scss/website.scss +++ b/addons/website/static/src/scss/website.scss @@ -551,6 +551,9 @@ table.table_desc tr td { } // Content .carousel-inner { + // Create a new stacking context to ensure that elements like indicators + // and arrows will always appear on top of the carousel content. + isolation: isolate; overflow: hidden; height: 100%; .carousel-item {