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