addons/web/static/src/css/base.sass

   1 @charset "utf-8"
   2
   3 // Variables {{{
   4 $facets-border: #afafb6
   5 $section-title-color: #7C7BAD
   6 $tag-bg-light: #f0f0fa
   7 $tag-bg-dark: #7C7BAD
   8 $tag-border: #afafb6
   9 $tag-border-selected: #a6a6fe
  10 $hover-background: #f0f0fa
  11 $link-color: #7C7BAD
  12 $sheet-max-width: 860px
  13 $sheet-min-width: 650px
  14 $sheet-padding: 16px
  15 // }}}
  16 // Mixins {{{
  17 @font-face
  18     font-family: 'mnmliconsRegular'
  19     src: url('/web/static/src/font/mnmliconsv21-webfont.eot') format('eot')
  20     src: url('/web/static/src/font/mnmliconsv21-webfont.woff') format('woff')
  21     src: url('/web/static/src/font/mnmliconsv21-webfont.ttf') format('truetype')
  22     src: url('/web/static/src/font/mnmliconsv21-webfont.svg') format('svg') active
  23     font-weight: normal
  24     font-style: normal
  25
  26 @font-face
  27     font-family: 'EntypoRegular'
  28     src: url('/web/static/src/font/entypo-webfont.eot') format('eot')
  29     src: url('/web/static/src/font/entypo-webfont.eot?#iefix') format('embedded-opentype')
  30     src: url('/web/static/src/font/entypo-webfont.woff') format('woff')
  31     src: url('/web/static/src/font/entypo-webfont.ttf') format('truetype')
  32     src: url('/web/static/src/font/entypo-webfont.svg') format('svg') active
  33     font-weight: normal
  34     font-style: normal
  35
  36 @mixin reset()
  37     border: none
  38     padding: 0
  39     margin: 0
  40     background: none
  41     @include radius(0)
  42     @include box-shadow(none)
  43
  44 @mixin vertical-gradient($startColor: #555, $endColor: #333)
  45     background-color: mix($startColor, $endColor)
  46     background-image: -webkit-gradient(linear, left top, left bottom, from($startColor), to($endColor)) /* Saf4+, Chrome */
  47     background-image: -webkit-linear-gradient(top, $startColor, $endColor) /* Chrome 10+, Saf5.1+, iOS 5+ */
  48     background-image:    -moz-linear-gradient(top, $startColor, $endColor) /* FF3.6 */
  49     background-image:     -ms-linear-gradient(top, $startColor, $endColor) /* IE10 */
  50     background-image:      -o-linear-gradient(top, $startColor, $endColor) /* Opera 11.10+ */
  51     background-image:         linear-gradient(to bottom, $startColor, $endColor)
  52
  53 @mixin radial-gradient($gradient)
  54     background-position: center center
  55     background-image: -webkit-radial-gradient(circle, $gradient)
  56     background-image: -moz-radial-gradient($gradient)
  57     background-image: -ms-radial-gradient($gradient)
  58     background-image: radial-gradient(circle, $gradient)
  59
  60 @mixin radius($radius: 5px)
  61     -moz-border-radius: $radius
  62     -webkit-border-radius: $radius
  63     border-radius: $radius
  64
  65 @mixin box-shadow($bsval: 0px 1px 4px #777)
  66     -moz-box-shadow: $bsval
  67     -webkit-box-shadow: $bsval
  68     box-shadow: $bsval
  69
  70 @mixin transition($transval: (border linear 0.2s, box-shadow linear 0.2s))
  71     -webkit-transition: $transval
  72     -moz-transition: $transval
  73     -ms-transition: $transval
  74     -o-transition: $transval
  75     transition: $transval
  76
  77 @mixin opacity($opacity: .5)
  78     filter: alpha(opacity=$opacity * 100)
  79     opacity: $opacity
  80
  81 @mixin background-clip($clip: padding-box)
  82     -webkit-background-clip: $clip
  83     -moz-background-clip: $clip
  84     background-clip: $clip
  85
  86 @mixin box-sizing($type: content)
  87     // type = border || content || padding
  88     -webkit-box-sizing: #{$type}-box
  89     -moz-box-sizing: #{$type}-box
  90     -ms-box-sizing: #{$type}-box
  91     box-sizing: #{$type}-box
  92
  93 @mixin skew-gradient($startColor: #555, $endColor: #333)
  94     background-color: $endColor
  95     background: -moz-linear-gradient(135deg, $endColor, $startColor)
  96     background: -o-linear-gradient(135deg, $startColor, $endColor)
  97     background: -webkit-gradient(linear, left top, right bottom, from($startColor), to($endColor))
  98     background: -ms-linear-gradient(top, $startColor, $endColor) /* IE10 */
  99
 100 @mixin transform($transform)
 101     -webkit-transform: $transform
 102     -moz-transform: $transform
 103     -ms-transform: $transform
 104     -o-transform: $transform
 105     transform: $transform
 106
 107 @mixin keyframes($name)
 108     @-webkit-keyframes #{$name}
 109         @content
 110     @-moz-keyframes #{$name}
 111         @content
 112     @-ms-keyframes #{$name}
 113         @content
 114     @-o-keyframes #{$name}
 115         @content
 116     @keyframes #{$name}
 117         @content
 118
 119
 120 // Transforms the (readable) text of an inline element into an mmlicons icon,
 121 // allows for actual readable text in-code (and in readers?) with iconic looks
 122 @mixin text-to-icon($icon-name, $color: #404040)
 123     font-size: 1px
 124     letter-spacing: -1px
 125     color: transparent
 126     text-shadow: none
 127     font-weight: normal
 128     &:before
 129         font: 21px "mnmliconsRegular"
 130         content: $icon-name
 131         color: $color
 132
 133 @mixin text-to-entypo-icon($icon-name, $color: #404040, $size: 21px)
 134     font-size: 1px
 135     letter-spacing: -1px
 136     color: transparent
 137     text-shadow: none
 138     font-weight: normal
 139     &:before
 140         font: $size "entypoRegular"
 141         content: $icon-name
 142         color: $color
 143
 144 // }}}
 145
 146 #oe_main_menu_navbar
 147     min-height: 34px
 148     z-index: 1001
 149     border-radius: 0
 150     li a, li button
 151         padding: 4px 8px 4px 8px
 152         margin-top: 2px
 153         font-size: 13px
 154     .oe_topbar_avatar
 155         max-height: 18px
 156         width: auto
 157
 158 #oe_main_menu_navbar.navbar
 159     margin-bottom: 0px
 160
 161 .oe_systray
 162     margin-right: 0px !important
 163
 164 // Notifications {{{
 165 .oe_notification
 166     z-index: 1600
 167
 168 .oe_webclient_timezone_notification
 169     a
 170         color: white
 171         text-decoration: underline
 172     p
 173         margin-top: 1em
 174     dt
 175         font-weight: bold
 176 .oe_timezone_systray
 177     span
 178         margin-top: 1px
 179         background-color: #f6cf3b
 180 // }}}
 181 // Top Menu {{{
 182 .navbar
 183     .oe_topbar_name
 184         max-width: 150px
 185         display: inline-block
 186         height: 15px // Customize to manage caret when topbar_name is over sized.
 187         text-overflow: ellipsis
 188         white-space: nowrap
 189         overflow: hidden // Customize to bring ellipsis when topbar_name is over sized.
 190 // }}}
 191
 192 .openerp
 193     // Global style {{{
 194     padding: 0
 195     margin: 0
 196     font-family: "Lucida Grande", Helvetica, Verdana, Arial, sans-serif
 197     color: #4c4c4c
 198     font-size: 13px
 199     background: white
 200     &.openerp_webclient_container
 201         height: 95%
 202         height: -webkit-calc(100% - 34px)
 203         height: calc(100% - 34px)
 204         display: -ms-flexbox
 205         display: -webkit-flex
 206         display: flex
 207     @media (max-width: 768px)
 208         &.openerp_webclient_container
 209             height: 95%
 210             height: -webkit-calc(100% - 52px)
 211             height: calc(100% - 52px)
 212     // }}}
 213     //Placeholder style{{{
 214     \:-moz-placeholder
 215         color: $tag-border !important
 216         font-style: italic !important
 217     \::-webkit-input-placeholder
 218         color: $tag-border !important
 219         font-style: italic !important
 220     \:-ms-input-placeholder
 221         color: $tag-border !important
 222         font-style: italic !important
 223     //}}}
 224     // Tag reset {{{
 225     a
 226         text-decoration: none
 227         cursor: pointer !important
 228     table
 229         padding: 0
 230         border-collapse: collapse
 231     thead
 232         font-weight: bold
 233         background-color: #f0f0f0
 234         th
 235             border-left: 1px solid #dfdfdf
 236             &:first-child
 237                 border-left: none
 238             &.null
 239                 border-left: none
 240     th, td
 241         padding: 0
 242         text-align: left
 243     th
 244         font-weight: bold
 245         vertical-align: middle
 246     td
 247         vertical-align: top
 248     .oe_title
 249         float: left
 250     .oe_title:after
 251         content: "."
 252         display: block
 253         height: 0
 254         clear: both
 255         visibility: hidden
 256     .oe_form_group
 257         clear: both
 258     .zebra tbody tr:nth-child(odd) td
 259         background-color: #f0f0fa
 260         @include vertical-gradient(#f0f0fa, #eeeef6)
 261     .zebra tbody tr:hover td
 262         @include vertical-gradient(#eee, #dedede)
 263     input, textarea, select
 264         padding: 2px 4px
 265         border: 1px solid #ccc
 266         @include radius(3px)
 267         background: white
 268     img
 269         vertical-align: middle
 270     h4
 271         margin: 4px 0
 272         font-weight: bold
 273         font-size: inherit
 274     // }}}
 275     // Button style {{{
 276     a.button:link, a.button:visited, .oe_button, input[type='submit']
 277         display: inline-block
 278         border: 1px solid rgba(0,0,0,0.4)
 279         color: #4c4c4c
 280         margin: 0
 281         padding: 3px 12px
 282         font-size: 13px
 283         text-align: center
 284         @include vertical-gradient(#efefef, #d8d8d8)
 285         @include radius(3px)
 286         @include box-shadow((0 1px 2px rgba(0, 0, 0, .1), 0 1px 1px rgba(255, 255, 255, .8) inset))
 287         text-shadow: 0 1px 1px rgba(255, 255, 255, .5)
 288         -webkit-font-smoothing: antialiased
 289         outline: none
 290
 291     a.button:hover,.oe_button:hover, input[type='submit']:hover
 292         @include vertical-gradient(#f6f6f6, #e3e3e3)
 293         cursor: pointer
 294         background-position: 0
 295
 296     a.button:focus, .oe_button:focus, input[type='submit']:focus
 297         border: 1px solid #80bfff
 298         background-position: 0
 299         @include vertical-gradient(#f6f6f6, #e3e3e3)
 300         @include box-shadow((0 0 3px #80bfff, 0 1px 1px rgba(255, 255, 255, .8) inset))
 301
 302     a.button:active, a.button.active, .oe_button:active, .oe_button.active, input[type='submit']:active, input[type='submit'].active
 303         @include vertical-gradient(#e3e3e3, #f6f6f6)
 304         @include box-shadow(none)
 305
 306     a.button.disabled, .oe_button:disabled, input[type='submit']:disabled
 307         background: #efefef !important
 308         border: 1px solid #d1d1d1 !important
 309         @include box-shadow(none !important)
 310         color: #aaa !important
 311         cursor: default
 312         text-shadow: 0 1px 1px #fff !important
 313     // }}}
 314     // Jquery ui Overrides {{{
 315     .ui-widget-content a
 316         color: $link-color
 317     .oe_bounce_container
 318         display: inline-block
 319
 320     // Bug lp:1051746
 321     .text-tag .text-button
 322         height: auto !important
 323         min-height: 16px
 324
 325     // bug noted in jquery ui CSS doesn't seem to occur in IE9,
 326     // so remove position:relative
 327     .ui-tabs
 328         position: static
 329
 330     // }}}
 331     // Generic classes {{{
 332     .oe_i
 333         font-family: "mnmliconsRegular" !important
 334         font-size: 21px
 335         font-weight: 300 !important
 336     .oe_e
 337         font-family: "entypoRegular" !important
 338         font-size: 34px
 339         font-weight: 300 !important
 340         line-height: 100%
 341     .oe_left
 342         float: left
 343         margin-right: 8px
 344         width: 305px
 345     .oe_right
 346         float: right
 347         margin-left: 8px
 348     .oe_text_center
 349         text-align: center
 350     .oe_text_left
 351         text-align: left
 352     .oe_text_right
 353         text-align: right
 354     .oe_clear
 355         clear: both
 356     .oe_wait
 357         cursor: wait
 358     .oe_fade
 359         color: #888
 360         font-weight: normal
 361     .oe_bold
 362         font-weight: bold
 363     .oe_inline
 364         width: auto !important
 365     .oe_highlight
 366         color: white
 367         background: #DC5F59
 368     button.oe_highlight
 369         @include vertical-gradient(#df3f3f, #a21a1a)
 370         @include box-shadow((0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 1px rgba(155, 155, 155, 0.4) inset))
 371     button.oe_highlight:hover
 372         @include vertical-gradient(lighten(#e04f4f, 2%), lighten(#a21a1a, 2%))
 373     button.oe_highlight:active
 374         @include vertical-gradient(lighten(#a21a1a, 8%), darken(#df3f3f, 8%))
 375     .oe_background_grey
 376         background: #eee !important
 377
 378     .oe_form_dirty
 379         .oe_highlight_on_dirty
 380             color: white
 381             background: #dc5f59
 382             font-weight: bold
 383         button.oe_highlight_on_dirty
 384             @include vertical-gradient(#dc5f59, #b33630)
 385             @include box-shadow(none)
 386             &:hover
 387                 background: #ED6F6A
 388     .oe_warning_redirect
 389         border: none !important
 390         padding: 0 !important
 391         margin-left: 20px !important
 392         background: #f5f7f9 !important
 393         box-shadow: none !important
 394         &:hover
 395             text-decoration: underline !important
 396     .oe_stat_button
 397         font-weight: normal
 398         width: 132px !important
 399         height: 40px
 400         color: #666
 401         margin: 0px -1px -1px 0px
 402         padding: 0
 403         border: 1px solid #dddddd
 404         border-radius: 0
 405         box-shadow: none
 406         background: white
 407         > div
 408             display: table-cell
 409             vertical-align: middle
 410             text-align: left
 411             padding: 0
 412             line-height: 120%
 413         .stat_button_icon
 414             color: #7C7BAD
 415             font-size: 24px
 416             padding: 0px 3px
 417             width: 37px
 418             text-align: center
 419         .oe_form_field_percent_pie
 420             width: 42px
 421         .oe_form_field_bar_chart
 422             width: 42px
 423         svg
 424             width: 38px
 425             height: 38px
 426             display: inline
 427             vertical-align: middle
 428     .oe_stat_button:hover
 429         background: #7c7bad
 430         color: white
 431         .fa
 432             color: white
 433     .oe_button_box
 434         width: 400px
 435         text-align: right
 436         .oe_stat_button
 437             display: inline-table
 438     .oe_avatar
 439         > img
 440             max-height: 90px
 441             max-width: 90px
 442             @include radius(3px)
 443             @include box-shadow(0 1px 4px rgba(0, 0, 0, 0.4))
 444             border: none
 445             margin-bottom: 10px
 446     .oe_avatar + div
 447         margin-left: 5px
 448     .oe_image_small > img
 449         max-width: 50px
 450         max-height: 50px
 451     .oe_image_medium > img
 452         max-width: 180px
 453         max-height: 180px
 454     .oe_button.oe_link
 455         @include reset()
 456         img
 457             display: inline-block
 458         span
 459             @include reset()
 460             color: $link-color
 461             font-weight: bold
 462             &:hover
 463                 text-decoration: underline
 464     .oe_star_on, .oe_star_off
 465         color: #cccccc
 466         text-shadow: 0 0 2px black
 467         vertical-align: top
 468         position: relative
 469         top: -8px
 470     .oe_star_on:hover, .oe_star_off:hover
 471         text-decoration: none
 472     .oe_star_on
 473         color: gold
 474     p.oe_grey
 475         max-width: 650px
 476     .oe_grey
 477         color: #aaa
 478     // Added for generic error message and customize bootstrap3 <pre>,<hr>
 479     .oe_error_detail
 480         hr
 481             display: block
 482             -webkit-margin-before: 0.5em
 483             -webkit-margin-after: 0.5em
 484             -webkit-margin-start: auto
 485             -webkit-margin-end: auto
 486             border-style: inset
 487             border-width: 1px
 488     // }}}
 489     // Kanban state (used in form and kanban) {{{
 490     .oe_kanban_status
 491         position: relative
 492         display: inline-block
 493         height: 12px
 494         width: 12px
 495         @include radius(6px)
 496         @include radial-gradient((#eee 0%, #ccc 40%, #bbb 100%))
 497         // +background-image(radial-gradient(45px 45px, #0ff 10px, #1e90ff 30px))
 498     .oe_kanban_status_green
 499         background: green
 500         @include radial-gradient((#55dd55 0%, #44aa44 40%, #339933 100%))
 501     .oe_kanban_status_red
 502         background: red
 503         @include radial-gradient((#ee7777 0%, #cc3333 40%, #bb0808 100%))
 504     .btn-group.kanban_state
 505         padding-top: 8px
 506         margin-right: 4px !important
 507         a
 508             color: #333333
 509     // }}}
 510     // Tags (for many2many tags, among others) {{{
 511     .oe_tag
 512         border: 1px solid $tag-border
 513         font-size: 11px
 514         padding: 2px 4px
 515         margin: 0 2px 2px 0
 516         @include radius(3px)
 517         background: $tag-bg-light
 518         color: #4C4C4C
 519     .oe_tag_dark
 520         background: $tag-bg-dark
 521         color: #eee
 522     .oe_form_field_radio
 523         &.oe_horizontal
 524             white-space: nowrap
 525             label
 526                 display: inline-block
 527                 text-align: center
 528                 height: 16px
 529         &.oe_vertical
 530             label
 531                 display: inline-block
 532                 margin-left: 20px
 533         .oe_radio_input
 534             border: 2px solid transparent
 535             display: inline-block
 536             height: 12px
 537             width: 12px
 538             vertical-align: top
 539             border-radius: 10px
 540             margin: 1px 0
 541             position: absolute
 542         &.oe_form_required.oe_form_invalid .oe_radio_input
 543             border-color: red
 544     .oe_tags
 545         &.oe_inline
 546             min-width: 250px
 547         .text-wrap
 548             width: 100% !important
 549             textarea
 550                 width: 100% !important
 551         .text-core
 552             min-height: 22px
 553             .text-wrap .text-dropdown .text-list .text-suggestion em
 554                 font-style: italic
 555                 text-decoration: none
 556         margin-bottom: 1px
 557     // }}}
 558     // Notebook {{{
 559     .oe_notebook
 560         margin: 8px 0
 561         padding: 0 16px
 562         list-style: none
 563         zoom: 1
 564     .oe_notebook.ui-corner-all
 565         @include radius(0)
 566     .oe_notebook:before, .oe_notebook:after
 567         display: table
 568         content: ""
 569         zoom: 1
 570     .oe_notebook:after
 571         clear: both
 572     .oe_notebook > li
 573         float: left
 574     .oe_notebook > li > a
 575         display: block
 576         color: #808080
 577     .oe_notebook > li.ui-tabs-active > a
 578         color: #4c4c4c
 579     .oe_notebook
 580         border-color: #ddd
 581         border-style: solid
 582         border-width: 0 0 1px
 583     .oe_notebook > li
 584         position: relative
 585     .oe_notebook > li > a
 586         padding: 0 12px
 587         margin-right: 2px
 588         line-height: 30px
 589         border: 1px solid transparent
 590         @include radius(4px 4px 0 0)
 591     .oe_notebook > li > a:hover
 592         text-decoration: none
 593         background-color: #eee
 594         border-color: #eee #eee #ddd
 595     .ui-tabs .oe_notebook.ui-tabs-nav li.ui-tabs-active
 596         border-bottom: none
 597         padding-bottom: 1px
 598     .oe_notebook > li.ui-state-active > a, .oe_notebook > li.ui-state-active > a:hover
 599         background-color: #ffffff
 600         border: 1px solid #ddd
 601         border-bottom-color: transparent
 602         cursor: default
 603     .oe_notebook_page
 604         padding: 0
 605         //Customize label weight according bootstrap3
 606         > label:not([for])
 607             font-weight: normal !important
 608         // End of customize
 609     div.ui-tabs
 610         padding: 3px 0px 3px 0px
 611     .ui-tabs-hide
 612         display: none
 613     // }}}
 614     // Dropdown {{{
 615     .oe_dropdown, .oe_dropdown_hover, .oe_dropdown_toggle
 616         position: relative
 617         cursor: pointer
 618     .oe_dropdown_toggle
 619         color: #2B2B2B
 620         font-weight: normal
 621     .oe_dropdown_hover:hover .oe_dropdown_menu, .oe_dropdown_menu.oe_opened
 622         display: block
 623     .oe_dropdown_menu
 624         display: none
 625         position: absolute
 626         z-index: 3
 627         margin: 0
 628         border: 1px solid $tag-border
 629         background: white
 630         padding: 4px 0
 631         min-width: 140px
 632         text-align: left
 633         @include radius(3px)
 634         @include box-shadow(0 1px 4px rgba(0,0,0,0.3))
 635         > li
 636             &:hover
 637                 @include vertical-gradient(#f0f0fa, #eeeef6)
 638                 @include box-shadow(none)
 639             list-style-type: none
 640             float: none
 641             display: block
 642             position: relative
 643             margin: 0
 644             padding: 2px 8px
 645             > a
 646                 white-space: nowrap
 647                 display: block
 648                 color: #4c4c4c
 649                 text-decoration: none
 650                 &:hover
 651                     text-decoration: none
 652     .oe_dropdown_arrow:after
 653         vertical-align: top
 654         margin-top: 8px
 655         //margin-left set at 3px to avoid a strange overflow
 656         margin-left: 3px
 657         border-left: 4px solid transparent
 658         border-right: 4px solid transparent
 659         border-top: 4px solid#404040
 660         @include opacity(0.5)
 661     // }}}
 662     // Loading {{{
 663     .oe_loading
 664         display: none
 665         z-index: 1001
 666         position: fixed
 667         top: 0
 668         right: 50%
 669         padding: 4px 12px
 670         background: #A61300
 671         color: white
 672         text-align: center
 673         border: 1px solid #900
 674         border-top: none
 675         -moz-border-radius-bottomright: 8px
 676         -moz-border-radius-bottomleft: 8px
 677         border-bottom-right-radius: 8px
 678         border-bottom-left-radius: 8px
 679     // }}}
 680     // CrashManager {{{
 681     .oe_dialog_warning
 682         width: 100%
 683         p
 684             text-align: center
 685     .oe_dialog_icon
 686         padding: 5px
 687         width: 32px
 688     // }}}
 689     // DatabaseManager {{{
 690     .oe_database_manager
 691         background: #fff
 692         color: #000
 693         text-align: left
 694         .oe_database_manager_menu
 695             color: #000
 696     // }}}
 697     // WebClient.fullscreen {{{
 698     .oe_content_full_screen
 699         .oe_application
 700             top: 0
 701             left: 0
 702         .oe_topbar, .oe_leftbar
 703             display: none
 704     // }}}
 705     // Webclient.leftbar {{{
 706     .oe_leftbar
 707         display: -ms-flexbox
 708         display: -webkit-flex
 709         display: flex
 710         -ms-flex-direction: column
 711         -webkit-flex-direction: column
 712         flex-direction: column
 713         -webkit-justify-content: space-between
 714         justify-content: space-between
 715         -ms-flex: 0 0 auto
 716         -webkit-flex-shrink: 0
 717         flex-shrink: 0
 718         -webkit-flex-grow: 0
 719         flex-grow: 0
 720         width: 220px
 721         height: 100%
 722         background: #f0eeee
 723         border-right: 1px solid $tag-border
 724         position: relative
 725         display: inline-block\9
 726         vertical-align: top\9
 727         a.oe_logo
 728             text-align: center
 729             -webkit-flex-shrink: 0
 730             flex-shrink: 0
 731             img
 732                 margin: 14px 0
 733                 border: 0
 734             .oe_logo_edit
 735                 margin: 14px 0
 736                 position: absolute
 737                 top: 1px
 738                 padding: 4px
 739                 width: 100%
 740                 display: none
 741                 text-align: center
 742                 color: #eee
 743                 background: rgba(37,37,37,0.9)
 744                 @include box-sizing(border)
 745             &:hover .oe_logo_edit_admin
 746                 display: block
 747         .oe_secondary_menus_container
 748             -webkit-flex-grow: 1
 749             flex-grow: 1
 750             overflow-y: auto
 751         .oe_footer
 752             background: #f0eeee
 753             text-align: center
 754             -webkit-flex-shrink: 0
 755             flex-shrink: 0
 756             a
 757                 font-weight: bold
 758                 span
 759                     color: #a24689
 760     // }}}
 761     // Webclient.leftbar items {{{
 762
 763     .oe_secondary_menu_section
 764         font-weight: bold
 765         margin-left: 8px
 766         color: $link-color
 767     .oe_secondary_submenu
 768         margin-bottom: 10px !important
 769         line-height: 1.1em
 770         margin-top: 3px
 771         .oe_menu_text
 772             white-space: nowrap
 773             overflow: hidden
 774             display: inline-block
 775             text-overflow: ellipsis
 776             max-width: 85%
 777             margin-top: 1px
 778         .badge
 779             &:hover
 780                 cursor: pointer
 781                 @include transform(scale(1.1))
 782         .oe_menu_toggler:before
 783             width: 0
 784             height: 0
 785             display: inline-block
 786             content: "&darr"
 787             text-indent: -99999px
 788             vertical-align: top
 789             margin-left: -12px
 790             margin-top: 4px
 791             margin-right: 4px
 792             border-top: 4px solid transparent
 793             border-bottom: 4px solid transparent
 794             border-left: 4px solid #4c4c4c
 795             @include opacity(0.5)
 796         .oe_menu_opened:before
 797             margin-top: 6px
 798             margin-left: -16px
 799             margin-right: 4px
 800             border-left: 4px solid transparent
 801             border-right: 4px solid transparent
 802             border-top: 4px solid #4c4c4c
 803         .oe_secondary_submenu li
 804             margin-left: 20px
 805     // }}}
 806     // About openerp {{{
 807     $link-color-odoo: #a24689
 808     .oe_about
 809         .label
 810             background-color: $link-color-odoo
 811         a
 812             color: $link-color-odoo
 813
 814         .user-details
 815             position: relative
 816             padding: 0
 817             margin-bottom: 275px
 818             .user-image
 819                 width: 100%
 820                 text-align: center
 821             .user-info-block
 822                 width: 100%
 823                 position: absolute
 824                 top: 55px
 825                 padding-top: 35px
 826                 .user-heading
 827                     text-align: center
 828                     margin: 10px 0 0
 829                 .navigation
 830                     li
 831                         a
 832                             padding: 10px 20px
 833                         &.active a
 834                             background: $link-color-odoo
 835                             color: #fff
 836                 .user-body
 837                     text-align: center
 838                     .tab-content > div
 839                         float: left
 840                         width: 100%
 841         a.oe_activate_debug_mode
 842             color: white !important
 843             font-size: 100%
 844         #social
 845             i
 846                 margin: 10px
 847                 &:hover
 848                     @include transform(scale(1.3))
 849             .social-fb:hover
 850                 color: #3B5998
 851             .social-tw:hover
 852                 color: #4099FF
 853             .social-gp:hover
 854                 color: #d34836
 855             .social-lk:hover
 856                 color: #007bb6
 857     // }}}
 858     // ActionManager {{{
 859     a.oe_form_uri:hover
 860         text-decoration: underline
 861     .oe_application
 862         height: 100%
 863         -webkit-flex-grow: 1
 864         flex-grow: 1
 865         -ms-flex-negative: 1
 866         display: inline-block\9
 867         overflow: auto\9
 868         width: -webkit-calc(100% - 220px)
 869         width: calc(100% - 220px)
 870         .oe_application
 871             width: 100%
 872     // }}}
 873     // ViewManager common {{{
 874     .oe-view-manager
 875         width: 100%
 876         height: 100%
 877         display: -webkit-flex
 878         display: flex
 879         -webkit-flex-direction: column
 880         flex-direction: column
 881         .oe-view-manager-content
 882             overflow: auto
 883             -webkit-flex-grow: 1
 884             flex-grow: 1
 885             position: relative
 886             a
 887                 color: $link-color
 888             > div
 889                 position: absolute
 890                 position: static\9
 891                 top: 0
 892                 bottom: 0
 893                 right: 0
 894                 left: 0
 895                 display: none
 896             .oe-view-manager-content
 897                 > div
 898                     position: relative
 899                     display: block
 900         .oe-view-manager-debug
 901             margin-right: 5px
 902     .oe-view-manager-header
 903         background-color: rgb(240, 238, 238)
 904         border-bottom: 1px solid #afafb6
 905         -webkit-flex-shrink: 0
 906         flex-shrink: 0
 907         width: 100%
 908         -webkit-user-select: none
 909         -moz-user-select: none
 910         user-select: none
 911         .oe-button-column
 912             height: 30px
 913         .dropdown-menu
 914             li
 915                 position: relative
 916                 a
 917                     padding: 3px 25px
 918             .oe_searchview_custom_public
 919                 a:after
 920                     font-family: FontAwesome
 921                     content: "\f0c0"
 922                     color: #666
 923                     margin-left: 3px
 924         .selected
 925             display: block
 926             a
 927                 font-weight: bold
 928             a:before
 929                 font-family: FontAwesome
 930                 position: absolute
 931                 left: 6px
 932                 top: 3px
 933                 content: "\f00c"
 934         .oe-right-toolbar
 935             float: right
 936             > div
 937                 display: inline-block
 938         .row:first-child
 939             padding-top: 3px
 940             padding-bottom: 3px
 941         .row:last-child
 942             padding-bottom: 10px
 943         .oe_tag
 944             @include radius(0px)
 945         .oe-view-title
 946             font-size: 18px
 947             padding-left: 0
 948             margin: 0
 949             background-color: rgb(240, 238, 238)
 950             li
 951                 -moz-user-select: initial
 952                 -webkit-user-select: initial
 953                 user-select: initial
 954         .oe-view-manager-search-view
 955             padding-top: 5px
 956         .oe-view-manager-switch
 957             button
 958                 width: 34px
 959             .oe-vm-switch-kanban:before
 960                 content: "\f009"
 961             .oe-vm-switch-list:before
 962                 content: ""
 963             .oe-vm-switch-form:before
 964                 content: "\f044"
 965             .oe-vm-switch-graph:before
 966                 content: "\f080"
 967             .oe-vm-switch-calendar:before
 968                 content: "\f073"
 969             .oe-vm-switch-gantt:before
 970                 content: "\f0ae"
 971             .oe-vm-switch-pivot:before
 972                 content: "\f0ce"
 973         .oe-view-manager-buttons
 974             display: inline-block
 975             > div
 976                 display: none
 977         .oe-view-manager-sidebar
 978             display: inline-block
 979             float: right
 980             .oe_form_binary_form
 981                 cursor: pointer
 982                 span
 983                     padding: 3px 20px
 984                 input.oe_form_binary_file
 985                     width: 100%
 986
 987             .oe_form_binary_form:hover
 988                 background-color: #f5f5f5
 989             .oe_file_attachment
 990                 padding: 3px 20px
 991                 display: inline-block
 992             .oe_sidebar_delete_item
 993                 padding: 0
 994                 display: inline-block
 995             .dropdown-menu
 996                 li
 997                     a
 998                         width: 100%
 999         .oe_form_buttons
1000             padding: 0
1001         .oe_form_buttons_view
1002             > button
1003                 float: left
1004                 &:last-child
1005                     float: right
1006                     margin-left: 4px
1007
1008         .oe-pager-buttons
1009             min-height: 30px
1010     .oe_view_manager_inline, .oe_view_manager_inlineview
1011         > .oe-view-manager-header
1012             display: none
1013
1014         // }}}
1015     // FormPopup {{{
1016     .o-modal-header
1017         > div
1018             margin-left: 45%
1019     .oe_popup_form
1020         display: none
1021         .oe_formview .oe_form_pager
1022             display: none !important
1023         // Customize label weight for popup wizard appear from another wizard according bootstrap3
1024         table label
1025             font-weight: normal
1026         // End of customize
1027     .oe_popup_list_pager
1028         float: right
1029     // }}}
1030     // SearchView {{{
1031     .oe_searchview
1032         cursor: text
1033         position: relative
1034         display: none
1035         height: auto
1036         padding-top: 1px
1037         padding-bottom: 1px
1038         .oe_searchview_unfold_drawer
1039             position: absolute
1040             top: 8px
1041             right: 5px
1042             cursor: pointer
1043         .oe_searchview_search
1044             cursor: pointer
1045             position: absolute
1046             top: 8px
1047             left: 5px
1048         .oe_searchview_facets
1049             min-height: 22px
1050             margin: 2px 20px 0 0
1051             *
1052                 vertical-align: top
1053                 display: inline-block
1054                 font-size: 100%
1055             .oe_searchview_facet
1056                 margin: 1px 0
1057                 font-size: 11px
1058                 &:focus
1059                     outline: none
1060                 .label
1061                     @include radius(0px)
1062             .oe_searchview_input
1063                 padding: 2px 0 0 6px
1064                 font-size: 12px
1065                 height: 16px
1066                 -webkit-user-select: initial
1067                 -moz-user-select: initial
1068                 user-select: initial
1069                 &:focus
1070                     outline: none
1071             .oe_searchview_input:first-child
1072                 margin-left: 10px
1073             .oe_searchview_facet
1074                 position: relative
1075                 cursor: pointer
1076                 padding: 0
1077                 -webkit-font-smoothing: auto
1078                 // spacing for opera, FF
1079                 &:focus
1080                     border-color: $tag-border-selected
1081                     @include box-shadow(0 0 3px 1px $tag-border-selected)
1082                 .oe_facet_values
1083                     background: $tag-bg-light
1084                 .oe_facet_category, .oe_facet_value
1085                     padding: 0 4px
1086                 .oe_facet_category
1087                     color: white
1088                     text-shadow: 0 1px 1px rgba(0, 0, 0, 0.4)
1089                 .oe_facet_category.oe_i
1090                     font-size: 16px
1091                 .oe_facet_value
1092                     border-left: 1px solid #afafb6
1093                     color: #4C4C4C
1094                     &:last-child
1095                         padding-right: 16px
1096                     &:first-child
1097                         border-left: none
1098                 .oe_facet_remove
1099                     position: absolute
1100                     top: 3px
1101                     right: 3px
1102                     color: #8786b7
1103                     line-height: 8px
1104                     width: 12px
1105                     height: 12px
1106                     padding-top: 1px
1107                     text-align: center
1108                     font-weight: bold
1109                     cursor: pointer
1110                     text-shadow: 0 1px 1px white
1111                     &:hover
1112                         color: white
1113                         background: #8786b7
1114                         text-shadow: 0 1px 1px rgba(0, 0, 0, 0.4)
1115                         @include radius(2px)
1116
1117         .oe-autocomplete
1118             display: none
1119             position: absolute
1120             background-color: white
1121             width: 400px
1122             border: 1px solid #afafb6
1123             z-index: 666
1124             margin-top: 2px
1125             cursor: default
1126             @include radius(3px)
1127             ul
1128                 list-style-type: none
1129                 padding-left: 0
1130                 margin: 5px 0px
1131                 li
1132                     padding-left: 20px
1133                     text-shadow: 0 0 0 white
1134                     span:first-child
1135                         margin-right: 5px
1136                     span.oe-expand
1137                         cursor: pointer
1138                 li.oe-indent
1139                     margin-left: 20px
1140                 li.oe-selection-focus
1141                     background-color: #7c7bad
1142                     color: white
1143                 li.oe-separator
1144                     margin-top: 2px
1145                     margin-bottom: 2px
1146                     border-top: 1px solid #afafb6
1147                 li.oe-separator:last-child
1148                     display: none
1149
1150     .oe-search-options
1151         a
1152             padding-left: 25px
1153             padding-right: 25px
1154             width: 100%
1155             -webkit-user-select: none
1156             -moz-user-select: none
1157             user-select: none
1158         .oe-apply-filter
1159             margin-left: 25px
1160         .oe-add-filter-menu
1161             display: none
1162         .oe-add-condition
1163             width: auto
1164             margin-left: 10px
1165             padding-left: 0
1166             padding-right: 10px
1167         .oe-group-selector
1168             margin: 3px 25px
1169             min-width: -webkit-calc(100% - 40px)
1170             min-width: calc(100% - 40px)
1171             max-width: 250px
1172             width: auto
1173         .divider
1174             display: none
1175         .filters-menu
1176             overflow: auto
1177             overflow-x: hidden
1178             .divider
1179                 display: list-item
1180         .closed-menu
1181             a:before
1182                 font-family: FontAwesome
1183                 position: absolute
1184                 left: 12px
1185                 top: 3px
1186                 content: "\f0da"
1187         .open-menu
1188             a:before
1189                 font-family: FontAwesome
1190                 position: absolute
1191                 left: 9px
1192                 top: 3px
1193                 content: "\f0d7"
1194
1195         .oe-select-group
1196             margin: 3px 25px
1197         .oe-add-group
1198             display: none
1199         .oe-save-name
1200             display: none
1201             margin: 3px 25px
1202             span
1203                 white-space: nowrap
1204                 input
1205                     margin-left: 0
1206         .searchview_extended_prop_field
1207             display: inline
1208             width: -webkic-calc(100% - 20px)
1209             width: calc(100% - 20px)
1210
1211         .searchview_extended_prop_op
1212             margin: 3px 0
1213             width: -webkit-calc(100% - 20px)
1214             width: calc(100% - 20px)
1215         .searchview_extended_delete_prop
1216             float: right
1217             display: inline
1218             cursor: pointer
1219         .searchview_extended_prop_value
1220             width: -webkit-calc(100% - 20px)
1221             width: calc(100% - 20px)
1222             > select, > input
1223                 width: -webkit-calc(100% - 20px)
1224                 width: calc(100% - 20px)
1225             .oe_datepicker_main
1226                 width: -webkit-calc(100% - 20px)
1227                 width: calc(100% - 20px)
1228             .oe_datepicker_master
1229                 width: 100%
1230             .fa-calendar
1231                 margin-left: -21px
1232                 cursor: pointer
1233         span.remove-filter
1234             position: absolute
1235             top: 6px
1236             right: 10px
1237             cursor: pointer
1238         .dropdown-menu
1239             > li
1240                 position: relative
1241                 white-space: nowrap
1242             li.oe-filter-condition
1243                 white-space: normal
1244                 padding-left: 25px
1245                 padding-right: 10px
1246                 margin-bottom: 5px
1247                 .o-or-filter
1248                     display: none
1249             li.oe-filter-condition + li.oe-filter-condition
1250                 margin-top: 10px
1251                 .o-or-filter
1252                     display: block
1253             .o-or-filter
1254                 position: absolute
1255                 left: 5px
1256                 top: 5px
1257         a
1258             display: inline-block
1259
1260     input.oe-save-name
1261         width: auto
1262     .oe_pager_value
1263         display: inline-block
1264
1265     // }}}
1266     // Views Common {{{
1267     .oe_view_nocontent
1268         padding: 15px
1269         margin-top: 0
1270         color: #777777
1271         font-size: 125%
1272         max-width: 700px
1273         .oe_view_nocontent_create
1274             margin-top: 0
1275             padding-top: 35px
1276             color: #4c4c4c
1277             &:before
1278                 content: ""
1279                 display: inline-block
1280                 position: absolute
1281                 width: 70px
1282                 height: 80px
1283                 margin-left: -70px
1284                 margin-top: -50px
1285                 background: transparent url(/web/static/src/img/view_empty_arrow.png) no-repeat 0px 0px
1286         > p
1287             padding-left: 78px
1288         .oe_empty_custom_dashboard
1289             background: transparent url(/web/static/src/img/graph_background.png) no-repeat 0 0
1290             margin-top: -15px
1291             padding: 100px 0 0 137px
1292             min-height: 327px
1293             margin-left: -15px
1294     .oe_view.oe_cannot_create
1295         .oe_view_nocontent_create
1296             display: none
1297     // }}}
1298     // FormView.base and dynamic tags {{{
1299     .oe_formview
1300         background: white
1301     .oe_form_dropdown_section
1302         position: relative
1303         display: inline-block
1304     .oe_form_invalid
1305         input, select, textarea
1306             background-color: #F66 !important
1307             border: 1px solid #D00 !important
1308     .oe_view_manager_current .oe_form_editable
1309         .oe_highlight
1310             color: #404040
1311             background: none
1312         button.oe_highlight
1313             @include vertical-gradient(#efefef, #d8d8d8)
1314             @include box-shadow((0 1px 2px rgba(0, 0, 0, .1), 0 1px 1px rgba(255, 255, 255, .8) inset))
1315         button.oe_highlight:active
1316             @include vertical-gradient(#e3e3e3, #f6f6f6)
1317             @include box-shadow(none)
1318         button.oe_highlight:hover
1319             @include vertical-gradient(#f6f6f6, #e3e3e3)
1320             @include box-shadow((0 1px 2px rgba(0, 0, 0, .1), 0 1px 1px rgba(255, 255, 255, .8) inset))
1321     .oe_form_invisible
1322         display: none !important
1323     .oe_form_editable
1324         .oe_read_only
1325             display: none !important
1326     .oe_form_readonly
1327         .oe_edit_only, .oe_form_field:empty
1328             display: none !important
1329         .oe_form .oe_form_field_date
1330             width: auto
1331         .oe_form_field_boolean.boolean
1332             position: relative
1333             top: -20px
1334             width: 14px
1335             height: 14px
1336             z-index: 10000
1337             // IE needs a color in order for the layer to respond to mouse events
1338             backgroundColor: "#fff"
1339             opacity: 0
1340     // Sheet and padding
1341     .oe_form_nosheet
1342         margin: 16px
1343         > header
1344             margin: -16px -16px 0 -16px
1345             padding: 0
1346     .oe_form_nosheet.oe_form_nomargin
1347         margin: 0
1348         > header
1349             margin: 0
1350     .oe_form_sheetbg
1351         padding: 16px 0
1352     .oe_form_sheet_width
1353         min-width: 650px
1354         max-width: $sheet-max-width
1355         margin: 0 auto
1356     .oe_form_sheet
1357         background: white
1358         min-height: 330px
1359         padding: 16px
1360         .oe_list
1361             overflow-x: auto
1362     // Sheet inline mode
1363     .oe_application
1364         .oe_form_sheetbg
1365             background: url(/web/static/src/img/form_sheetbg.png)
1366             border-bottom: 1px solid #ddd
1367             // Customize font weight according bootstrap3
1368             .oe_subtotal_footer label
1369                 font-weight: bold
1370             table label
1371                 font-weight: normal
1372             // End of customize
1373         .oe_form_sheet
1374             border: 1px solid #c8c8d3 //$tag-border
1375             @include box-shadow(0 4px 20px rgba(0,0,0,0.15))
1376             .ui-tabs
1377                 margin: 0 -16px
1378             .oe_notebook_page
1379                 padding: 0 16px
1380     // }}}
1381     // FormView.header {{{
1382     .oe_form > :not(.oe_form_nosheet) header, .oe_form > .oe_form_nosheet header
1383         padding-left: 2px
1384         ul:not(.oe_tooltip_technical):not(.oe_dropdown_menu)
1385             display: inline-block
1386             float: right
1387         .oe_button
1388             margin: 3px 2px 1px
1389             &:first-child
1390                 margin-left: 6px
1391
1392     .oe_form  header
1393         border-bottom: 1px solid #cacaca
1394         padding-left: 2px
1395         @include vertical-gradient(#fcfcfc, #dedede)
1396         > span
1397             margin-left: 4px
1398
1399     // }}}
1400     // FormView.custom tags and classes {{{
1401     .oe_form
1402         header
1403             .oe_tags
1404                 margin: 5px 0 0 5px
1405                 width: 400px
1406                 padding-bottom: 0
1407         div.oe_chatter
1408             box-sizing: border-box
1409             min-width: $sheet-min-width + 2* $sheet-padding
1410             max-width: $sheet-max-width + 2* $sheet-padding
1411             margin: 0 auto
1412             padding: 16px 16px 48px
1413         div.oe_form_configuration
1414             p, ul, ol
1415                 color: #aaa
1416                 max-width: 650px
1417             label
1418                 min-width: 150px
1419             .oe_form_group_cell_label
1420                 padding: 1px 0
1421             .oe_form_group_cell div div
1422                 padding: 1px 0
1423         .oe_subtotal_footer
1424             width: 1% !important
1425             td.oe_form_group_cell
1426                 text-align: right
1427                 padding: 0 !important
1428             td.oe_form_group_cell_label
1429                 border-right: none
1430             .oe_subtotal_footer_separator
1431                 min-width: 108px
1432                 border-top: 1px solid #cacaca
1433                 margin-top: 4px
1434                 padding-top: 4px
1435                 font-weight: bold
1436                 font-size: 18px
1437             label:after
1438                 content: ":"
1439             label.oe_subtotal_footer_separator
1440                 font-weight: bold !important
1441                 padding: 2px 11px 2px 0px !important
1442             label.oe_form_label_help
1443                 font-weight: normal !important
1444         .oe_form_box_info
1445             background: #fe9
1446             border-bottom: 1px solid #cb6
1447             padding: 4px
1448             > p
1449                 margin: auto
1450         .oe_form_box_warning
1451             background: #bd362f
1452             border-bottom: 1px solid #900
1453             padding: 4px
1454             *
1455                 color: white
1456                 text-shadow: none
1457             > p
1458                 margin: auto
1459     // }}}
1460     // FormView.group {{{
1461     .oe_form
1462         .oe_form_button
1463             margin: 2px
1464         td.oe_form_group_cell_label
1465             border-right: 1px solid #ddd
1466             padding: 2px 0px
1467             label
1468                 line-height: 18px
1469                 display: block
1470                 min-width: 150px
1471                 font-weight: bold !important
1472         td.oe_form_group_cell + .oe_form_group_cell
1473             padding: 2px 0 2px 8px
1474         .oe_form_group
1475             width: 100%
1476             margin: 9px 0 9px 0
1477             .oe_form_group_cell.oe_group_right
1478                 padding-left: 20px
1479     // }}}
1480     // FormView.label {{{
1481     .oe_form
1482         .oe_form_label_help[for], .oe_form_label[for]
1483             white-space: nowrap
1484             padding-right: 8px
1485             span
1486                 font-size: 80%
1487                 color: darkGreen
1488                 vertical-align: top
1489                 position: relative
1490                 top: -4px
1491                 padding: 0 2px
1492     // }}}
1493     // FormView.separator {{{
1494     .oe_horizontal_border
1495         border-bottom: 1px solid black
1496     .oe_horizontal_separator
1497         font-weight: bold
1498         font-size: 20px
1499         margin: 15px 0px 10px 0px
1500         color: $section-title-color
1501         &:empty
1502             height: 5px
1503     .oe_vertical_separator
1504         border-left: 1px solid #666
1505         padding: 0 4px 0 4px
1506     // }}}
1507     // FormView.progressbar {{{
1508     .oe_form_field_progressbar
1509         display: inline-block
1510         min-width: 70px
1511     .oe_form_field_progressbar.ui-progressbar
1512         height: 22px
1513         font-size: 10px
1514         @include box-sizing(border)
1515         border: 1px solid #999
1516         @include radius(3px)
1517         background: white
1518         min-width: 50px
1519         span
1520             position: absolute
1521             margin-left: 10px
1522             font-weight: bold
1523         .ui-widget-header
1524             background: #cccccc url(/web/static/lib/jquery.ui/css/smoothness/images/ui-bg_highlight-soft_75_cccccc_1x100.png) 50% 50% repeat-x
1525     // }}}
1526     // FormView.fields {{{
1527     .oe_form
1528         .oe_form_field_text
1529             width: 100%
1530             .oe_form_text_content
1531                 text-overflow: ellipsis
1532                 display: inline-block
1533                 white-space: pre-wrap
1534                 overflow-x: hidden
1535                 width: 100%
1536         .oe_form_field_char input,
1537         .oe_form_field_url input,
1538         .oe_form_field_email input,
1539         .oe_form_field_text textarea,
1540         .oe_form_field_selection select
1541             width: 100%
1542         .oe_notebook_page .oe_form_field_text textarea
1543             min-height: 96px
1544         .oe_form_field_text.oe_inline, .oe_form_field_text.oe_inline > textarea
1545             width: 500px
1546         h1, h2, h3, h4, h5, h6
1547             margin: 0 0 4px 0
1548             input
1549                 height: inherit !important
1550                 font-size: inherit
1551         // Customize for formview
1552         .oe_title h1, h1
1553             font-weight: bold
1554             font-size: 2em
1555         h2
1556             font-size: 1.5em
1557         label
1558             font-weight: bold
1559             margin-bottom: 0px
1560             display: inline
1561         // End of customize
1562         .oe_form_field
1563             width: 100%
1564             display: inline-block
1565             padding: 2px 2px 2px 0px
1566             vertical-align: top
1567             input
1568                 margin: 0px
1569         input[type="text"], input[type="password"], input[type="file"], select
1570             height: 22px
1571             padding-top: 2px
1572         input[type="text"], input[type="password"], input[type="file"], select, textarea
1573             @include box-sizing(border)
1574             background: white
1575             min-width: 60px
1576             color: #1f1f1f
1577             font-family: "Lucida Grande", Helvetica, Verdana, Arial, sans-serif
1578         input[readonly], select[readonly], textarea[readonly], input[disabled], select[disabled]
1579             background: #E5E5E5 !important
1580             color: #666
1581         textarea[disabled]
1582             border: none
1583             padding-left: 8px
1584             @include box-shadow(none)
1585             @include radius(0px)
1586             color: #4c4c4c
1587         textarea.oe_inline[disabled]
1588             border-left: 8px solid #eee
1589         .oe_form_field_url button img
1590             vertical-align: top
1591         .oe_form_field_monetary,
1592         .oe_form_field_date,
1593         .oe_form_field_datetime
1594             white-space: nowrap
1595         .oe_form_field_boolean
1596             width: auto
1597         .oe_datepicker_root
1598             display: inline-block
1599             .datepickerbutton
1600                 margin-left: 5px
1601                 cursor: pointer
1602         .oe_form_required
1603             input:not([disabled]):not([readonly]), select:not([disabled]):not([readonly]), textarea:not([disabled]):not([readonly])
1604                 background-color: #D2D2FF !important
1605         .oe_form_invalid
1606             input, select, textarea
1607                 background-color: #F66 !important
1608                 border: 1px solid #D00 !important
1609         .oe_input_icon
1610             cursor: pointer
1611             margin: 3px 0 0 -21px
1612             vertical-align: top
1613         .oe_input_icon_disabled
1614             position: absolute
1615             cursor: default
1616             opacity: 0.5
1617             filter: alpha(opacity=50)
1618             right: 5px
1619             top: 3px
1620         .oe_form_field_with_button.oe_no_button > .oe_button
1621             display: none
1622         .oe_form_field_with_button:not(.oe_no_button)
1623             > .oe_button
1624                 float: right
1625                 @include radius(0)
1626                 border-bottom-left-radius: 0px
1627                 height: 22px
1628         .oe_form_field_with_button
1629             input
1630                 width: 100%
1631             > div
1632                 position: relative
1633                 overflow: hidden
1634         .oe_form_embedded_html
1635             position: relative
1636             width: 100%
1637             margin: auto
1638             overflow: auto
1639             text-align: justify
1640         .oe_form_field_html .oe_input_icon
1641             float: right
1642             margin: 4px 7px
1643
1644     .oe_form_editable
1645         .oe_form
1646             .oe_form_field_integer input
1647                 width: 6em
1648             .oe_form_field_float input
1649                 width: 7em
1650             .oe_form_field_date input
1651                 width: 100px
1652             .oe_form_field_datetime input
1653                 width: 150px
1654     // }}}
1655     // FormView.fields_binary {{{
1656     /* http://www.quirksmode.org/dom/inputfile.html
1657      * http://stackoverflow.com/questions/2855589/replace-input-type-file-by-an-image
1658      */
1659     .oe_hidden_input_file
1660         // Position: relative is used for the hidden input[type=file]
1661         // Do not remove it anymore !
1662         position: relative
1663         input.oe_form_binary_file
1664             z-index: 0
1665             line-height: 0
1666             font-size: 12px
1667             position: absolute
1668             top: 1px
1669             left: 0
1670             right: 0
1671             opacity: 0
1672             filter: alpha(opacity = 0)
1673             -ms-filter: "alpha(opacity=0)"
1674             margin: 0
1675             padding: 0
1676     .oe_form
1677         .oe_form_field_binary
1678             display: inline-block
1679         .oe_form_field_image
1680             padding: 0
1681             position: relative
1682             display: inline-block
1683             width: auto
1684             vertical-align: top
1685             .oe_form_field_image_controls
1686                 position: absolute
1687                 top: 1px
1688                 padding: 6px 0
1689                 width: 100%
1690                 display: none
1691                 text-align: center
1692                 color: #eee
1693                 background: rgba(37,37,37,0.9)
1694                 @include radius(3px 3px 0 0)
1695                 @include box-sizing(border)
1696             &:hover .oe_form_field_image_controls
1697                 display: block
1698             img
1699                 max-width: 256px
1700                 max-height: 256px
1701     .oe_fileupload
1702         display: inline-block
1703         clear: both
1704         width: 100%
1705         margin-bottom: -15px
1706         .oe_add
1707             float: left
1708             position: relative
1709             width: 100%
1710             left: +2px
1711             margin: 9px 0 /* Customize margin according bootstrap3 */
1712             overflow: hidden
1713             button
1714                 display: inline
1715                 height: 24px
1716                 font-size: 12px
1717                 line-height: 12px
1718                 vertical-align: middle
1719             button.oe_attach
1720                 width: 24px
1721                 background: transparent
1722                 color: #7C7BAD
1723                 box-shadow: none
1724                 border: none
1725                 text-shadow: none
1726                 .oe_e
1727                     position: relative
1728                     top: -10px
1729                     left: -9px
1730             input.oe_form_binary_file
1731                 display: inline-block
1732                 margin-left: -85px
1733                 height: 22px
1734                 width: 152px
1735                 margin-top: -24px
1736                 cursor: pointer
1737             .oe_attach_label
1738                 color: #7C7BAD
1739                 margin-left: -3px
1740         .oe_attachments
1741             margin-bottom: 4px
1742             margin-right: 0px
1743             font-size: 12px
1744             border-radius: 2px
1745             border: solid 1px rgba(124,123,173,0.14)
1746             .oe_attachment
1747                 padding: 2px
1748                 padding-left: 4px
1749                 padding-right: 4px
1750                 .oe_e
1751                     font-size: 23px
1752                     margin-top: -5px
1753                 .oe_e:hover
1754                     text-decoration: none
1755             .oe_attachment:nth-child(odd)
1756                 background: white
1757             .oe_attachment:nth-child(even)
1758                 background: #F4F5FA
1759     // }}}
1760     // FormView.many2one {{{
1761     .oe_form_field_many2one
1762         display: inline-block
1763         td:first-child
1764             position: relative
1765         span.oe_m2o_drop_down_button
1766             position: absolute
1767             top: 2px
1768             right: 0px
1769         .oe_m2o_cm_button
1770             line-height: 14px
1771             float: right
1772             padding-left: 2px
1773         input
1774             padding-right: 13px
1775     &.ui-autocomplete
1776         li.oe_m2o_dropdown_option a
1777             font-style: italic
1778             padding-left: 2em
1779         li:not(.oe_m2o_dropdown_option) + li.oe_m2o_dropdown_option
1780             margin-top: 10px
1781     // }}}
1782     // FormView.fieldstatus {{{
1783     ul.oe_form_status, ul.oe_form_status_clickable
1784         display: inline-block
1785         margin: 0
1786         padding: 0 18px 0 0
1787         li
1788             display: inline-block
1789             list-style-type: none
1790             // It is probably a bad idea to modify this margin
1791             margin: 0 -18px 0 0
1792             padding: 0
1793             @include vertical-gradient(#fcfcfc, #dedede)
1794             &:first-child > .label
1795                 border-left: 1px solid #cacaca
1796                 padding-left: 14px
1797             &:last-child
1798                 border-right: 1px solid #cacaca
1799                 > .label
1800                     padding-right: 14px
1801                 > .arrow
1802                     display: none
1803             > .label
1804                 color: #4c4c4c
1805                 text-shadow: 0 1px 1px #fcfcfc, 0 -1px 1px #dedede
1806                 padding: 7px
1807                 display: inline-block
1808                 padding-left: 24px
1809                 margin: 0
1810                 position: relative
1811                 // Customize for statusbar label
1812                 line-height: normal
1813                 font-size: 100%
1814                 font-weight: normal
1815                 // End of customize
1816             > .arrow
1817                 width: 17px
1818                 height: 30px
1819                 display: inline-block
1820                 vertical-align: top
1821                 overflow: hidden
1822                 margin-left: -5px
1823                 span
1824                     position: relative
1825                     width: 24px
1826                     height: 24px
1827                     display: inline-block
1828                     margin-left: -12px
1829                     margin-top: 3px
1830                     box-shadow: -1px 1px 2px rgba(255,255,255,0.2), inset -1px 1px 1px rgba(0,0,0,0.2)
1831                     @include skew-gradient(#fcfcfc, #dedede)
1832                     @include radius(3px)
1833                     @include transform(rotate(45deg))
1834         ul.oe_dropdown_menu
1835             display: none
1836             padding: 0
1837             min-width: 0
1838             &.oe_opened
1839                 display: block
1840             li
1841                 margin: 0
1842                 width: 100%
1843                 span.label
1844                     padding-left: 14px
1845
1846         li.oe_active
1847             @include vertical-gradient(#729fcf, #3465a4)
1848             > .arrow span
1849                 @include skew-gradient(#729fcf, #3465a4)
1850             > .label
1851                 color: white
1852                 text-shadow: 0 1px 1px #729fcf, 0 -1px 1px #3465a4
1853     ul.oe_form_status_clickable
1854         li
1855             cursor: pointer
1856             &:hover
1857                 @include vertical-gradient(darken(#fcfcfc, 8%), darken(#dedede, 8%))
1858                 > .label
1859                     text-shadow: 0 -1px 1px #fcfcfc, 0 1px 1px #dedede
1860                 > .arrow span
1861                     @include vertical-gradient(darken(#fcfcfc, 8%), darken(#dedede, 8%))
1862             > .label
1863                 color: $link-color
1864         li.oe_active
1865             &:hover
1866                 @include vertical-gradient(darken(#729fcf, 10%), darken(#3465a4, 10%))
1867                 > .label
1868                     text-shadow: 0 -1px 1px #729fcf, 0 1px 1px #3465a4
1869                 > .arrow span
1870                     @include skew-gradient(darken(#729fcf, 10%), darken(#3465a4, 10%))
1871     // }}}
1872     // FormView.one2many {{{
1873     .oe_form .oe_form_field_one2many > .oe_view_manager
1874         .oe_list_pager_single_page
1875             display: none
1876     .oe_form_field_one2many,.oe_form_field_many2many
1877         // TODO: oe_form_field_one2many_list?
1878         > .oe_view_manager
1879             .oe_list_pager_single_page
1880                 display: none !important
1881             .oe_view_manager_view_list
1882                 min-height: 132px
1883
1884         .oe_form_field_one2many_list_row_add,.oe_form_field_many2many_list_row_add
1885             font-weight: bold
1886         .oe_list_content
1887             > thead
1888                 border-bottom: 1px
1889             > tbody
1890                 tr:nth-child(odd)
1891                     background: transparent
1892         .oe_list .oe_list_edit_row_save
1893             background: url(/web/static/src/img/iconset-b-remove.png) 50% 50% no-repeat
1894             &:before
1895                 visibility: hidden
1896
1897         &> .oe_view_manager
1898             .oe_header_row_top
1899                 display: none
1900             .oe_view_manager_header2
1901                 td
1902                     padding: 0px 8px
1903                     line-height: 16px
1904                     .oe_i
1905                         font-size: 13px
1906                     .oe_pager_group
1907                         height: auto
1908                         line-height: 16px
1909                         li
1910                             height: auto
1911                             line-height: 16px
1912         .oe_list_buttons.oe_editing .oe_list_save
1913             // keep "save row" button hidden in o2m
1914             visibility: hidden
1915     .oe_form_editable
1916         .oe_list_editable
1917             .oe_list_content
1918                 td.oe_required
1919                     background-color: #d2d2ff
1920                 td.oe_readonly
1921                     background-color: #eee
1922
1923     $row-height: 27px
1924     .oe_list_editable .oe_list_content td.oe_list_field_cell
1925         padding: 4px 6px 3px
1926     .oe_list.oe_list_editable.oe_editing
1927         .oe_edition .oe_list_field_cell
1928             *
1929                 visibility: hidden
1930             color: transparent
1931             text-shadow: none
1932         .oe_m2o_drop_down_button
1933             top: 5px
1934         .oe_m2o_cm_button
1935             line-height: 19px
1936         .oe_input_icon
1937             margin-top: 5px
1938         .oe_form_field
1939             &.oe_list_field_handle
1940                 color: transparent
1941             &.oe_readonly
1942                 padding: 4px 6px 3px
1943                 text-align: left
1944             min-width: 0
1945             max-width: none
1946             input, textarea
1947                 height: $row-height
1948                 @include radius(0)
1949                 border: 1px solid #aaf
1950                 margin: 0
1951             input, textarea, select
1952                 min-width: 0
1953             &.oe_form_field_float,&.oe_form_view_integer
1954                 &.oe_readonly
1955                     padding: 6px 0px 0px
1956                     text-align: right
1957                 span
1958                     padding: 0px 6px
1959                 input
1960                     width: 100% !important
1961                     text-align: right
1962             &.oe_form_field_datetime,&.oe_form_field_date
1963                 input.oe_datepicker_master
1964                     width: 100% !important
1965             &.oe_form_field_reference
1966                 display: table
1967     .oe_list_group_name
1968         white-space: nowrap
1969     // }}}
1970     // FormView.many2many {{{
1971     .oe_form .oe_form_field_many2many > .oe_list
1972         .oe_list_pager_single_page
1973             display: none
1974     // }}}
1975     // ListView {{{
1976     .oe_list_buttons
1977         .oe_alternative
1978             visibility: hidden
1979         .oe_list_save, .oe_list_discard
1980             display: none
1981         &.oe_editing
1982             .oe_list_add
1983                 display: none
1984             .oe_list_save
1985                 display: inline-block
1986             .oe_list_discard
1987                 display: inline
1988             .oe_alternative
1989                 visibility: visible
1990
1991     .oe_list
1992         &.oe_cannot_edit
1993             .oe_list_header_handle, .oe_list_field_handle
1994                 display: none !important
1995                 padding: 0 !important
1996         &.oe_cannot_delete
1997             .oe_list_record_delete
1998                 display: none !important
1999
2000         .oe_form
2001             .oe_form_nosheet
2002                 margin: 0 // FIXME: either class or border should not be by default
2003                 padding: 0
2004                 border: none
2005             .oe_form_field
2006                 width: auto
2007                 position: absolute
2008                 margin: 0 !important // dammit
2009                 padding: 0
2010             .oe_form_field_boolean input
2011                 margin: 1px 0 0 10px !important
2012         .oe_list_content .oe_group_header
2013             @include vertical-gradient(#fcfcfc, #dedede)
2014
2015     .oe_list_content
2016         width: 100%
2017         td:first-child, th:first-child
2018             &:after
2019                 border-width: 0
2020         td.oe_number
2021             text-align: right !important
2022             max-width: 100px
2023         td.oe_list_field_date, th.oe_list_header_date
2024             min-width: 6em
2025         > thead
2026             border-bottom: 2px solid #cacaca
2027             background: #eee
2028             vertical-align: top
2029         td, th
2030             padding: 3px 6px
2031             line-height: 18px
2032         th.oe_sortable, th.oe_sortable div
2033             cursor: pointer
2034         th.oe_sortable div
2035             position: relative
2036         th.oe_sortable div:after
2037             margin-right: 6px
2038             content: ""
2039             margin-top: 7px
2040             border-width: 0 4px 4px
2041             border-style: solid
2042             border-color: #000 transparent
2043             visibility: hidden
2044         th.sortup div:after
2045             float: right
2046             visibility: visible
2047             @include opacity(0.6)
2048         .oe_list_header_many2many_tags
2049             min-width: 70px
2050         th.sortdown div:after
2051             float: right
2052             border-bottom: none
2053             border-left: 4px solid transparent
2054             border-right: 4px solid transparent
2055             border-top: 4px solid #000
2056             visibility: visible
2057             @include box-shadow(none)
2058             @include opacity(0.6)
2059         > tbody
2060             cursor: pointer
2061             > tr
2062                 height: $row-height
2063                 border-top: 1px solid #ddd
2064                 > td.oe_list_field_cell
2065                     padding: 3px 6px
2066                     white-space: pre-line
2067                 > td, > th
2068                     > button
2069                         border: none
2070                         background: transparent
2071                         padding: 0
2072                     > button.btn_txt
2073                         border: 1px solid rgba(0,0,0,0.4)
2074                         background: #e3e3e3
2075                         padding: 3px 12px
2076                 > td.oe_list_checkbox:first-child, th.oe_list_checkbox:first-child
2077                     width: 17px
2078                     &:after
2079                         border-width: 0
2080                 > td.oe_list_field_boolean input
2081                     @include opacity()
2082             > tr:nth-child(odd)
2083                 background-color: #f0f0fa
2084                 @include vertical-gradient(#f0f0fa, #eeeef6)
2085
2086         > tfoot
2087             border-top: 2px solid #cacaca
2088             border-bottom: 1px solid #cacaca
2089             background: #eee
2090             font-weight: bold
2091
2092
2093         .numeric
2094             text-align: right
2095             width: 82px
2096             input
2097                 text-align: right
2098         th.oe_list_header_handle
2099             font-size: 1px
2100             overflow: hidden
2101             text-indent: -9001px
2102         td.oe_list_field_handle
2103             width: 1em
2104             padding: 0 !important
2105             cursor: ns-resize
2106             .oe_list_handle
2107                 @include text-to-entypo-icon("}",#E0E0E0,18px)
2108                 margin-right: 7px
2109         .oe_list_field_progressbar progress
2110             width: 100%
2111     // }}}
2112     // Tree view {{{
2113     .tree_header
2114         background-color: #f0f0f0
2115         border-bottom: 1px solid #cacaca
2116         color: #4c4c4c
2117         padding: 5px
2118         height: 25px
2119         button
2120             float: right
2121             height: 27px
2122             margin-right: 5px
2123     .oe-treeview-table
2124         width: 100%
2125         background-color: white
2126         border-spacing: 0
2127         color: #4c4c4c
2128         th
2129             padding: 10px
2130             font-weight: bold
2131             background-color: #f0f0f0
2132             border-bottom: 2px solid #cacaca
2133
2134         td
2135             cursor: pointer
2136             vertical-align: middle
2137             text-align: left
2138             vertical-align: middle
2139             height: 20px
2140             padding-left: 4px
2141             padding-right: 4px
2142             border-right: 1px solid #e7e7e7
2143
2144         td.oe_number
2145             text-align: right !important
2146         tr
2147             border-bottom: 1px solid #d6d6d6
2148             &:hover
2149                 background-color: #e7e7e7
2150         span
2151             font-size: 90%
2152             font-weight: normal
2153             white-space: nowrap
2154             display: block
2155         .treeview-tr.oe-treeview-first
2156             background: transparent url(/web/static/src/img/expand.gif) 0 50% no-repeat
2157         .oe_open .treeview-tr.oe-treeview-first
2158             background-image: url(/web/static/src/img/collapse.gif)
2159         .treeview-tr.oe-treeview-first span, .treeview-td.oe-treeview-first span
2160             margin-left: 16px
2161     // }}}
2162     // Debugging stuff {{{
2163     .oe_layout_debugging
2164         .oe_form_group
2165             outline: 2px dashed green
2166         .oe_form_group_cell
2167             outline: 1px solid blue
2168         .oe_form_group:hover, .oe_form_group_cell:hover
2169             outline-color: red
2170         .oe_form_group_row_incomplete > td:last-child:after
2171             content: "[Incomplete Row]"
2172             background: red
2173             padding: 2px
2174             font-weight: bold
2175             color: white
2176             float: right
2177         .oe_form_group_row_incomplete.oe_form_group_row_newline > td:last-child:after
2178             content: "[newline]"
2179     .oe_debug_view
2180         float: left
2181         margin-top: 5px
2182         width: auto
2183     .oe_debug_view_log
2184         font-size: 95%
2185         line-height: 1.2em
2186     // }}}
2187     // Bootstrap HACKS {{{
2188     .oe_navbar .dropdown-menu
2189         font-size: 13px
2190         padding: 4px 0
2191         background: #333333 !important
2192         background: rgba(37, 37, 37, 0.9) !important
2193         border-color: #999999
2194         border-color: rgba(0, 0, 0, 0.2)
2195         background-color: #414141
2196         text-shadow: none
2197         @include vertical-gradient(#646060, #262626)
2198         @include radius(3px)
2199         li
2200             a,a:hover,a:focus
2201                 color: #eeeeee
2202
2203     // Minimized unused white space and label weight for wizard popup
2204     .oe_view_manager_new .oe_form_nosheet
2205         margin-top: 8px
2206         .oe_form_label
2207             font-weight: normal
2208
2209     // Customize bootstrap3 for leftbar
2210     .nav-pills
2211         li > a
2212             padding: 6px 4px 2px 18px
2213             color: #4c4c4c
2214         .nav-stacked > li > ul
2215             padding-left: 16px
2216     .nav-pills > li.active,a.list-group-item.active
2217         > a
2218             background-color: #7c7bad
2219             color: white
2220             border-radius: 0
2221         a:hover,a:focus
2222             background-color: #7c7bad
2223         .badge
2224             background-color: white
2225             color: #7c7bad
2226             text-shadow: none
2227     .badge
2228         font-weight: normal
2229         font-size: 11px
2230         background-color: #7c7bad
2231
2232     // Customize for global tags
2233     h1,h2
2234         font-weight: bold
2235     h3
2236         font-size: 1.17em
2237         font-weight: bold
2238     p
2239         display: block
2240         -webkit-margin-before: 1em
2241         -webkit-margin-after: 1em
2242         -webkit-margin-start: 0px
2243         -webkit-margin-end: 0px
2244     pre
2245         background-color: #FFFFFF
2246         border: none
2247         padding: 10px 0 3px 0
2248
2249
2250
2251     // Customize for chatter
2252     h5
2253         font-weight: bold
2254         font-size: smaller
2255     .oe_form .oe_subtype label, .oe_subtype label
2256         font-weight: normal
2257     .oe_msg_subtype_check
2258         margin: 3px 3px 0 !important
2259     // }}}
2260 // Customize for kanban tooltip
2261 .jqstooltip
2262     height: auto !important
2263     width: auto !important
2264     padding: 0
2265
2266 @-moz-document url-prefix()
2267     .openerp
2268         .oe_form_field_many2one .oe_m2o_cm_button
2269             line-height: 18px
2270         .oe_webclient
2271             .oe_star_on, .oe_star_off
2272                 top: 0px
2273
2274 // Kitten Mode {{{
2275 .kitten-mode-activated
2276     background-size: cover
2277     background-attachment: fixed
2278     >*
2279         opacity: 0.70
2280 .loading-kitten
2281     @include radius(15px)
2282     @include box-shadow(0 0 5px 5px #999)
2283 // }}}
2284
2285 // jQueryUI top level {{{
2286 // The jQuery-ui overlay and Autocomplete are outside the .openerp div, please don't add indentation !!!
2287 div.ui-widget-overlay
2288     background: black
2289     @include opacity(0.3)
2290 // TODO: I think only the overlay is problematic, the other top level widgets should use $.fn.openerpClass()
2291 //       eg: $el.autocomplete().openerpClass();
2292 .ui-widget
2293     font-family: "Lucida Grande", Helvetica, Verdana, Arial, sans-serif
2294     color: #4c4c4c
2295     font-size: 13px
2296
2297 .ui-menu
2298     padding: 2px 0
2299     @include box-shadow(0 1px 4px rgba(0,0,0,0.3))
2300     margin-top: 4px
2301     border: 1px solid $tag-border
2302     .ui-menu-item
2303         width: 100%
2304         padding: 0
2305         a
2306             padding: 1px 16px
2307         a.ui-corner-all
2308             @include radius(0)
2309         a.ui-state-active
2310             background: #f0f0fa
2311     .ui-menu-item a.ui-state-hover, .ui-menu-item a.ui-state-active
2312         background: $tag-bg-dark
2313         //color: #4c4c4c
2314         //@include vertical-gradient(#f0f0fa, #eeeef6)
2315
2316 .ui-corner-all
2317     @include radius(3px)
2318 // }}}
2319
2320 .openerp
2321     .db_option_table
2322         td
2323             padding-bottom: 10px !important
2324
2325 // Server side single forms {{{
2326 @mixin single-form($width: 400px)
2327     padding: 10px
2328     position: absolute
2329     left: 50%
2330     top: 50%
2331     width: $width
2332     /* Set margins to offset 50% of the w/h */
2333     margin-top: -($width / 2)
2334     margin-left: -($width / 2)
2335
2336 body.oe_single_form
2337     background: #eee url(/web/static/src/img/form_sheetbg.png)
2338     height: 100%
2339
2340     .oe_single_form_logo
2341         padding: 10px
2342         text-align: center
2343         margin-bottom: 10px
2344
2345     .oe_single_form_footer
2346         position: absolute
2347         bottom: -30px
2348         right: 0px
2349         width: 100%
2350         text-align: center
2351
2352     .oe_single_form_container
2353         @include single-form(400px)
2354
2355 // }}}
2356
2357 // Internet Explorer 9+ specifics {{{
2358 .openerp_ie
2359     .placeholder
2360         color: $tag-border !important
2361         font-style: italic !important
2362     .oe_form_binary_file
2363         width: 80px
2364     .oe_form_field_boolean input
2365         background: #fff
2366     .db_option_table .oe_form_field_selection
2367         width: auto
2368     input[type='checkbox']
2369         border: none
2370         background: none
2371         box-shadow: none
2372     .oe_logo
2373         img
2374             border: none
2375     .oe_header_row
2376         button.oe_highlight
2377             padding-top: 0
2378             padding-bottom: 0
2379     .oe_view_manager_view_kanban
2380         display: table-cell
2381     .oe_view_manager_buttons
2382         button.oe_write_full
2383             padding-top: 0
2384             padding-bottom: 0
2385         button.oe_highlight
2386             padding-top: 0
2387             padding-bottom: 0
2388         button .oe_form_button_edit
2389             padding-top: 0
2390             padding-bottom: 0
2391         button .oe_form_button_create
2392             padding-top: 0
2393             padding-bottom: 0
2394     .oe_kanban_image
2395         border: none
2396     .oe_msg_icon
2397         border: none
2398     .oe_form
2399         header
2400             ul
2401                 height: 29px
2402     .oe_attach
2403         filter: none
2404     .oe_link
2405         filter: none
2406     .oe_kanban_show_more
2407         clear: both
2408         text-align: center
2409     &.oe_kanban_grouped .oe_kanban_show_more .oe_button
2410         width: 100%
2411         padding: 3px 12px
2412
2413     .oe_form_buttons button
2414         padding-top: 0
2415         padding-bottom: 0
2416     .oe_sidebar button
2417         padding-top: 0
2418         padding-bottom: 0
2419     img
2420         border: none
2421     //buttons.
2422     .oe_dropdown_arrow
2423         line-height: 1.7em
2424     .oe_form_buttons, .oe_view_manager_buttons
2425         button
2426             line-height: 1.7em
2427         .oe_highlight
2428             line-height: 1.7em
2429     .oe_topbar
2430         filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#646060', endColorstr='#262626')
2431     .ui-state-error, .ui-widget-content .ui-state-error, .ui-widget-header .ui-state-error
2432         filter: progid:DXImageTransform.Microsoft.gradient(enabled=false)
2433     .oe_popup_form
2434         width: 99% !important
2435     .oe_form_label
2436         white-space: normal !important
2437     ul.oe_form_status, ul.oe_form_status_clickable
2438         li
2439             display: inline-block
2440             clear: both
2441             &:last-child
2442                 overflow: hidden
2443                 border-right: 1px solid #cacaca
2444                 > .label
2445                     padding-right: 14px
2446                     border-right: none
2447                 > .arrow
2448                     display: inline-block
2449                     opacity: 0
2450                     filter: alpha(opacity = 0)
2451                     border: none
2452                     width: 0
2453                     border-right: none
2454             > .label
2455                 border-bottom: 1px solid #cacaca
2456                 background: transparent
2457             > .arrow
2458                 span
2459                     background-color: #eeeeee !important
2460         li.oe_active
2461             > .label
2462                 border-bottom: 1px solid #729fcf
2463             > .arrow span
2464                 background-color: #729fcf !important
2465
2466     .oe_webclient
2467         height: auto !important
2468 // }}}
2469
2470 // @media print {{{
2471 @media print
2472     .openerp
2473         .oe_application > div > .oe_view_manager > .oe_view_manager_wrapper > div > .oe_view_manager_body
2474             overflow: visible
2475         .oe_header_row, ul.oe_header, div.oe_mail_thread_action, .oe_mail_recthread_actions, .oe_button_box, .oe_form button, button.oe_invite, .oe_form header, .openerp .oe_notebook > li.ui-state-default, .oe_topbar, .oe_leftbar, .oe_loading
2476             // We use !important here because jQuery adds @style = display: block on elements when using $.fn.show()
2477             display: none !important
2478         .oe_list_content
2479             button, input[type=checkbox]
2480                 visibility: hidden
2481         .tree_header button, .oe_mail .oe_mail_thread_msg .oe_mail_unread, .oe_mail_fetch_more, .oe_m2o_drop_down_button img, .oe_form_field_one2many_list_row_add
2482             visibility: hidden
2483         a
2484             &.oe_m2o_cm_button, &.oe_e
2485                 visibility: hidden
2486         .oe_form
2487             .oe_form_field_date img, .oe_form_field_datetime img
2488                 visibility: hidden
2489         .oe_notebook > li.ui-tabs-selected
2490             display: block
2491         .oe_application
2492             .oe_form_sheet, .oe_form_sheetbg
2493                 border: 0px !important
2494                 box-shadow: 0px 0px 0px
2495                 .oe_list
2496                     overflow-x: visible
2497         .oe_view_manager_current > .oe_view_manager_header
2498             border: 0px !important
2499             box-shadow: 0px 0px 0px
2500         text-shadow: none
2501         .text-core .text-wrap .text-arrow
2502             background: none
2503         .openerp div.oe_mail_wall
2504             overflow: hidden !important
2505     .openerp.openerp_webclient_container
2506         overflow: visible
2507 // }}}
2508
2509 // End of customize
2510
2511 // Customize bootstrap3 for tooltip
2512 .tooltip
2513     padding: 0
2514     margin: 0
2515     font-family: "Lucida Grande", Helvetica, Verdana, Arial, sans-serif
2516     color: #4c4c4c
2517     font-size: 12px
2518     background: white
2519     text-shadow: 0 1px 1px rgba(255, 255, 255, 0.5)
2520     background-color: transparent
2521     z-index: 1800
2522     .tooltip-inner
2523         text-align: left !important
2524         max-width: 350px
2525         .oe_tooltip_string
2526             color: #FD5
2527             font-weight: bold
2528             font-size: 13px
2529         .oe_tooltip_help
2530             white-space: pre-wrap
2531         .oe_tooltip_technical
2532             padding: 0 0 4px 0
2533             margin: 5px 0 0 15px
2534             li
2535                 list-style: circle
2536         .oe_tooltip_technical_title
2537             font-weight: bold
2538         .oe_tooltip_close
2539             margin: -5px 0 0 2px
2540             cursor: default
2541             float: right
2542             color: white
2543             &:hover
2544                 color: #999
2545                 cursor: pointer
2546         .oe_tooltip_message
2547             max-width: 310px
2548
2549 // Hack for ui icon {{{
2550 .ui-icon
2551     width: 18px
2552     height: 18px
2553 // End hack}}}
2554
2555 // Customized modal according bootstrap3
2556 .modal
2557     .modal-header button.close
2558         border: none
2559         background: none
2560         padding: 1px
2561         height: 18px
2562         font-size: 20px
2563     .modal-body
2564         overflow: auto
2565         padding: 0
2566         .oe_application
2567             width: 100%
2568         .oe_popup_list
2569             display: none
2570             min-height: 150px
2571         .oe-view-manager
2572             min-height: 150px
2573         .oe_form_sheetbg
2574             .oe_form_sheet
2575                 padding: 0
2576     .modal-footer
2577         text-align: left
2578     .oe_button
2579         margin: 0 4px 0 0
2580     .oe_act_window.modal-body
2581         padding: 0
2582     .oe-view-manager-content > div
2583         position: static !important
2584
2585 @media (min-width: 768px)
2586     .modal .modal-body
2587         max-height: -webkit-calc(100vh - 170px)
2588         max-height: calc(100vh - 170px)
2589
2590 .ui-datepicker
2591     z-index: 1500 !important
2592
2593 input[type="radio"], input[type="checkbox"]
2594     margin-right: 4px
2595     margin-left: 4px
2596
2597 .blockUI.blockOverlay
2598     background-color: black
2599     opacity: 0.6000000238418579
2600
2601 /* ---- EDITOR TOUR ---- {{{ */
2602
2603 div.tour-backdrop
2604     z-index: 2009
2605 .popover.tour
2606     &.orphan .arrow
2607         display: none
2608     .popover-navigation
2609         padding: 9px 14px
2610         *[data-role="end"]
2611             float: right
2612         *[data-role="next"],*[data-role="end"]
2613             cursor: pointer
2614 .popover.fixed
2615     position: fixed
2616 .tour-backdrop
2617     position: fixed
2618     top: 0
2619     right: 0
2620     bottom: 0
2621     left: 0
2622     z-index: 1100
2623     background-color: #000
2624     opacity: 0.8
2625
2626
2627 // }}}
2628
2629 body
2630     overflow: hidden
2631
2632 @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none)
2633     .oe-view-manager-content
2634         > div
2635             position: absolute !important
2636         .oe-view-manager-content
2637             > div
2638                 position: relative !important
2639
2640
2641 // au BufWritePost,FileWritePost *.sass :!sass --style expanded --line-numbers <afile> > "%:p:r.css"
2642 // vim:tabstop=4:shiftwidth=4:softtabstop=4:fdm=marker: