From c3289f073444a2d4bc30c3200d7427cfbceaf347 Mon Sep 17 00:00:00 2001 From: "Hamza (hisl)" Date: Fri, 25 Aug 2023 06:59:27 +0000 Subject: [PATCH] [FIX] web: set pointer events none for ribbon The forms where we have ribbons do not provide a great user experience when the internal links are right below the ribbon. Because of the shape and size of the ribbon, the internal link button on the topmost fields gets behind the ribbon. Because the rectangular part of the ribbon is transparent, we can see the button, but cannot click or hover over it, because the ribbon element takes over. To resolve this, I set the pointer-events of ribbon to none. The ribbons already do not have any click events so this solution seems okay. Steps to Reproduce: 1. Move a helpdesk ticket to the archive. 2. Try to move to the customer page using the internal link. Current Behavior: The link button cannot be hovered over and clicked. Expected Behavior: The link button should be above other elements and clickable. OPW-3468153 closes odoo/odoo#140099 X-original-commit: c9aa5fb7645470c5a63784e58fdb4ee9acf7d5e8 Signed-off-by: Bastien Fafchamps (bafa) Signed-off-by: Simon Goffin (sig) --- addons/web/static/src/views/widgets/ribbon/ribbon.scss | 1 + 1 file changed, 1 insertion(+) diff --git a/addons/web/static/src/views/widgets/ribbon/ribbon.scss b/addons/web/static/src/views/widgets/ribbon/ribbon.scss index 192c18003c5..2eb74ed6cb5 100644 --- a/addons/web/static/src/views/widgets/ribbon/ribbon.scss +++ b/addons/web/static/src/views/widgets/ribbon/ribbon.scss @@ -43,6 +43,7 @@ --Ribbon-gap-top-default: calc(var(--formView-sheet-padding-y, 0) * -1 - #{$border-width}); --Ribbon-gap-right-default: -#{$border-width}; + pointer-events: none; margin-top: var(--Ribbon-gap-top, var(--Ribbon-gap-top-default)); right: var(--Ribbon-gap-right, var(--Ribbon-gap-right-default));