[FIX] web: oe_button: don't override bootstrap rules

Remove the style defined on oe_button as it overrides bootstrap rules like
btn-primary, btn-default...

3 files changed, 28 insertions, 315 deletions

diff --git a/addons/web/static/src/css/base.css b/addons/web/static/src/css/base.css
index 637718e31d5..b235bd73094 100644
--- a/addons/web/static/src/css/base.css
+++ b/addons/web/static/src/css/base.css
@@ -192,78 +192,6 @@
   font-weight: bold;
   font-size: inherit;
 }
-.openerp a.button:link, .openerp a.button:visited, .openerp .oe_button, .openerp input[type='submit'] {
-  display: inline-block;
-  border: 1px solid rgba(0, 0, 0, 0.4);
-  color: #4c4c4c;
-  margin: 0;
-  padding: 3px 12px;
-  font-size: 13px;
-  text-align: center;
-  background-color: #e3e3e3;
-  background-image: -webkit-gradient(linear, left top, left bottom, from(#efefef), to(#d8d8d8));
-  background-image: -webkit-linear-gradient(top, #efefef, #d8d8d8);
-  background-image: -moz-linear-gradient(top, #efefef, #d8d8d8);
-  background-image: -ms-linear-gradient(top, #efefef, #d8d8d8);
-  background-image: -o-linear-gradient(top, #efefef, #d8d8d8);
-  background-image: linear-gradient(to bottom, #efefef, #d8d8d8);
-  -moz-border-radius: 3px;
-  -webkit-border-radius: 3px;
-  border-radius: 3px;
-  -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 1px rgba(255, 255, 255, 0.8) inset;
-  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 1px rgba(255, 255, 255, 0.8) inset;
-  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 1px rgba(255, 255, 255, 0.8) inset;
-  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.5);
-  -webkit-font-smoothing: antialiased;
-  outline: none;
-}
-.openerp a.button:hover, .openerp .oe_button:hover, .openerp input[type='submit']:hover {
-  background-color: #ececec;
-  background-image: -webkit-gradient(linear, left top, left bottom, from(#f6f6f6), to(#e3e3e3));
-  background-image: -webkit-linear-gradient(top, #f6f6f6, #e3e3e3);
-  background-image: -moz-linear-gradient(top, #f6f6f6, #e3e3e3);
-  background-image: -ms-linear-gradient(top, #f6f6f6, #e3e3e3);
-  background-image: -o-linear-gradient(top, #f6f6f6, #e3e3e3);
-  background-image: linear-gradient(to bottom, #f6f6f6, #e3e3e3);
-  cursor: pointer;
-  background-position: 0;
-}
-.openerp a.button:focus, .openerp .oe_button:focus, .openerp input[type='submit']:focus {
-  border: 1px solid #80bfff;
-  background-position: 0;
-  background-color: #ececec;
-  background-image: -webkit-gradient(linear, left top, left bottom, from(#f6f6f6), to(#e3e3e3));
-  background-image: -webkit-linear-gradient(top, #f6f6f6, #e3e3e3);
-  background-image: -moz-linear-gradient(top, #f6f6f6, #e3e3e3);
-  background-image: -ms-linear-gradient(top, #f6f6f6, #e3e3e3);
-  background-image: -o-linear-gradient(top, #f6f6f6, #e3e3e3);
-  background-image: linear-gradient(to bottom, #f6f6f6, #e3e3e3);
-  -moz-box-shadow: 0 0 3px #80bfff, 0 1px 1px rgba(255, 255, 255, 0.8) inset;
-  -webkit-box-shadow: 0 0 3px #80bfff, 0 1px 1px rgba(255, 255, 255, 0.8) inset;
-  box-shadow: 0 0 3px #80bfff, 0 1px 1px rgba(255, 255, 255, 0.8) inset;
-}
-.openerp a.button:active, .openerp a.button.active, .openerp .oe_button:active, .openerp .oe_button.active, .openerp input[type='submit']:active, .openerp input[type='submit'].active {
-  background-color: #ececec;
-  background-image: -webkit-gradient(linear, left top, left bottom, from(#e3e3e3), to(#f6f6f6));
-  background-image: -webkit-linear-gradient(top, #e3e3e3, #f6f6f6);
-  background-image: -moz-linear-gradient(top, #e3e3e3, #f6f6f6);
-  background-image: -ms-linear-gradient(top, #e3e3e3, #f6f6f6);
-  background-image: -o-linear-gradient(top, #e3e3e3, #f6f6f6);
-  background-image: linear-gradient(to bottom, #e3e3e3, #f6f6f6);
-  -moz-box-shadow: none;
-  -webkit-box-shadow: none;
-  box-shadow: none;
-}
-.openerp a.button.disabled, .openerp .oe_button:disabled, .openerp input[type='submit']:disabled {
-  background: #efefef !important;
-  border: 1px solid #d1d1d1 !important;
-  -moz-box-shadow: none !important;
-  -webkit-box-shadow: none !important;
-  box-shadow: none !important;
-  color: #aaa !important;
-  cursor: default;
-  text-shadow: 0 1px 1px #fff !important;
-}
 .openerp .ui-widget-content a {
   color: #7C7BAD;
 }
@@ -316,48 +244,9 @@
 .openerp .oe_inline {
   width: auto !important;
 }
-.openerp .oe_highlight {
-  color: white;
-  background: #DC5F59;
-}
-.openerp button.oe_highlight {
-  background-color: #5382b9;
-  background-image: -webkit-gradient(linear, left top, left bottom, from(#729fcf), to(#3465a4));
-  background-image: -webkit-linear-gradient(top, #729fcf, #3465a4);
-  background-image: -moz-linear-gradient(top, #729fcf, #3465a4);
-  background-image: -ms-linear-gradient(top, #729fcf, #3465a4);
-  background-image: -o-linear-gradient(top, #729fcf, #3465a4);
-  background-image: linear-gradient(to bottom, #729fcf, #3465a4);
-  -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 1px rgba(155, 155, 155, 0.4) inset;
-  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 1px rgba(155, 155, 155, 0.4) inset;
-  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 1px rgba(155, 155, 155, 0.4) inset;
-}
-.openerp button.oe_highlight:hover {
-  background-color: #3a699f;
-  background-image: -webkit-gradient(linear, left top, left bottom, from(#4c85c2), to(#284d7d));
-  background-image: -webkit-linear-gradient(top, #4c85c2, #284d7d);
-  background-image: -moz-linear-gradient(top, #4c85c2, #284d7d);
-  background-image: -ms-linear-gradient(top, #4c85c2, #284d7d);
-  background-image: -o-linear-gradient(top, #4c85c2, #284d7d);
-  background-image: linear-gradient(to bottom, #4c85c2, #284d7d);
-}
-.openerp button.oe_highlight:active {
-  background-color: #5d8cc3;
-  background-image: -webkit-gradient(linear, left top, left bottom, from(#81a9d4), to(#396fb3));
-  background-image: -webkit-linear-gradient(top, #81a9d4, #396fb3);
-  background-image: -moz-linear-gradient(top, #81a9d4, #396fb3);
-  background-image: -ms-linear-gradient(top, #81a9d4, #396fb3);
-  background-image: -o-linear-gradient(top, #81a9d4, #396fb3);
-  background-image: linear-gradient(to bottom, #81a9d4, #396fb3);
-}
 .openerp .oe_background_grey {
   background: #eee !important;
 }
-.openerp .oe_form_dirty .oe_highlight_on_dirty {
-  color: white;
-  background: #dc5f59;
-  font-weight: bold;
-}
 .openerp .oe_warning_redirect {
   border: none !important;
   padding: 0 !important;
@@ -375,7 +264,6 @@
   color: #666;
   margin: 0px -1px -1px 0px;
   padding: 0;
-  border: 1px solid #dddddd;
   border-radius: 0;
   box-shadow: none;
   background: white;
@@ -443,38 +331,6 @@
   max-width: 180px;
   max-height: 180px;
 }
-.openerp .oe_button.oe_link {
-  border: none;
-  padding: 0;
-  margin: 0;
-  background: none;
-  -moz-border-radius: 0;
-  -webkit-border-radius: 0;
-  border-radius: 0;
-  -moz-box-shadow: none;
-  -webkit-box-shadow: none;
-  box-shadow: none;
-}
-.openerp .oe_button.oe_link img {
-  display: inline-block;
-}
-.openerp .oe_button.oe_link span {
-  border: none;
-  padding: 0;
-  margin: 0;
-  background: none;
-  -moz-border-radius: 0;
-  -webkit-border-radius: 0;
-  border-radius: 0;
-  -moz-box-shadow: none;
-  -webkit-box-shadow: none;
-  box-shadow: none;
-  color: #7C7BAD;
-  font-weight: bold;
-}
-.openerp .oe_button.oe_link span:hover {
-  text-decoration: underline;
-}
 .openerp .oe_star_on, .openerp .oe_star_off {
   color: #cccccc;
   text-shadow: 0 0 2px black;
@@ -900,9 +756,6 @@
 .openerp .oe_about #social .social-lk:hover {
   color: #007bb6;
 }
-.openerp a.oe_form_uri:hover {
-  text-decoration: underline;
-}
 .openerp .oe_application {
   height: 100%;
   width: 100%;
@@ -1509,46 +1362,6 @@
   background-color: #F66 !important;
   border: 1px solid #D00 !important;
 }
-.openerp .oe_view_manager_current .oe_form_editable .oe_highlight {
-  color: #404040;
-  background: none;
-}
-.openerp .oe_view_manager_current .oe_form_editable button.oe_highlight {
-  background-color: #e3e3e3;
-  background-image: -webkit-gradient(linear, left top, left bottom, from(#efefef), to(#d8d8d8));
-  background-image: -webkit-linear-gradient(top, #efefef, #d8d8d8);
-  background-image: -moz-linear-gradient(top, #efefef, #d8d8d8);
-  background-image: -ms-linear-gradient(top, #efefef, #d8d8d8);
-  background-image: -o-linear-gradient(top, #efefef, #d8d8d8);
-  background-image: linear-gradient(to bottom, #efefef, #d8d8d8);
-  -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 1px rgba(255, 255, 255, 0.8) inset;
-  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 1px rgba(255, 255, 255, 0.8) inset;
-  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 1px rgba(255, 255, 255, 0.8) inset;
-}
-.openerp .oe_view_manager_current .oe_form_editable button.oe_highlight:active {
-  background-color: #ececec;
-  background-image: -webkit-gradient(linear, left top, left bottom, from(#e3e3e3), to(#f6f6f6));
-  background-image: -webkit-linear-gradient(top, #e3e3e3, #f6f6f6);
-  background-image: -moz-linear-gradient(top, #e3e3e3, #f6f6f6);
-  background-image: -ms-linear-gradient(top, #e3e3e3, #f6f6f6);
-  background-image: -o-linear-gradient(top, #e3e3e3, #f6f6f6);
-  background-image: linear-gradient(to bottom, #e3e3e3, #f6f6f6);
-  -moz-box-shadow: none;
-  -webkit-box-shadow: none;
-  box-shadow: none;
-}
-.openerp .oe_view_manager_current .oe_form_editable button.oe_highlight:hover {
-  background-color: #ececec;
-  background-image: -webkit-gradient(linear, left top, left bottom, from(#f6f6f6), to(#e3e3e3));
-  background-image: -webkit-linear-gradient(top, #f6f6f6, #e3e3e3);
-  background-image: -moz-linear-gradient(top, #f6f6f6, #e3e3e3);
-  background-image: -ms-linear-gradient(top, #f6f6f6, #e3e3e3);
-  background-image: -o-linear-gradient(top, #f6f6f6, #e3e3e3);
-  background-image: linear-gradient(to bottom, #f6f6f6, #e3e3e3);
-  -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 1px rgba(255, 255, 255, 0.8) inset;
-  -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 1px rgba(255, 255, 255, 0.8) inset;
-  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 1px rgba(255, 255, 255, 0.8) inset;
-}
 .openerp .o_form_invisible {
   display: none !important;
 }
@@ -1622,17 +1435,14 @@
   padding: 0 16px;
 }
 .openerp .oe_form > :not(.oe_form_nosheet) header, .openerp .oe_form > .oe_form_nosheet header {
-  padding-left: 2px;
+  padding-left: 14px;
 }
 .openerp .oe_form > :not(.oe_form_nosheet) header ul:not(.oe_tooltip_technical):not(.oe_dropdown_menu), .openerp .oe_form > .oe_form_nosheet header ul:not(.oe_tooltip_technical):not(.oe_dropdown_menu) {
   display: inline-block;
   float: right;
 }
-.openerp .oe_form > :not(.oe_form_nosheet) header .oe_button, .openerp .oe_form > .oe_form_nosheet header .oe_button {
-  margin: 3px 2px 1px;
-}
-.openerp .oe_form > :not(.oe_form_nosheet) header .oe_button:first-child, .openerp .oe_form > .oe_form_nosheet header .oe_button:first-child {
-  margin-left: 6px;
+.openerp .oe_form > :not(.oe_form_nosheet) header > button, .openerp .oe_form > .oe_form_nosheet header > button {
+  margin: 0 2px;
 }
 .openerp .oe_form header {
   border-bottom: 1px solid #cacaca;
@@ -2873,29 +2683,9 @@ body.oe_single_form .oe_single_form_container {
 .openerp_ie .oe_logo img {
   border: none;
 }
-.openerp_ie .oe_header_row button.oe_highlight {
-  padding-top: 0;
-  padding-bottom: 0;
-}
 .openerp_ie .oe_view_manager_view_kanban {
   display: table-cell;
 }
-.openerp_ie .oe_view_manager_buttons button.oe_write_full {
-  padding-top: 0;
-  padding-bottom: 0;
-}
-.openerp_ie .oe_view_manager_buttons button.oe_highlight {
-  padding-top: 0;
-  padding-bottom: 0;
-}
-.openerp_ie .oe_view_manager_buttons button .oe_form_button_edit {
-  padding-top: 0;
-  padding-bottom: 0;
-}
-.openerp_ie .oe_view_manager_buttons button .oe_form_button_create {
-  padding-top: 0;
-  padding-bottom: 0;
-}
 .openerp_ie .oe_kanban_image {
   border: none;
 }
diff --git a/addons/web/static/src/css/base.sass b/addons/web/static/src/css/base.sass
index 644cdb4081b..5b48b1dc8b4 100644
--- a/addons/web/static/src/css/base.sass
+++ b/addons/web/static/src/css/base.sass
@@ -266,45 +266,6 @@ $sheet-padding: 16px
         font-weight: bold
         font-size: inherit
     // }}}
-    // Button style {{{
-    a.button:link, a.button:visited, .oe_button, input[type='submit']
-        display: inline-block
-        border: 1px solid rgba(0,0,0,0.4)
-        color: #4c4c4c
-        margin: 0
-        padding: 3px 12px
-        font-size: 13px
-        text-align: center
-        @include vertical-gradient(#efefef, #d8d8d8)
-        @include radius(3px)
-        @include box-shadow((0 1px 2px rgba(0, 0, 0, .1), 0 1px 1px rgba(255, 255, 255, .8) inset))
-        text-shadow: 0 1px 1px rgba(255, 255, 255, .5)
-        -webkit-font-smoothing: antialiased
-        outline: none
-
-    a.button:hover,.oe_button:hover, input[type='submit']:hover
-        @include vertical-gradient(#f6f6f6, #e3e3e3)
-        cursor: pointer
-        background-position: 0
-
-    a.button:focus, .oe_button:focus, input[type='submit']:focus
-        border: 1px solid #80bfff
-        background-position: 0
-        @include vertical-gradient(#f6f6f6, #e3e3e3)
-        @include box-shadow((0 0 3px #80bfff, 0 1px 1px rgba(255, 255, 255, .8) inset))
-
-    a.button:active, a.button.active, .oe_button:active, .oe_button.active, input[type='submit']:active, input[type='submit'].active
-        @include vertical-gradient(#e3e3e3, #f6f6f6)
-        @include box-shadow(none)
-
-    a.button.disabled, .oe_button:disabled, input[type='submit']:disabled
-        background: #efefef !important
-        border: 1px solid #d1d1d1 !important
-        @include box-shadow(none !important)
-        color: #aaa !important
-        cursor: default
-        text-shadow: 0 1px 1px #fff !important
-    // }}}
     // Jquery ui Overrides {{{
     .ui-widget-content a
         color: $link-color
@@ -351,24 +312,9 @@ $sheet-padding: 16px
         font-weight: bold
     .oe_inline
         width: auto !important
-    .oe_highlight
-        color: white
-        background: #DC5F59
-    button.oe_highlight
-        @include vertical-gradient(#729fcf, #3465a4)
-        @include box-shadow((0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 1px rgba(155, 155, 155, 0.4) inset))
-    button.oe_highlight:hover
-        @include vertical-gradient(darken(#729fcf, 10%), darken(#3465a4, 10%))
-    button.oe_highlight:active
-        @include vertical-gradient(lighten(#729fcf, 4%), lighten(#3465a4, 4%))
     .oe_background_grey
         background: #eee !important
 
-    .oe_form_dirty
-        .oe_highlight_on_dirty
-            color: white
-            background: #dc5f59
-            font-weight: bold
     .oe_warning_redirect
         border: none !important
         padding: 0 !important
@@ -384,7 +330,6 @@ $sheet-padding: 16px
         color: #666
         margin: 0px -1px -1px 0px
         padding: 0
-        border: 1px solid #dddddd
         border-radius: 0
         box-shadow: none
         background: white
@@ -436,16 +381,6 @@ $sheet-padding: 16px
     .oe_image_medium > img
         max-width: 180px
         max-height: 180px
-    .oe_button.oe_link
-        @include reset()
-        img
-            display: inline-block
-        span
-            @include reset()
-            color: $link-color
-            font-weight: bold
-            &:hover
-                text-decoration: underline
     .oe_star_on, .oe_star_off
         color: #cccccc
         text-shadow: 0 0 2px black
@@ -793,8 +728,6 @@ $sheet-padding: 16px
                 color: #007bb6
     // }}}
     // ActionManager {{{
-    a.oe_form_uri:hover
-        text-decoration: underline
     .oe_application
         height: 100%
         width: 100%
@@ -1293,19 +1226,6 @@ $sheet-padding: 16px
         input, select, textarea
             background-color: #F66 !important
             border: 1px solid #D00 !important
-    .oe_view_manager_current .oe_form_editable
-        .oe_highlight
-            color: #404040
-            background: none
-        button.oe_highlight
-            @include vertical-gradient(#efefef, #d8d8d8)
-            @include box-shadow((0 1px 2px rgba(0, 0, 0, .1), 0 1px 1px rgba(255, 255, 255, .8) inset))
-        button.oe_highlight:active
-            @include vertical-gradient(#e3e3e3, #f6f6f6)
-            @include box-shadow(none)
-        button.oe_highlight:hover
-            @include vertical-gradient(#f6f6f6, #e3e3e3)
-            @include box-shadow((0 1px 2px rgba(0, 0, 0, .1), 0 1px 1px rgba(255, 255, 255, .8) inset))
     .o_form_invisible
         display: none !important
     .oe_form_editable
@@ -1368,14 +1288,12 @@ $sheet-padding: 16px
     // }}}
     // FormView.header {{{
     .oe_form > :not(.oe_form_nosheet) header, .oe_form > .oe_form_nosheet header
-        padding-left: 2px
+        padding-left: 14px
         ul:not(.oe_tooltip_technical):not(.oe_dropdown_menu)
             display: inline-block
             float: right
-        .oe_button
-            margin: 3px 2px 1px
-            &:first-child
-                margin-left: 6px
+        > button
+            margin: 0 2px
 
     .oe_form  header
         border-bottom: 1px solid #cacaca
@@ -2376,25 +2294,8 @@ body.oe_single_form
     .oe_logo
         img
             border: none
-    .oe_header_row
-        button.oe_highlight
-            padding-top: 0
-            padding-bottom: 0
     .oe_view_manager_view_kanban
         display: table-cell
-    .oe_view_manager_buttons
-        button.oe_write_full
-            padding-top: 0
-            padding-bottom: 0
-        button.oe_highlight
-            padding-top: 0
-            padding-bottom: 0
-        button .oe_form_button_edit
-            padding-top: 0
-            padding-bottom: 0
-        button .oe_form_button_create
-            padding-top: 0
-            padding-bottom: 0
     .oe_kanban_image
         border: none
     .oe_msg_icon
diff --git a/addons/web/static/src/less/enterprise_compatibility.less b/addons/web/static/src/less/enterprise_compatibility.less
index 5e2d23e5ac1..0b8ec808078 100644
--- a/addons/web/static/src/less/enterprise_compatibility.less
+++ b/addons/web/static/src/less/enterprise_compatibility.less
@@ -57,9 +57,31 @@
     background-color: white !important;
 }
 
+// Buttons and links
+@link-hover-decoration: none;
+.btn, .btn-group > .btn {
+    &:hover, &:active, &:focus, &:active:focus {
+        outline: none;
+    }
+}
 .btn-icon {
     .btn-default;
 }
+.oe_button {
+    .btn-default;
+    &.oe_highlight, &.btn-primary {
+        .btn-primary;
+    }
+    &.oe_link, &.btn-link {
+        .btn-link;
+    }
+}
+.oe_highlight {
+    .btn-primary;
+}
+.oe_link {
+    .btn-link;
+}
 
 .openerp .oe_avatar {
     float: left;