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