From e8ebf80909ef01f41df35fea14802160aa3268fb Mon Sep 17 00:00:00 2001 From: Benjamin Vray Date: Thu, 27 Apr 2023 14:14:08 +0000 Subject: [PATCH] [FIX] website: fix overflowing navbar links on mobile This commit fixes a bug with the navbar links in the header of a website on mobile. When the text of a link is long enough to be wider than the screen, the text does not wrap to the next line as intended, but instead overflows to the right outside of the screen, causing part of the text to be hidden. Steps to reproduce the bug: - Edit the text of one of the menu links on a website to make it longer than the width of the mobile screen. - Bug: In mobile view, part of the link text is hidden. This bug occurs with both the "default" hamburger type and the "off-canvas" hamburger type. opw-3233684 closes odoo/odoo#121464 X-original-commit: eae10f2e154a1b6bf9f385460b1371faf9869a3f Signed-off-by: Quentin Smetz (qsm) Signed-off-by: Vray Benjamin (bvr) --- addons/website/static/src/scss/website.scss | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/addons/website/static/src/scss/website.scss b/addons/website/static/src/scss/website.scss index 9f93f507934..3d9852356f0 100644 --- a/addons/website/static/src/scss/website.scss +++ b/addons/website/static/src/scss/website.scss @@ -898,6 +898,12 @@ header { max-height: 80vh; overflow-y: auto; overflow-x: hidden; // Needed because of container in container having 0px padding... TODO improve + + @include media-breakpoint-down(lg) { + .nav-link, .dropdown-item { + white-space: normal; + } + } } &:not(.o_header_is_scrolled) {