From fcafe21f1e677ebec1786c28191bd13603dee3c0 Mon Sep 17 00:00:00 2001 From: Krunal Trivedi Date: Fri, 25 Oct 2019 11:18:06 +0000 Subject: [PATCH] [FIX] web_editor, website: properly display the redirect old url list When a user clicks on 'could be used in' in the page properties after chaing the URL, a list is displayed in a popup. This popup was not properly rendered: - the content could not be scrolled through, it was thus truncated - the popup appeared behind the technical modal that kicks in on small screens Now the popup is better positioned, a scrollbar is available to access its content when it is too long and on small screens it is displayed on top of the technical modal, making it visible on small screens. task-2092269 closes odoo/odoo#83693 X-original-commit: e2f1f4967a2dd4d730895e924f0c7ca02e23a17b Signed-off-by: Quentin Smetz (qsm) Co-authored-by: Jitendra Prajapati Co-authored-by: Benoit Socias --- .../static/src/scss/web_editor.common.scss | 4 ++-- .../static/src/scss/web_editor.variables.scss | 2 ++ addons/website/static/src/js/menu/content.js | 16 ++++++++++++++-- addons/website/static/src/scss/website.ui.scss | 12 ++++++++++++ .../static/src/xml/website.pageProperties.xml | 11 +++++++++-- 5 files changed, 39 insertions(+), 6 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 6d84b6ed568..d04dada823f 100644 --- a/addons/web_editor/static/src/scss/web_editor.common.scss +++ b/addons/web_editor/static/src/scss/web_editor.common.scss @@ -545,11 +545,11 @@ a.o_underline { // modal select media .o_technical_modal.o_web_editor_dialog { // see template 'web_editor.FieldTextHtml.fullscreen' - z-index: 2001; + z-index: $o-we-technical-modal-zindex; > .o_select_media_dialog { max-width: inherit !important; - z-index: 2001; + z-index: $o-we-technical-modal-zindex; .modal-dialog, .model-content { height: 100%; diff --git a/addons/web_editor/static/src/scss/web_editor.variables.scss b/addons/web_editor/static/src/scss/web_editor.variables.scss index fd8b053e6aa..109f008fd9c 100644 --- a/addons/web_editor/static/src/scss/web_editor.variables.scss +++ b/addons/web_editor/static/src/scss/web_editor.variables.scss @@ -187,6 +187,8 @@ $o-we-sidebar-content-field-toggle-control-height: $o-we-sidebar-content-field-t $o-we-sidebar-content-field-toggle-control-bg: $o-we-fg-lighter !default; $o-we-sidebar-content-field-toggle-control-shadow: 0 2px 3px 0 $o-we-bg-darkest !default; +$o-we-technical-modal-zindex: 2001; + //------------------------------------------------------------------------------ // Preview component Mixins //------------------------------------------------------------------------------ diff --git a/addons/website/static/src/js/menu/content.js b/addons/website/static/src/js/menu/content.js index 7a8a4967a4b..b721250c978 100644 --- a/addons/website/static/src/js/menu/content.js +++ b/addons/website/static/src/js/menu/content.js @@ -132,8 +132,20 @@ var PagePropertiesDialog = weWidgets.Dialog.extend({ }); dep_text = dep_text.join(', '); self.$('#dependencies_redirect').html(qweb.render('website.show_page_dependencies', { dependencies: dependencies, dep_text: dep_text })); - self.$('#dependencies_redirect [data-toggle="popover"]').popover({ - container: 'body', + self.$('a.o_dependencies_redirect_link').on('click', () => { + self.$('.o_dependencies_redirect_list_popover').popover({ + html: true, + title: _t('Dependencies'), + boundary: 'viewport', + placement: 'right', + trigger: 'focus', + content: () => { + return qweb.render('website.get_tooltip_dependencies', { + dependencies: dependencies, + }); + }, + template: qweb.render('website.page_dependencies_popover'), + }).popover('toggle'); }); })); diff --git a/addons/website/static/src/scss/website.ui.scss b/addons/website/static/src/scss/website.ui.scss index 5336b7ef0aa..4031b67311d 100644 --- a/addons/website/static/src/scss/website.ui.scss +++ b/addons/website/static/src/scss/website.ui.scss @@ -555,3 +555,15 @@ body .modal { } } } + +// Page Properties +.o_redirect_old_url { + @include media-breakpoint-down(sm) { + // Because o_technical_modal class class has a higher z-index than $zindex-modal. + z-index: $o-we-technical-modal-zindex + ($zindex-popover - $zindex-modal); + } + .popover-body { + overflow-y: auto; + max-height: 14.2rem; + } +} diff --git a/addons/website/static/src/xml/website.pageProperties.xml b/addons/website/static/src/xml/website.pageProperties.xml index 5afdbb5f121..292e06f06f5 100644 --- a/addons/website/static/src/xml/website.pageProperties.xml +++ b/addons/website/static/src/xml/website.pageProperties.xml @@ -33,7 +33,14 @@ - (could be used in ) + (could be used in ) + + +