[REF] web: review form view layout

The goal of this review is to have a layout which is correct to
implement the enterprise side-chatter.

This also removes/fixes deprecated community rules and xml templates.

addons/web/static/src/js/views/form/form_renderer.js

@@ -754,11 +754,9 @@ var FormRenderer = BasicRenderer.extend({
      */
     _renderTagSheet: function (node) {
         this.has_sheet = true;
-        var $result = $('<div>').addClass('o_form_sheet_bg');
         var $sheet = $('<div>').addClass('o_form_sheet');
         $sheet.append(_.map(node.children, this._renderNode.bind(this)));
-        $result.append($sheet);
-        return $result;
+        return $sheet;
     },
     /**
      * Main entry point for the rendering.  From here, we call _renderNode on
@@ -797,6 +795,10 @@ var FormRenderer = BasicRenderer.extend({
         // Set the new content of the form view, and toggle classnames
         this.$el.html($newContent);
         this.$el.toggleClass('o_form_nosheet', !this.has_sheet);
+        if (this.has_sheet) {
+            this.$el.children().not('.oe_chatter')
+                .wrapAll($('<div/>', {class: 'o_form_sheet_bg'}));
+        }
         this.$el.toggleClass('o_form_editable', this.mode === 'edit');
         this.$el.toggleClass('o_form_readonly', this.mode === 'readonly');
 

addons/web/static/src/less/form_view.less

@@ -128,9 +128,27 @@
         }
     }
 
+    // No sheet
+    &.o_form_nosheet {
+        display: block;
+        .o-webclient-padding(@top: @odoo-sheet-vpadding, @bottom: @odoo-sheet-vpadding);
+
+        .o_form_statusbar {
+            margin: -@odoo-sheet-vpadding -@odoo-horizontal-padding @odoo-sheet-vpadding -@odoo-horizontal-padding;
+        }
+    }
+
+    // Non-chatter rules
+    .o_form_sheet_bg {
+        position: relative;
+
+        > .o_form_sheet {
+            margin: @odoo-sheet-vpadding auto;
+        }
+    }
+
     // Statusbar
     .o_form_statusbar {
-        .o-flex(0, 0, auto);
         position: relative; // Needed for the "More" dropdown
         .o-flex-display();
         .o-justify-content(space-between);

addons/web/static/src/less/form_view_extra.less

@@ -3,17 +3,17 @@
 @sheet-padding: 16px;
 
 .o_form_view {
+    &.o_form_nosheet.oe_form_nomargin {
+        margin: 0;
+    }
     .o_form_sheet_bg {
-        position: relative;
-        padding: @sheet-padding 0;
         border-bottom: 1px solid #ddd;
         background: url(/web/static/src/img/form_sheetbg.png);
 
-        .o_form_sheet {
+        > .o_form_sheet {
             min-width: @sheet-min-width;
             max-width: @sheet-max-width;
             min-height: 330px;
-            margin: 0 auto;
             padding: 16px;
             border: 1px solid #c8c8d3;
             box-shadow: 0 4px 20px rgba(0,0,0,0.15);
@@ -28,24 +28,6 @@
         }
     }
 
-    // Header containing status/workflow buttons
-    > header {
-        border-bottom: 1px solid #cacaca;
-        .o-vertical-gradient(#fcfcfc, #dedede);
-        > button:not(.btn-primary):not(.btn-link):not(.oe_highlight) {
-            .btn-default;
-        }
-    }
-    &.o_form_nosheet {
-        padding: 16px;
-        &.oe_form_nomargin {
-            margin: 0;
-        }
-        > header {
-            margin: -16px -16px 0 -16px;
-        }
-    }
-
     // Button box
     .oe_button_box {
         width: 400px;

addons/web/static/src/xml/base.xml

@@ -492,52 +492,6 @@
         </tr>
     </table>
 </form>
-
-<t t-name="FormRenderingForm">
-    <div t-attf-class="#{classnames}">
-    </div>
-</t>
-<t t-name="FormRenderingSheet">
-    <div class="o_form_sheet_bg">
-        <div t-attf-class="o_form_sheet #{classnames}"/>
-    </div>
-</t>
-<div t-name="FormRenderingOuterGroup" class="o_group">
-    <t t-if="string" t-call="FormRenderingSeparator"/>
-</div>
-<table t-name="FormRenderingInnerGroup" class="o_group o_inner_group">
-    <t t-if="string">
-        <tr><td><t t-call="FormRenderingSeparator"/></td></tr>
-    </t>
-</table>
-<t t-name="FormRenderingNotebook">
-    <div class="o_notebook">
-        <ul t-attf-class="nav nav-tabs #{classnames}" role="tablist">
-            <li t-foreach="pages" t-as="page" t-att-modifiers="page.modifiers">
-                <a role="tab" t-attf-href="##{page.id}" t-att-accesskey="page.accesskey" data-toggle="tab" disable_anchor="true">
-                    <t t-esc="page.string"/>
-                </a>
-            </li>
-        </ul>
-        <div class="tab-content">
-            <div role="tabpanel" t-foreach="pages" t-as="page" t-attf-class="tab-pane #{classnames}" t-att-id="id">
-                <t t-raw="page.contents"/>
-            </div>
-        </div>
-    </div>
-</t>
-<t t-name="FormRenderingSeparator">
-    <div t-attf-class="o_horizontal_separator">
-        <t t-esc="string"/>
-    </div>
-</t>
-<t t-name="FormRenderingLabel">
-    <label t-att-for="_for"
-        t-attf-class="#{classnames} o_form_label #{help ? 'o_form_label_help ' : ''}">
-        <t t-esc="string"/>
-    </label>
-</t>
-
 <t t-name="GraphView.buttons">
     <div class="btn-group btn-group-sm" role="group">
         <button class="btn btn-primary btn-sm dropdown-toggle" data-toggle="dropdown">