[REF] web: allow adding custom stuff in kanban header

Previous kanban header was a div with `flex-flow: row nowrap`. So if
someone tried to add some stuff in it, it will be forced to stay on
the same row as the title and config buttons. This commit wraps these
row elements in a new div to allow kanban header customization (this
prepares for the kanban progressbars).

4 files changed, 29 insertions, 29 deletions

diff --git a/addons/web/static/src/js/views/kanban/kanban_column.js b/addons/web/static/src/js/views/kanban/kanban_column.js
index d22f4fe2fe9..ab071d0e930 100644
--- a/addons/web/static/src/js/views/kanban/kanban_column.js
+++ b/addons/web/static/src/js/views/kanban/kanban_column.js
@@ -86,7 +86,7 @@ var KanbanColumn = Widget.extend({
         for (var i = 0; i < this.data_records.length; i++) {
             this.addRecord(this.data_records[i], {no_update: true});
         }
-        this.$header.tooltip();
+        this.$header.find('.o_kanban_header_title').tooltip();
 
         if (config.device.size_class > config.device.SIZES.XS && this.draggable !== false) {
             // deactivate sortable in mobile mode.  It does not work anyway,
@@ -215,7 +215,7 @@ var KanbanColumn = Widget.extend({
         this.$el.toggleClass('o_column_folded', this.folded);
         var tooltip = this.size + _t(' records');
         tooltip = '<p>' + tooltip + '</p>' + this.tooltipInfo;
-        this.$header.tooltip({html: true}).attr('data-original-title', tooltip);
+        this.$header.find('.o_kanban_header_title').tooltip({html: true}).attr('data-original-title', tooltip);
         if (!this.remaining) {
             this.$('.o_kanban_load_more').remove();
         } else {
diff --git a/addons/web/static/src/js/views/kanban/kanban_renderer.js b/addons/web/static/src/js/views/kanban/kanban_renderer.js
index 0bbc7aa2698..5d7be3d3636 100644
--- a/addons/web/static/src/js/views/kanban/kanban_renderer.js
+++ b/addons/web/static/src/js/views/kanban/kanban_renderer.js
@@ -233,7 +233,7 @@ var KanbanRenderer = BasicRenderer.extend({
             this.$el.sortable({
                 axis: 'x',
                 items: '> .o_kanban_group',
-                handle: '.o_kanban_header',
+                handle: '.o_kanban_header_title',
                 cursor: 'move',
                 revert: 150,
                 delay: 100,
diff --git a/addons/web/static/src/less/kanban_view.less b/addons/web/static/src/less/kanban_view.less
index 8df393a6d51..e63bd357269 100644
--- a/addons/web/static/src/less/kanban_view.less
+++ b/addons/web/static/src/less/kanban_view.less
@@ -47,7 +47,7 @@
     padding: 0 @o-kanban-group-padding * 0.5;
     cursor: pointer;
 }
-.o-kanban-header() {
+.o-kanban-header-title() {
     .o-flex-display();
     height: 50px;
     line-height: 2.2;
@@ -485,8 +485,8 @@
         border-width: 0 1px;
         margin-left: -1px;
 
-        .o_kanban_header {
-            .o-kanban-header();
+        .o_kanban_header > .o_kanban_header_title {
+            .o-kanban-header-title();
 
             .o_column_title {
                 .o-flex(1, 1, auto);
@@ -544,7 +544,7 @@
         }
     }
 
-    &.ui-sortable .o_kanban_header {
+    &.ui-sortable .o_kanban_header_title {
         cursor: move;
     }
 
@@ -557,7 +557,7 @@
             margin-left: 1px;
         }
 
-        .o_kanban_header {
+        .o_kanban_header_title {
             position: relative;
             opacity: 0.5;
 
@@ -583,7 +583,7 @@
         .o-kanban-slim-col();
 
         .o_column_header {
-            .o-kanban-header();
+            .o-kanban-header-title();
             position: relative;
             opacity: 0.5;
 
diff --git a/addons/web/static/src/xml/kanban.xml b/addons/web/static/src/xml/kanban.xml
index 0da9033a976..c7e7c83e836 100644
--- a/addons/web/static/src/xml/kanban.xml
+++ b/addons/web/static/src/xml/kanban.xml
@@ -10,26 +10,26 @@
 
 <t t-name="KanbanView.Group">
     <div class="o_kanban_group" t-att-data-id="widget.id">
-        <div class="o_kanban_header" t-att-title="widget.data_records.length + ' records'" data-delay="500">
-            <span class="o_column_title"><t t-esc="widget.title"/></span>
-            <span class="o_column_unfold"><i class="fa fa-arrows-h"/></span>
-            <span class="o_kanban_config dropdown">
-                <a class="dropdown-toggle" data-toggle="dropdown" href="#"><i class="fa fa-gear"/></a>
-                <ul class="dropdown-menu" role="menu">
-                    <li><a class="o_kanban_toggle_fold" href="#">Fold</a></li>
-                    <t t-if="widget.grouped_by_m2o">
-                        <li t-if="widget.editable and widget.id"><a class="o_column_edit" href="#">Edit Stage</a></li>
-                        <li t-if="widget.deletable and widget.id"><a class="o_column_delete" href="#">Delete</a></li>
-                    </t>
-                    <t t-if="widget.has_active_field">
-                        <li><a class="o_column_archive" href="#">Archive Records</a></li>
-                        <li><a class="o_column_unarchive" href="#">Restore Records</a></li>
-                    </t>
-                </ul>
-            </span>
-            <t t-if="widget.quick_create">
-                <span class="o_kanban_quick_add"><i class="fa fa-plus"/></span>
-            </t>
+        <div class="o_kanban_header">
+            <div class="o_kanban_header_title" t-att-title="widget.data_records.length + ' records'" data-delay="500">
+                <span class="o_column_title"><t t-esc="widget.title"/></span>
+                <span class="o_column_unfold"><i class="fa fa-arrows-h"/></span>
+                <span class="o_kanban_config dropdown">
+                    <a class="dropdown-toggle" data-toggle="dropdown" href="#"><i class="fa fa-gear"/></a>
+                    <ul class="dropdown-menu" role="menu">
+                        <li><a class="o_kanban_toggle_fold" href="#">Fold</a></li>
+                        <t t-if="widget.grouped_by_m2o">
+                            <li t-if="widget.editable and widget.id"><a class="o_column_edit" href="#">Edit Stage</a></li>
+                            <li t-if="widget.deletable and widget.id"><a class="o_column_delete" href="#">Delete</a></li>
+                        </t>
+                        <t t-if="widget.has_active_field">
+                            <li><a class="o_column_archive" href="#">Archive Records</a></li>
+                            <li><a class="o_column_unarchive" href="#">Restore Records</a></li>
+                        </t>
+                    </ul>
+                </span>
+                <span t-if="widget.quick_create" class="o_kanban_quick_add"><i class="fa fa-plus"/></span>
+            </div>
         </div>
         <div t-if="widget.remaining > 0" class="o_kanban_load_more">
             <t t-call="KanbanView.LoadMore"/>