From 8a7d5f68f0e7d56b3a0133470b71fd08838de41c Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Alexandre=20D=C3=ADaz?= <alexandre.diaz@tecnativa.com>
Date: Wed, 9 Oct 2019 15:37:50 +0200
Subject: [PATCH] [IMP] web_responsive: Support long titles

---
 web_responsive/README.rst                        |  1 +
 web_responsive/readme/ROADMAP.rst                |  1 +
 web_responsive/static/description/index.html     |  1 +
 .../static/src/css/web_responsive.scss           | 16 ++++++++++++++--
 4 files changed, 17 insertions(+), 2 deletions(-)

diff --git a/web_responsive/README.rst b/web_responsive/README.rst
index ab87b38e3..5e10996e9 100644
--- a/web_responsive/README.rst
+++ b/web_responsive/README.rst
@@ -127,6 +127,7 @@ Known issues / Roadmap
   new size. This is Odoo's own limitation.
 * App navigation with keyboard.
 * Make it more beautiful. Maybe OCA-branded?
+* Handle long titles on forms in a better way
 
 Bug Tracker
 ===========
diff --git a/web_responsive/readme/ROADMAP.rst b/web_responsive/readme/ROADMAP.rst
index d2ca35cd2..f6a669c3d 100644
--- a/web_responsive/readme/ROADMAP.rst
+++ b/web_responsive/readme/ROADMAP.rst
@@ -4,3 +4,4 @@
   new size. This is Odoo's own limitation.
 * App navigation with keyboard.
 * Make it more beautiful. Maybe OCA-branded?
+* Handle long titles on forms in a better way
diff --git a/web_responsive/static/description/index.html b/web_responsive/static/description/index.html
index e9ebd0c66..192db9bdb 100644
--- a/web_responsive/static/description/index.html
+++ b/web_responsive/static/description/index.html
@@ -464,6 +464,7 @@ you should reload the web client to get the full experience for that
 new size. This is Odoo’s own limitation.</li>
 <li>App navigation with keyboard.</li>
 <li>Make it more beautiful. Maybe OCA-branded?</li>
+<li>Handle long titles on forms in a better way</li>
 </ul>
 </div>
 <div class="section" id="bug-tracker">
diff --git a/web_responsive/static/src/css/web_responsive.scss b/web_responsive/static/src/css/web_responsive.scss
index 035b7811b..94f46898d 100644
--- a/web_responsive/static/src/css/web_responsive.scss
+++ b/web_responsive/static/src/css/web_responsive.scss
@@ -16,6 +16,15 @@
     transform: none !important;
 }
 
+// Support for long titles
+@include media-breakpoint-up(md) {
+    .o_form_view .oe_button_box + .oe_title,
+    .o_form_view .oe_button_box + .oe_avatar + .oe_title {
+        /* Button-box has a hardcoded width of 132px per button and have three columns */
+        width: calc(100% - 450px);
+    }
+}
+
 // Main navbar (with apps menu, user menu, debug menu...)
 @include media-breakpoint-down(sm) {
     .o_main_navbar {
@@ -348,8 +357,6 @@ html .o_web_client .o_main .o_main_content {
 
         // Support for long title (with ellipsis)
         .oe_title {
-            width: initial;
-
             span.o_field_widget {
                 max-width: 100%;
                 text-overflow: ellipsis;
@@ -372,6 +379,11 @@ html .o_web_client .o_main .o_main_content {
                 max-width: 100%;
             }
 
+            .oe_button_box + .oe_title,
+            .oe_button_box + .oe_avatar + .oe_title {
+                width: 100%;
+            }
+
             // Avoid overflow on modals
             .o_form_sheet {
                 min-width: auto;