diff --git a/addons/web/static/src/css/base.css b/addons/web/static/src/css/base.css
index a39838070cb..b9eb6fed93b 100644
--- a/addons/web/static/src/css/base.css
+++ b/addons/web/static/src/css/base.css
@@ -76,9 +76,10 @@
color: #4c4c4c;
font-size: 13px;
background: white;
+ text-shadow: 0 1px 1px rgba(255, 255, 255, 0.5);
/* http://www.quirksmode.org/dom/inputfile.html
* http://stackoverflow.com/questions/2855589/replace-input-type-file-by-an-image
- */
+ */ */
}
.openerp :-moz-placeholder {
color: #afafb6 !important;
@@ -159,7 +160,7 @@
.openerp a.button:link, .openerp a.button:visited, .openerp button, .openerp input[type='submit'], .openerp .ui-dialog-buttonpane .ui-dialog-buttonset .ui-button {
display: inline-block;
border: 1px solid #ababab;
- color: #404040;
+ color: #4c4c4c;
margin: 0;
padding: 3px 12px;
font-size: 13px;
@@ -1297,6 +1298,9 @@
.openerp .oe_view_manager table.oe_view_manager_header .oe_header_row:last-child td {
padding-top: 0;
}
+.openerp .oe_view_manager table.oe_view_manager_header .oe_header_row:first-child td {
+ padding-top: 8px;
+}
.openerp .oe_view_manager table.oe_view_manager_header .oe_view_manager_sidebar {
margin: 0px auto;
text-align: center;
@@ -1923,12 +1927,10 @@
width: auto;
}
.openerp .oe_form_nosheet {
- margin: 8px;
+ margin: 16px;
}
.openerp .oe_form_nosheet > header {
- margin-top: -8px;
- margin-left: -8px;
- margin-right: -8px;
+ margin: -16px -16px 0 -16px;
}
.openerp .oe_form header {
position: relative;
@@ -1940,8 +1942,7 @@
background-image: -ms-linear-gradient(top, #fcfcfc, #dedede);
background-image: -o-linear-gradient(top, #fcfcfc, #dedede);
background-image: linear-gradient(to bottom, #fcfcfc, #dedede);
- padding: 0 8px;
- line-height: 30px;
+ padding: 8px;
}
.openerp .oe_form header ul {
display: inline-block;
@@ -1951,6 +1952,7 @@
min-width: 650px;
max-width: 860px;
margin: 0 auto;
+ padding: 16px 0 48px;
}
.openerp .oe_form div.oe_form_configuration div.oe_horizontal_separator {
margin: 25px 0 10px 0;
@@ -1962,141 +1964,135 @@
.openerp .oe_form div.oe_form_configuration label {
min-width: 150px;
}
-.openerp ul.oe_form_steps {
- height: 30px;
- padding: 0;
- margin: 0;
- text-shadow: 0 1px 1px white;
+.openerp ul.oe_form_steps, .openerp ul.oe_form_steps_clickable {
+ display: inline-block;
+ padding-right: 18px;
}
-.openerp ul.oe_form_steps img {
- vertical-align: top;
- margin-left: 8px;
+.openerp ul.oe_form_steps li, .openerp ul.oe_form_steps_clickable li {
+ display: inline-block;
+ margin-right: -20px;
+ background-color: #fcfcfc;
+ background-image: -webkit-gradient(linear, left top, left bottom, from(#fcfcfc), to(#dedede));
+ background-image: -webkit-linear-gradient(top, #fcfcfc, #dedede);
+ background-image: -moz-linear-gradient(top, #fcfcfc, #dedede);
+ background-image: -ms-linear-gradient(top, #fcfcfc, #dedede);
+ background-image: -o-linear-gradient(top, #fcfcfc, #dedede);
+ background-image: linear-gradient(to bottom, #fcfcfc, #dedede);
}
-.openerp ul.oe_form_steps li {
- border-right: none;
- padding: 0;
- margin: 0;
- float: left;
- vertical-align: top;
- height: 30px;
- padding: 0 0 0 12px;
-}
-.openerp ul.oe_form_steps li:first-child {
+.openerp ul.oe_form_steps li:first-child .label, .openerp ul.oe_form_steps_clickable li:first-child .label {
border-left: 1px solid #cacaca;
+ padding-left: 14px;
}
-.openerp ul.oe_form_steps li:last-child {
- margin-right: 12px;
- padding-right: 12px;
+.openerp ul.oe_form_steps li:last-child, .openerp ul.oe_form_steps_clickable li:last-child {
border-right: 1px solid #cacaca;
}
-.openerp ul.oe_form_steps li a {
+.openerp ul.oe_form_steps li:last-child .label, .openerp ul.oe_form_steps_clickable li:last-child .label {
+ padding-right: 14px;
+}
+.openerp ul.oe_form_steps li:last-child .arrow, .openerp ul.oe_form_steps_clickable li:last-child .arrow {
+ display: none;
+}
+.openerp ul.oe_form_steps li .label, .openerp ul.oe_form_steps_clickable li .label {
color: #4c4c4c;
-}
-.openerp ul.oe_form_steps li a:hover {
- color: black;
-}
-.openerp ul.oe_form_steps .oe_form_steps_active {
- font-weight: bold;
- color: #b33630;
-}
-.openerp ul.oe_form_steps_clickable {
- height: 30px;
+ text-shadow: 0 1px 1px #fcfcfc, 0 -1px 1px #dedede;
+ padding: 7px;
+ display: inline-block;
+ padding-left: 24px;
margin: 0;
- padding: 0;
- text-shadow: 0 1px 1px #cacaca;
- box-shadow: 0 0 1px rgba(0, 0, 0, 0.5);
+ position: relative;
+ z-index: 10;
+}
+.openerp ul.oe_form_steps li .arrow, .openerp ul.oe_form_steps_clickable li .arrow {
+ width: 17px;
+ display: inline-block;
+ vertical-align: top;
overflow: hidden;
+ margin-left: -5px;
+}
+.openerp ul.oe_form_steps li .arrow span, .openerp ul.oe_form_steps_clickable li .arrow span {
+ position: relative;
+ z-index: 11;
+ width: 24px;
+ height: 24px;
+ display: inline-block;
+ margin-left: -12px;
+ margin-top: 3px;
+ box-shadow: -1px 1px 2px rgba(255, 255, 255, 0.2), inset -1px 1px 1px rgba(0, 0, 0, 0.2);
+ background-color: #dedede;
+ background: -moz-linear-gradient(135deg, #dedede, #fcfcfc);
+ background: -o-linear-gradient(135deg, #fcfcfc, #dedede);
+ background: -webkit-gradient(linear, left top, right bottom, from(#fcfcfc), to(#dedede));
+ -moz-border-radius: 3px;
+ -webkit-border-radius: 3px;
+ border-radius: 3px;
+ -moz-transform: rotate(45deg);
+ -webkit-transform: rotate(45deg);
+ -o-transform: rotate(45deg);
+ -ms-transform: rotate(45deg);
+}
+.openerp ul.oe_form_steps li.oe_active, .openerp ul.oe_form_steps_clickable li.oe_active {
+ background-color: #729fcf;
+ 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);
+}
+.openerp ul.oe_form_steps li.oe_active .arrow span, .openerp ul.oe_form_steps_clickable li.oe_active .arrow span {
+ background-color: #3465a4;
+ background: -moz-linear-gradient(135deg, #3465a4, #729fcf);
+ background: -o-linear-gradient(135deg, #729fcf, #3465a4);
+ background: -webkit-gradient(linear, left top, right bottom, from(#729fcf), to(#3465a4));
+}
+.openerp ul.oe_form_steps li.oe_active .label, .openerp ul.oe_form_steps_clickable li.oe_active .label {
+ color: white;
+ text-shadow: 0 1px 1px #729fcf, 0 -1px 1px #3465a4;
}
.openerp ul.oe_form_steps_clickable li {
- border-right: none;
- padding: 0 0 0 12px;
- position: relative;
- float: left;
- vertical-align: top;
- height: 30px;
- color: white;
-}
-.openerp ul.oe_form_steps_clickable li:after {
- content: " ";
- width: 0;
- height: 0;
- border-top: 21px solid transparent;
- border-bottom: 21px solid transparent;
- border-left: 5px solid #807fb4;
- position: absolute;
- top: 50%;
- margin-top: -21px;
- left: 100%;
- z-index: 2;
-}
-.openerp ul.oe_form_steps_clickable li:hover:after {
- border-left: 5px solid #807fb4;
-}
-.openerp ul.oe_form_steps_clickable li:before {
- content: " ";
- width: 0;
- height: 0;
- border-top: 21px solid transparent;
- border-bottom: 21px solid transparent;
- border-left: 5px solid white;
- position: absolute;
- top: 50%;
- margin-top: -21px;
- margin-left: 2px;
- left: 100%;
- z-index: 2;
-}
-.openerp ul.oe_form_steps_clickable li.oe_form_steps_active {
- font-weight: bold;
- text-shadow: 0 1px 1px #999999;
- box-shadow: inset 0 -1px 1px rgba(0, 0, 0, 0.25), inset 0 1px 1px rgba(255, 255, 255, 0.25);
- background-color: #dc5f59;
- background: -webkit-linear-gradient(top, #dc5f59, #b33630);
- color: white;
-}
-.openerp ul.oe_form_steps_clickable li.oe_form_steps_inactive {
cursor: pointer;
- box-shadow: inset 0 -1px 1px rgba(0, 0, 0, 0.25), inset 0 1px 1px rgba(255, 255, 255, 0.25);
- background-color: #adadcf;
- background: -webkit-linear-gradient(top, #adadcf, #7c7ba7);
}
-.openerp ul.oe_form_steps_clickable li.oe_form_steps_inactive div {
- padding: 0 30px 0 0;
+.openerp ul.oe_form_steps_clickable li:hover {
+ background-color: #e8e8e8;
+ background-image: -webkit-gradient(linear, left top, left bottom, from(#e8e8e8), to(#cacaca));
+ background-image: -webkit-linear-gradient(top, #e8e8e8, #cacaca);
+ background-image: -moz-linear-gradient(top, #e8e8e8, #cacaca);
+ background-image: -ms-linear-gradient(top, #e8e8e8, #cacaca);
+ background-image: -o-linear-gradient(top, #e8e8e8, #cacaca);
+ background-image: linear-gradient(to bottom, #e8e8e8, #cacaca);
}
-.openerp ul.oe_form_steps_clickable li.oe_form_steps_inactive:hover {
- background: -webkit-linear-gradient(top, #7c7ba7, #adadcf);
+.openerp ul.oe_form_steps_clickable li:hover .label {
+ text-shadow: 0 -1px 1px #fcfcfc, 0 1px 1px #dedede;
}
-.openerp ul.oe_form_steps_clickable li div {
- padding: 0 30px 0 0;
+.openerp ul.oe_form_steps_clickable li:hover .arrow span {
+ background-color: #e8e8e8;
+ background-image: -webkit-gradient(linear, left top, left bottom, from(#e8e8e8), to(#cacaca));
+ background-image: -webkit-linear-gradient(top, #e8e8e8, #cacaca);
+ background-image: -moz-linear-gradient(top, #e8e8e8, #cacaca);
+ background-image: -ms-linear-gradient(top, #e8e8e8, #cacaca);
+ background-image: -o-linear-gradient(top, #e8e8e8, #cacaca);
+ background-image: linear-gradient(to bottom, #e8e8e8, #cacaca);
}
-.openerp ul.oe_form_steps_clickable li.oe_form_steps_active:after {
- content: " ";
- display: block;
- width: 0;
- height: 0;
- border-top: 21px solid transparent;
- border-bottom: 21px solid transparent;
- border-left: 5px solid #b33630;
- position: absolute;
- top: 50%;
- margin-top: -21px;
- left: 100%;
- z-index: 2;
+.openerp ul.oe_form_steps_clickable li .label {
+ color: #8a89ba;
}
-.openerp ul.oe_form_steps_clickable li.oe_form_steps_active:before {
- content: " ";
- display: block;
- width: 0;
- height: 0;
- border-top: 21px solid transparent;
- border-bottom: 21px solid transparent;
- border-left: 5px solid white;
- position: absolute;
- top: 50%;
- margin-top: -21px;
- margin-left: 2px;
- left: 100%;
- z-index: 2;
+.openerp ul.oe_form_steps_clickable li.oe_active:hover {
+ background-color: #4c85c2;
+ 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 ul.oe_form_steps_clickable li.oe_active:hover .label {
+ text-shadow: 0 -1px 1px #729fcf, 0 1px 1px #3465a4;
+}
+.openerp ul.oe_form_steps_clickable li.oe_active:hover .arrow span {
+ background-color: #284d7d;
+ background: -moz-linear-gradient(135deg, #284d7d, #4c85c2);
+ background: -o-linear-gradient(135deg, #4c85c2, #284d7d);
+ background: -webkit-gradient(linear, left top, right bottom, from(#4c85c2), to(#284d7d));
}
.openerp .oe_form .oe_subtotal_footer {
width: 1% !important;
diff --git a/addons/web/static/src/css/base.sass b/addons/web/static/src/css/base.sass
index f1d1f2e9f1f..befb68b42db 100644
--- a/addons/web/static/src/css/base.sass
+++ b/addons/web/static/src/css/base.sass
@@ -88,6 +88,18 @@ $sheet-max-width: 860px
-ms-box-sizing: #{$type}-box
box-sizing: #{$type}-box
+@mixin skew-gradient($startColor: #555, $endColor: #333)
+ background-color: $endColor
+ background: -moz-linear-gradient(135deg, $endColor, $startColor)
+ background: -o-linear-gradient(135deg, $startColor, $endColor)
+ background: -webkit-gradient(linear, left top, right bottom, from($startColor), to($endColor))
+
+@mixin transform($transform)
+ -moz-transform: $transform
+ -webkit-transform: $transform
+ -o-transform: $transform
+ -ms-transform: $transform
+
// Transforms the (readable) text of an inline element into an mmlicons icon,
// allows for actual readable text in-code (and in readers?) with iconic looks
@mixin text-to-icon($icon-name, $color: #404040)
@@ -142,13 +154,14 @@ $sheet-max-width: 860px
color: #4c4c4c
font-size: 13px
background: white
+ text-shadow: 0 1px 1px rgba(255, 255, 255, 0.5)
// }}}
//Placeholder style{{{
\:-moz-placeholder
- color: $facets-border !important
+ color: $tag-border !important
font-style: italic !important
\::-webkit-input-placeholder
- color: $facets-border !important
+ color: $tag-border !important
font-style: italic !important
//}}}
// Tag reset {{{
@@ -161,7 +174,7 @@ $sheet-max-width: 860px
font-weight: bold
background-color: #f0f0f0
th
- border-right: 1px dotted $facets-border
+ border-right: 1px dotted $tag-border
&:last-child
border-right: none
th, td
@@ -196,7 +209,7 @@ $sheet-max-width: 860px
a.button:link, a.button:visited, button, input[type='submit'], .ui-dialog-buttonpane .ui-dialog-buttonset .ui-button
display: inline-block
border: 1px solid #ababab
- color: #404040
+ color: #4c4c4c
margin: 0
padding: 3px 12px
font-size: 13px
@@ -557,7 +570,7 @@ $sheet-max-width: 860px
top: 26px
left: 0
z-index: 1
- border: 1px solid $facets-border
+ border: 1px solid $tag-border
background: white
padding: 4px 0
min-width: 140px
@@ -837,7 +850,7 @@ $sheet-max-width: 860px
display: none
width: 220px
background: #f0eeee
- border-right: 1px solid $facets-border
+ border-right: 1px solid $tag-border
text-shadow: 0 1px 1px white
padding-bottom: 16px
a.oe_logo
@@ -1008,6 +1021,9 @@ $sheet-max-width: 860px
.oe_header_row:last-child
td
padding-top: 0
+ .oe_header_row:first-child
+ td
+ padding-top: 8px
.oe_view_manager_sidebar
margin: 0px auto
text-align: center
@@ -1278,7 +1294,7 @@ $sheet-max-width: 860px
background-color: white
min-width: 100%
display: none
- border: 1px solid $facets-border
+ border: 1px solid $tag-border
text-align: left
@include radius(4px)
@include box-shadow(0 1px 4px rgba(0,0,0,0.3))
@@ -1485,11 +1501,9 @@ $sheet-max-width: 860px
.oe_form .oe_form_field_date
width: auto
.oe_form_nosheet
- margin: 8px
- .oe_form_nosheet > header
- margin-top: -8px
- margin-left: -8px
- margin-right: -8px
+ margin: 16px
+ > header
+ margin: -16px -16px 0 -16px
// }}}
// FormView.custom tags and classes {{{
.oe_form
@@ -1497,8 +1511,8 @@ $sheet-max-width: 860px
position: relative
border-bottom: 1px solid #cacaca
@include vertical-gradient(#fcfcfc, #dedede)
- padding: 0 8px
- line-height: 30px
+ padding: 8px
+ //line-height: 30px
ul
display: inline-block
float: right
@@ -1506,6 +1520,7 @@ $sheet-max-width: 860px
min-width: 650px
max-width: $sheet-max-width
margin: 0 auto
+ padding: 16px 0 48px
div.oe_form_configuration
div.oe_horizontal_separator
margin: 25px 0 10px 0
@@ -1514,122 +1529,78 @@ $sheet-max-width: 860px
max-width: 650px
label
min-width: 150px
- ul.oe_form_steps
- height: 30px
- padding: 0
- margin: 0
- text-shadow: 0 1px 1px white
- img
- vertical-align: top
- margin-left: 8px
- li
- border-right: none
- padding: 0
- margin: 0
- float: left
- vertical-align: top
- height: 30px
- padding: 0 0 0 12px
- &:first-child
+
+
+ ul.oe_form_steps, ul.oe_form_steps_clickable
+ display: inline-block
+ padding-right: 18px
+ li
+ display: inline-block
+ margin-right: -20px
+ @include vertical-gradient(#fcfcfc, #dedede)
+ &:first-child .label
border-left: 1px solid #cacaca
+ padding-left: 14px
&:last-child
- margin-right: 12px
- padding-right: 12px
border-right: 1px solid #cacaca
- a
+ .label
+ padding-right: 14px
+ .arrow
+ display: none
+ .label
color: #4c4c4c
- &:hover
- color: black
- .oe_form_steps_active
- font-weight: bold
- color: #b33630
- ul.oe_form_steps_clickable
- height: 30px
- margin: 0
- padding: 0
- text-shadow: 0 1px 1px #cacaca
- box-shadow: 0 0 1px rgba(0,0,0,0.5)
- overflow: hidden
- li
- border-right: none
- padding: 0 0 0 12px
- position: relative
- float: left
- vertical-align: top
- height: 30px
- color: white
- &:after
- content: " "
- width: 0
- height: 0
- border-top: 21px solid transparent
- border-bottom: 21px solid transparent
- border-left: 5px solid #807fb4
- position: absolute
- top: 50%
- margin-top: -21px
- left: 100%
- z-index: 2
- &:hover:after
- border-left: 5px solid #807fb4
- &:before
- content: " "
- width: 0
- height: 0
- border-top: 21px solid transparent
- border-bottom: 21px solid transparent
- border-left: 5px solid white
- position: absolute
- top: 50%
- margin-top: -21px
- margin-left: 2px
- left: 100%
- z-index: 2
- &.oe_form_steps_active
- font-weight: bold
- text-shadow: 0 1px 1px #999999
- box-shadow: inset 0 -1px 1px rgba(0,0,0,0.25), inset 0 1px 1px rgba(255,255,255,0.25)
- background-color: #dc5f59
- background: -webkit-linear-gradient(top, #dc5f59, #b33630)
+ text-shadow: 0 1px 1px #fcfcfc, 0 -1px 1px #dedede
+ padding: 7px
+ display: inline-block
+ padding-left: 24px
+ margin: 0
+ position: relative
+ z-index: 10
+ .arrow
+ width: 17px
+ display: inline-block
+ vertical-align: top
+ overflow: hidden
+ margin-left: -5px
+ span
+ position: relative
+ z-index: 11
+ width: 24px
+ height: 24px
+ display: inline-block
+ margin-left: -12px
+ margin-top: 3px
+ box-shadow: -1px 1px 2px rgba(255,255,255,0.2), inset -1px 1px 1px rgba(0,0,0,0.2)
+ @include skew-gradient(#fcfcfc, #dedede)
+ @include radius(3px)
+ @include transform(rotate(45deg))
+ li.oe_active
+ @include vertical-gradient(#729fcf, #3465a4)
+ .arrow span
+ @include skew-gradient(#729fcf, #3465a4)
+ .label
color: white
- &.oe_form_steps_inactive
- cursor: pointer
- box-shadow: inset 0 -1px 1px rgba(0,0,0,0.25), inset 0 1px 1px rgba(255,255,255,0.25)
- background-color: #adadcf
- background: -webkit-linear-gradient(top, #adadcf, #7c7ba7)
- div
- padding: 0 30px 0 0
- &.oe_form_steps_inactive:hover
- background: -webkit-linear-gradient(top, #7c7ba7, #adadcf)
- div
- padding: 0 30px 0 0
- &.oe_form_steps_active:after
- content: " "
- display: block
- width: 0
- height: 0
- border-top: 21px solid transparent
- border-bottom: 21px solid transparent
- border-left: 5px solid #b33630
- position: absolute
- top: 50%
- margin-top: -21px
- left: 100%
- z-index: 2
- &.oe_form_steps_active:before
- content: " "
- display: block
- width: 0
- height: 0
- border-top: 21px solid transparent
- border-bottom: 21px solid transparent
- border-left: 5px solid white
- position: absolute
- top: 50%
- margin-top: -21px
- margin-left: 2px
- left: 100%
- z-index: 2
+ text-shadow: 0 1px 1px #729fcf, 0 -1px 1px #3465a4
+
+ ul.oe_form_steps_clickable
+ li
+ cursor: pointer
+ &:hover
+ @include vertical-gradient(darken(#fcfcfc, 8%), darken(#dedede, 8%))
+ .label
+ text-shadow: 0 -1px 1px #fcfcfc, 0 1px 1px #dedede
+ .arrow span
+ @include vertical-gradient(darken(#fcfcfc, 8%), darken(#dedede, 8%))
+ .label
+ color: $link-color
+ li.oe_active
+ &:hover
+ @include vertical-gradient(darken(#729fcf, 10%), darken(#3465a4, 10%))
+ .label
+ text-shadow: 0 -1px 1px #729fcf, 0 1px 1px #3465a4
+ .arrow span
+ @include skew-gradient(darken(#729fcf, 10%), darken(#3465a4, 10%))
+
.oe_form .oe_subtotal_footer
width: 1% !important
td.oe_form_group_cell
@@ -1663,7 +1634,7 @@ $sheet-max-width: 860px
background: white
min-height: 330px
padding: 16px
- border: 1px solid $facets-border
+ border: 1px solid $tag-border
@include box-shadow(0 0 10px rgba(0,0,0,0.3))
.ui-tabs
margin: 0 -16px
@@ -2098,7 +2069,7 @@ $sheet-max-width: 860px
border-bottom: 2px solid #cacaca
.treeview-tr, .treeview-td
cursor: pointer
- border-right: 1px dotted $facets-border
+ border-right: 1px dotted $tag-border
vertical-align: top
text-align: left
border-bottom: 1px solid #cfcccc
diff --git a/addons/web/static/src/js/view_form.js b/addons/web/static/src/js/view_form.js
index 208ee3c0edb..e2a254773ae 100644
--- a/addons/web/static/src/js/view_form.js
+++ b/addons/web/static/src/js/view_form.js
@@ -4790,7 +4790,7 @@ instance.web.form.FieldStatus = instance.web.form.AbstractField.extend({
if (this.clickable) {
this.$element.addClass("oe_form_steps_clickable");
$('.oe_form_steps_arrow').remove();
- var elemts = this.$element.find('.oe_form_steps_button');
+ var elemts = this.$element.find('li');
_.each(elemts, function(element){
$item = $(element);
if ($item.attr("data-id") != self.selected_value) {
diff --git a/addons/web/static/src/xml/base.xml b/addons/web/static/src/xml/base.xml
index ee5183d8e5c..8e6f7ffc3cb 100644
--- a/addons/web/static/src/xml/base.xml
+++ b/addons/web/static/src/xml/base.xml
@@ -1085,6 +1085,8 @@
+
+
@@ -1099,6 +1101,19 @@
+
+
+
+
+
+
+
+
+
+
+
+
+