[FIX] mail, web: open systray menu dropdown in mobile.

Before this commit, it was not possible to open systray menus in mobile. This is due to popper.js that is wrongly dynamically positioning the dropdown menu. This commit fixes the issue by disabling dynamic positioning by popper.js for the systray menus, so that it uses ou custom styles for dropdown menu. Closes odoo#26434
odoo-dev · Sep 13, 2018 · 5373db1 · 5373db1
1 parent 3ee4390
commit 5373db1
Show file tree

Hide file tree

Showing 4 changed files with 6 additions and 5 deletions.
diff --git a/addons/mail/static/src/xml/systray.xml b/addons/mail/static/src/xml/systray.xml
@@ -6,7 +6,7 @@
     -->
     <t t-name="mail.systray.MessagingMenu">
         <li class="o_mail_systray_item">
-            <a class="dropdown-toggle o-no-caret" data-toggle="dropdown" aria-expanded="false" title="Conversations" href="#" role="button">
+            <a class="dropdown-toggle o-no-caret" data-toggle="dropdown" data-display="static" aria-expanded="false" title="Conversations" href="#" role="button">
                 <i class="fa fa-comments" role="img" aria-label="Messages"/> <span class="o_notification_counter badge badge-pill"/>
             </a>
             <div class="o_mail_systray_dropdown dropdown-menu dropdown-menu-right" role="menu">
@@ -105,7 +105,7 @@
 
     <t t-name="mail.systray.ActivityMenu">
         <li class="o_mail_systray_item">
-            <a class="dropdown-toggle o-no-caret" data-toggle="dropdown" aria-expanded="false" title="Activities" href="#" role="button">
+            <a class="dropdown-toggle o-no-caret" data-toggle="dropdown" data-display="static" aria-expanded="false" title="Activities" href="#" role="button">
                 <i class="fa fa-clock-o" role="img" aria-label="Activities"/> <span class="o_notification_counter badge badge-pill"/>
             </a>
             <div class="o_mail_systray_dropdown dropdown-menu dropdown-menu-right" role="menu">

diff --git a/addons/web/static/src/xml/base.xml b/addons/web/static/src/xml/base.xml
@@ -228,7 +228,7 @@
 
 <t t-name="WebClient.DebugManager">
     <li class="o_debug_manager" role="menuitem">
-        <a href="#" title="Open Developer Tools" aria-label="Open Developer Tools" data-toggle="dropdown" aria-expanded="false" tabindex="-1">
+        <a href="#" title="Open Developer Tools" aria-label="Open Developer Tools" data-toggle="dropdown" aria-expanded="false" tabindex="-1" data-display="static">
             <span class="fa fa-bug"/>
         </a>
         <div class="dropdown-menu dropdown-menu-right o_debug_dropdown" role="menu"/>

diff --git a/addons/website/static/src/scss/website.ui.scss b/addons/website/static/src/scss/website.ui.scss
@@ -23,6 +23,7 @@ body.o_connected_user {
     .dropdown-menu {
         font-size: inherit;
         border-radius: 0;
+        color: $dropdown-link-active-color;
     }
 
     .o_menu_sections {

diff --git a/addons/website/views/website_navbar_templates.xml b/addons/website/views/website_navbar_templates.xml
@@ -37,7 +37,7 @@
                 <ul class="o_menu_sections" groups="website.group_website_designer">
                     <!-- Content -->
                     <li t-if="editable" class="dropdown" id="content-menu">
-                        <a id="content-menu-button" class="dropdown-toggle o-no-caret waves" data-toggle="dropdown" href="#">Pages</a>
+                        <a id="content-menu-button" class="dropdown-toggle o-no-caret waves" data-toggle="dropdown" data-display="static" href="#">Pages</a>
                         <div class="dropdown-menu" role="menu">
                             <a role="menuitem" data-action="edit_menu" href="#" title="Edit Top Menu" class="dropdown-item">Edit Menu</a>
                             <a role="menuitem" href="/website/pages" title="Manage Your Website Pages" class="dropdown-item">Manage Pages</a>
@@ -47,7 +47,7 @@
                     </li>
                     <!-- Customize -->
                     <li class="dropdown" id="customize-menu">
-                        <a class="dropdown-toggle o-no-caret waves" data-toggle="dropdown" href="#">Customize</a>
+                        <a class="dropdown-toggle o-no-caret waves" data-toggle="dropdown" data-display="static" href="#">Customize</a>
                         <div class="dropdown-menu" role="menu">
                             <a role="menuitem" href="#" data-action="customize_theme" class="dropdown-item" id="theme_customize">Customize Theme</a>
                             <a role="menuitem" href="#" data-action="ace" class="dropdown-item" id="html_editor">HTML/CSS Editor</a>