From 3a76a9326e0cd8ecd74df602987ef8a29489e75c Mon Sep 17 00:00:00 2001
From: Brieuc-brd <brd@odoo.com>
Date: Fri, 3 Nov 2023 17:48:37 +0100
Subject: [PATCH] [FIX] website: adapt offcanvas menu height on mobile

Prior to this commit, on mobile, we couldn't see the entire offcanvas
menu because the browser's UI was hidding part of it.

To fix that, this commit adapts the height of the offcanvas menu using
`dvh` unit.

task-3582657

closes odoo/odoo#141032

Signed-off-by: Romain Derie (rde) <rde@odoo.com>
---
 addons/website/static/src/scss/website.scss | 2 ++
 addons/website/views/website_templates.xml  | 4 ++--
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/addons/website/static/src/scss/website.scss b/addons/website/static/src/scss/website.scss
index dd5f41cdab4..1353cfd0b81 100644
--- a/addons/website/static/src/scss/website.scss
+++ b/addons/website/static/src/scss/website.scss
@@ -362,6 +362,8 @@ $-seen-urls: ();
     $-menu-color: o-color('menu-custom') or o-color('menu');
 
     @include o-bg-color($-menu-color);
+
+    height: 100dvh;
 }
 
 $-header-nav-link-height: $nav-link-height;
diff --git a/addons/website/views/website_templates.xml b/addons/website/views/website_templates.xml
index db3d18c3375..743da727446 100644
--- a/addons/website/views/website_templates.xml
+++ b/addons/website/views/website_templates.xml
@@ -322,7 +322,7 @@
                     </button>
                 </li>
             </ul>
-            <div t-attf-class="offcanvas #{_side if _side else 'offcanvas-end'} o_navbar_mobile vh-100" id="top_menu_collapse_mobile">
+            <div t-attf-class="offcanvas #{_side if _side else 'offcanvas-end'} o_navbar_mobile" id="top_menu_collapse_mobile">
                 <div class="offcanvas-header justify-content-end o_not_editable">
                     <button type="button" class="nav-link btn-close" data-bs-dismiss="offcanvas" aria-label="Close"/>
                 </div>
@@ -532,7 +532,7 @@
                         <t t-set="_dropdown_menu_class" t-valuef="dropdown-menu-end"/>
                     </t>
                 </ul>
-                <div class="offcanvas offcanvas-start o_navbar_mobile vh-100" id="top_menu_collapse">
+                <div class="offcanvas offcanvas-start o_navbar_mobile" id="top_menu_collapse">
                     <div class="offcanvas-header justify-content-end">
                         <button type="button" class="btn-close" data-bs-dismiss="offcanvas" aria-label="Close"/>
                     </div>