[IMP] kaban css improvement

bzr revid: al@openerp.com-20120518164413-7wzidpc6m71oz47s

2 files changed, 152 insertions, 14 deletions

diff --git a/addons/web/static/src/css/base.css b/addons/web/static/src/css/base.css
index 6f5296315ae..2f85065aa38 100644
--- a/addons/web/static/src/css/base.css
+++ b/addons/web/static/src/css/base.css
@@ -1,4 +1,4 @@
-@charset "UTF-8";
+@charset "utf-8";
 @font-face {
   font-family: "mnmliconsRegular";
   src: url("/web/static/src/font/mnmliconsv21-webfont.eot") format("eot");
@@ -1944,7 +1944,7 @@
 }
 .openerp .oe_kanban_view {
   position: absolute;
-  top: 110px;
+  top: 111px;
   bottom: 0;
 }
 .openerp .oe_kanban_groups {
@@ -1963,6 +1963,12 @@
   border-left: 1px solid #f0f8f8;
   border-right: 1px solid #b9b9b9;
 }
+.openerp .oe_kanban_column {
+  height: 100%;
+}
+.openerp .oe_kanban_aggregates {
+  padding: 0;
+}
 .openerp .oe_kanban_record {
   position: relative;
   display: block;
@@ -2002,6 +2008,94 @@
   -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
   -box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
 }
+.openerp .oe_kanban_view {
+  position: absolute;
+  top: 111px;
+  bottom: 0;
+}
+.openerp .oe_kanban_card {
+  position: relative;
+  display: block;
+  min-height: 50px;
+  background: white;
+  border: 1px solid #d8d8d8;
+  border-bottom-color: #b9b9b9;
+  padding: 6px;
+  margin: 6px 0;
+  display: block;
+  -moz-border-radius: 4px;
+  -webkit-border-radius: 4px;
+  border-radius: 4px;
+}
+.openerp .oe_kanban_card:last-child {
+  margin-bottom: 0;
+}
+.openerp .oe_kanban_card:hover {
+  -moz-box-shadow: 0 0 3px rgba(0, 0, 0, 0.6);
+  -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.6);
+  -box-shadow: 0 0 3px rgba(0, 0, 0, 0.6);
+}
+.openerp .oe_kanban_card:hover .oe_kanban_menuaction {
+  display: block;
+}
+.openerp .oe_kanban_card h3 {
+  margin: 0 16px 0 0;
+}
+.openerp .oe_kanban_star {
+  float: left;
+  position: inline-block;
+  margin: 0 4px 0 0;
+}
+.openerp a.oe_kanban_menuaction {
+  position: absolute;
+  right: 4px;
+  display: none;
+  color: #4c4c4c;
+  cursor: pointer;
+}
+.openerp a.oe_kanban_menuaction:hover {
+  text-decoration: none;
+}
+.openerp .oe_kanban_avatar {
+  -moz-border-radius: 4px;
+  -webkit-border-radius: 4px;
+  border-radius: 4px;
+  -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
+  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
+  -box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
+}
+.openerp .oe_kanban_status {
+  display: inline-block;
+  height: 12px;
+  width: 12px;
+  margin: 4px auto;
+  -moz-border-radius: 6px;
+  -webkit-border-radius: 6px;
+  border-radius: 6px;
+  -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.6);
+  -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.6);
+  -box-shadow: 0 1px 3px rgba(0, 0, 0, 0.6);
+}
+.openerp .oe_kanban_status_green {
+  background: green;
+  background-position: center center;
+  background-image: -webkit-radial-gradient(circle, #55dd55 0%, #44aa44 40%, #339933 100%);
+  background-image: -moz-radial-gradient(#55dd55 0%, #44aa44 40%, #339933 100%);
+  background-image: -ms-radial-gradient(#55dd55 0%, #44aa44 40%, #339933 100%);
+  background-image: radial-gradient(#55dd55 0%, #44aa44 40%, #339933 100%);
+}
+.openerp .oe_kanban_status_red {
+  background: red;
+  background-position: center center;
+  background-image: -webkit-radial-gradient(circle, #ee7777 0%, #cc3333 40%, #bb0808 100%);
+  background-image: -moz-radial-gradient(#ee7777 0%, #cc3333 40%, #bb0808 100%);
+  background-image: -ms-radial-gradient(#ee7777 0%, #cc3333 40%, #bb0808 100%);
+  background-image: radial-gradient(#ee7777 0%, #cc3333 40%, #bb0808 100%);
+}
+.openerp .oe_kanban_text_red {
+  background: red;
+  color: black;
+}
 .openerp .oe_trad_field.touched {
   border: 1px solid green !important;
 }
diff --git a/addons/web/static/src/css/base.sass b/addons/web/static/src/css/base.sass
index cba50aa6279..c5434d51ce4 100644
--- a/addons/web/static/src/css/base.sass
+++ b/addons/web/static/src/css/base.sass
@@ -853,18 +853,6 @@ $colour4: #8a89ba
             content: "k"
         .oe_vm_switch_diagram:after
             content: "f"
-        //.oe_vm_switch_list:after, .oe_vm_switch_tree:after
-            //content: "ö"
-        //.oe_vm_switch_graph:after
-            //content: "ó"
-        //.oe_vm_switch_gantt:after
-            //content: "y"
-        //.oe_vm_switch_calendar:after
-            //content: "b"
-        //.oe_vm_switch_kanban:after
-            //content: "ó"
-        //.oe_vm_switch_diagram:after
-            //content: "}"
     // }}}
     // ViewManager.sidebar {{{
     .oe_form_dropdown_section
@@ -1659,6 +1647,62 @@ $colour4: #8a89ba
         border-color: #e5e5e5 #dbdbdb #d2d2d2
         @include radius(3px)
         @include box-shadow(0 1px 2px rgba(0,0,0,0.2))
+    .oe_kanban_view
+        position: absolute
+        top: 111px
+        bottom: 0
+    .oe_kanban_card
+        position: relative
+        display: block
+        min-height: 50px
+        background: white
+        border: 1px solid #d8d8d8
+        border-bottom-color: #b9b9b9
+        padding: 6px
+        margin: 6px 0
+        display: block
+        @include radius(4px)
+        &:last-child
+            margin-bottom: 0
+        &:hover
+            @include box-shadow(0 0 3px rgba(0,0,0,0.6))
+            .oe_kanban_menuaction
+                display: block
+        h3
+            margin: 0 16px 0 0
+    .oe_kanban_star
+        float: left
+        position: inline-block
+        margin: 0 4px 0 0
+    a.oe_kanban_menuaction
+        position: absolute
+        right: 4px
+        display: none
+        color: #4c4c4c
+        cursor: pointer
+        &:hover
+            text-decoration: none
+    .oe_kanban_avatar
+        @include radius(4px)
+        @include box-shadow(0 1px 2px rgba(0,0,0,0.2))
+    //.oe_kanban_footer_left
+    //   float: left
+    .oe_kanban_status
+        display: inline-block
+        height: 12px
+        width: 12px
+        margin: 4px auto
+        @include radius(6px)
+        @include box-shadow(0 1px 3px rgba(0,0,0,0.6))
+    .oe_kanban_status_green
+        background: green
+        @include radial-gradient((#55dd55 0%, #44aa44 40%, #339933 100%))
+    .oe_kanban_status_red
+        background: red
+        @include radial-gradient((#ee7777 0%, #cc3333 40%, #bb0808 100%))
+    .oe_kanban_text_red
+        background: red
+        color: #000
     // }}}
     // Translation {{{
     .oe_trad_field.touched