[FIX] web: fix style of form view in modal

task-2302721

closes odoo/odoo#56932

X-original-commit: 7c4787a1431538ddb69bfbc50a27dd033437a6a4
Signed-off-by: Alexandre Kühn (aku) <aku@odoo.com>
Signed-off-by: Sébastien Theys (seb) <seb@odoo.com>

1 files changed, 29 insertions, 2 deletions

diff --git a/addons/web/static/src/scss/form_view.scss b/addons/web/static/src/scss/form_view.scss
index 08b1d916d8d..ff0ec53022d 100644
--- a/addons/web/static/src/scss/form_view.scss
+++ b/addons/web/static/src/scss/form_view.scss
@@ -816,11 +816,31 @@
 // Overridden style when form view in modal
 .modal .modal-dialog {
     .o_form_view {
+        .o_statusbar_buttons > .btn {
+            /**
+             * Override to prevent the status bar from increasing height when
+             * inside dialog due to the original margin on those buttons. This
+             * prevents the other status buttons, those on the far right of the
+             * bar, from having a gap between their bottom and the bottom border
+             * of the status bar itself.
+             */
+            margin-top: 2px;
+            margin-bottom: 2px;
+        }
+
         .o_form_sheet_bg {
             padding: 0;
 
-            > * {
-                margin: 0;
+            > .o_form_statusbar, > .alert {
+                /**
+                 * Override to prevent the status bar from overflowing on its
+                 * far right. The original value is a negative margin that
+                 * is supposed to compensate unwanted padding of the original
+                 * view but the view inside dialog already has this padding
+                 * removed.
+                 */
+                margin-left: 0;
+                margin-right: 0;
             }
 
             > .o_form_sheet {
@@ -828,6 +848,13 @@
                 width: 100%;
                 margin: 0 auto;
                 max-width: none;
+                /**
+                 * Override to prevent double border, because the borders of the
+                 * dialog itself or the borders of other surrounding elements
+                 * (status bar, dialog footer) already act as a border for the
+                 * sheet when inside dialog.
+                 */
+                border: none;
             }
         }
     }