From 7dcb8fea642858e0bb1d68cea9707cb3c8d4328d Mon Sep 17 00:00:00 2001 From: qsm-odoo Date: Mon, 29 May 2017 16:06:12 +0200 Subject: [PATCH] [IMP] web: make backdrops appear on top of older modals When opening a modal on top of another, we expect the associated modal-backdrop to be over this another modal (so that it is grayed). This was not the case as bootstrap forces the modal-backdrop z-index to a lower value than the modal's one (see fix comments in the changes below). --- addons/web/static/src/less/modal.less | 19 +++++++++++++++++++ 1 file changed, 19 insertions(+) diff --git a/addons/web/static/src/less/modal.less b/addons/web/static/src/less/modal.less index 2a0fbb1fa36..025a5f3c91e 100644 --- a/addons/web/static/src/less/modal.less +++ b/addons/web/static/src/less/modal.less @@ -74,3 +74,22 @@ } } } + +.modal-backdrop { + // Change the z-index of the modal-backdrop element to be equal to the + // modal element's one. Bootstrap does not support multi-modals, and without + // this rule all the modal-backdrops are below all the opened modals. + // Indeed, bootstrap forces them to a lower z-index as the modal-backdrop + // element (unique in their supported cases) might be put after the modal + // element (if the modal is already in the DOM, hidden, then opened). This + // cannot happen in odoo though as modals are not hidden but removed from + // the DOM and are always put at the end of the body when opened. + // + // Note that changing the @zindex-modal-background variable would have had + // the same effect but bootstrap removed it in their newest version, so this + // will be the proper fix. Note that they removed it to fix an issue with + // the "close on click on the backdrop" feature, so that is ok as we do not + // use this feature. + // (https://github.com/twbs/bootstrap/commit/4bbe80658a9d32df131e5fb13bc20688b99a70d5) + z-index: @zindex-modal; +}