From f3dc8010809700ff2b64818ed11e85bacf46ff73 Mon Sep 17 00:00:00 2001
From: Aaron Bohy <aab@odoo.com>
Date: Fri, 7 Aug 2015 12:25:21 +0200
Subject: [PATCH] [IMP] web_kanban: fine tuning

- scroll to the right when adding a new column
- apply style on column quick create card
- darken background color of odd columns in grouped mode
- remove some unused rules
---
 .../src/less/enterprise_compatibility.less    | 33 +++++++++----------
 .../static/src/js/kanban_quick_create.js      |  1 +
 .../web_kanban/static/src/js/kanban_view.js   |  1 +
 .../static/src/less/kanban_view.less          | 31 ++++++++---------
 4 files changed, 31 insertions(+), 35 deletions(-)

diff --git a/addons/web/static/src/less/enterprise_compatibility.less b/addons/web/static/src/less/enterprise_compatibility.less
index 14d15250c62..3740c48ec27 100644
--- a/addons/web/static/src/less/enterprise_compatibility.less
+++ b/addons/web/static/src/less/enterprise_compatibility.less
@@ -16,43 +16,40 @@
 @odoo-horizontal-padding: 16px;
 @odoo-list-grey: #e2e2e0;  // FIXME: listview thead background color
 @odoo-main-color-muted: #a8a8a8;
-@odoo-main-text-color: #666666;
-@odoo-webclient-background-color: @odoo-brand-secondary;
+@odoo-main-text-color: #555555;
+@odoo-webclient-background-color: #F0EEEE;
 @odoo-view-background-color: white;
 @odoo-shadow-color: #303030;
 @brand-primary: @odoo-brand-primary;
 
 .oe-view-manager {
-    background-color: #f0eeee !important;
+    background-color: @odoo-webclient-background-color !important;
 }
 
 .o_kanban_view {
-    background-color: #f0eeee;
-    .o_kanban_header {
-        color: black !important;
-    }
+    background-color: @odoo-webclient-background-color;
 
     .o_kanban_config i, .o_kanban_quick_add i {
-        color: #555 !important;
+        color: @odoo-main-text-color !important;
         &:hover {
-            background-color: darken(#f0eeee, 10%) !important;
+            background-color: darken(@odoo-webclient-background-color, 10%) !important;
         }
     }
+    .o_column_title, .o_kanban_title, .o_kanban_add_column, .o_column_unfold {
+        color: @odoo-main-text-color !important;
+    }
 
     .o_column_folded {
-        background-color: #f0eeee !important;
-        border: none !important;
-        span.o_column_title, span.o_column_unfold {
-            // color: white !important;
-        }
+        background-color: darken(@odoo-webclient-background-color, 5%) !important;
+        border-color: darken(@odoo-webclient-background-color, 10%) !important;
     }
 
     .o_column_quick_create {
-        background-color: #f0eeee !important;
-        .o_kanban_add_column, .o_kanban_title {
-            color: black !important;
-        }
+        background-color: darken(@odoo-webclient-background-color, 10%) !important;
+    }
 
+    .o_kanban_header {
+        margin-bottom: 2px; // For the buttons not to overlap first record's box shaddow on hover
     }
 }
 
diff --git a/addons/web_kanban/static/src/js/kanban_quick_create.js b/addons/web_kanban/static/src/js/kanban_quick_create.js
index b6c66bc53f2..9970d738807 100644
--- a/addons/web_kanban/static/src/js/kanban_quick_create.js
+++ b/addons/web_kanban/static/src/js/kanban_quick_create.js
@@ -100,6 +100,7 @@ var ColumnQuickCreate = Widget.extend({
         this.update();
         if (!this.folded) {
             this.$input.focus();
+            this.trigger_up('scrollTo', {selector: '.o_column_quick_create'});
         }
     },
 
diff --git a/addons/web_kanban/static/src/js/kanban_view.js b/addons/web_kanban/static/src/js/kanban_view.js
index fe97b1c6814..50fe3bdeb9b 100644
--- a/addons/web_kanban/static/src/js/kanban_view.js
+++ b/addons/web_kanban/static/src/js/kanban_view.js
@@ -665,6 +665,7 @@ var KanbanView = View.extend({
             var column = new KanbanColumn(self, group_data, options, record_options);
             column.insertBefore(self.$('.o_column_quick_create'));
             self.widgets.push(column);
+            self.trigger_up('scrollTo', {selector: '.o_column_quick_create'});
         });
     },
 
diff --git a/addons/web_kanban/static/src/less/kanban_view.less b/addons/web_kanban/static/src/less/kanban_view.less
index b42d963c3f8..481fc77d384 100644
--- a/addons/web_kanban/static/src/less/kanban_view.less
+++ b/addons/web_kanban/static/src/less/kanban_view.less
@@ -116,6 +116,15 @@
         }
     }
 
+    .o_kanban_quick_create {
+        margin: 0 @o-kanban-record-margin 8px @o-kanban-record-margin;
+        padding: 3px;
+        input {
+            width: 100%;
+            margin: 4px 0;
+        }
+    }
+
     .o_kanban_group {
         .o-flex(0, 0, auto);
         margin: 0 4px;
@@ -123,15 +132,6 @@
             width: @o-kanban-default-record-width + 2*@o-kanban-record-margin;
         }
 
-        .o_kanban_quick_create {
-            margin: 0 @o-kanban-record-margin 8px @o-kanban-record-margin;
-            padding: 3px;
-            input {
-                width: 100%;
-                margin: 4px 0;
-            }
-        }
-
         .o_kanban_header + .o_kanban_record {
             margin-top: 0;  // no margin top from the first card after kanban_header
         }
@@ -229,20 +229,13 @@
             }
         }
 
-        &.o_kanban_dragged {
-            > * {
-                visibility: hidden;
-            }
-            background-color: @odoo-main-text-color;
-        }
-
         &.oe_kanban_global_click, &.oe_kanban_global_click_edit {
             cursor: pointer;
         }
 
         &.ui-sortable-helper {
             transform: rotate(3deg);
-            opacity: 0.9,
+            opacity: 0.9;
         }
 
         &.o_kanban_two_column_tags {
@@ -353,6 +346,10 @@
     }
 
     .o_kanban_group {
+        &:nth-child(odd) {
+            background-color: darken(@odoo-webclient-background-color, 3%);
+        }
+
         &.o_kanban_dragged {
             background-color: @odoo-main-text-color;
             .o_kanban_record {