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

   1 @charset "utf-8"
   2
   3 // Variables {{{
   4 $section-title-color: #8786b7
   5 $facets-border: #afafb6
   6 $facets-border-selected: #a6a6fe
   7 $hover-background: #f0f0fa
   8 $colour4: #8a89ba
   9 // }}}
  10 // Mixins {{{
  11 @font-face
  12     font-family: 'mnmliconsRegular'
  13     src: url('/web/static/src/font/mnmliconsv21-webfont.eot') format('eot')
  14     src: url('/web/static/src/font/mnmliconsv21-webfont.woff') format('woff')
  15     src: url('/web/static/src/font/mnmliconsv21-webfont.ttf') format('truetype')
  16     src: url('/web/static/src/font/mnmliconsv21-webfont.svg') format('svg') active
  17     font-weight: normal
  18     font-style: normal
  19
  20 @font-face
  21     font-family: 'EntypoRegular'
  22     src: url('/web/static/src/font/entypo-webfont.eot') format('eot')
  23     src: url('/web/static/src/font/entypo-webfont.eot?#iefix') format('embedded-opentype')
  24     src: url('/web/static/src/font/entypo-webfont.woff') format('woff')
  25     src: url('/web/static/src/font/entypo-webfont.ttf') format('truetype')
  26     src: url('/web/static/src/font/entypo-webfont.svg') format('svg') active
  27     font-weight: normal
  28     font-style: normal
  29
  30 @mixin vertical-gradient($startColor: #555, $endColor: #333)
  31     background-color: $startColor
  32     background-image: -webkit-gradient(linear, left top, left bottom, from($startColor), to($endColor)) /* Saf4+, Chrome */
  33     background-image: -webkit-linear-gradient(top, $startColor, $endColor) /* Chrome 10+, Saf5.1+, iOS 5+ */
  34     background-image:    -moz-linear-gradient(top, $startColor, $endColor) /* FF3.6 */
  35     background-image:     -ms-linear-gradient(top, $startColor, $endColor) /* IE10 */
  36     background-image:      -o-linear-gradient(top, $startColor, $endColor) /* Opera 11.10+ */
  37     background-image:         linear-gradient(to bottom, $startColor, $endColor)
  38
  39
  40 @mixin radial-gradient($gradient)
  41     background-position: center center
  42     background-image: -webkit-radial-gradient(circle, $gradient)
  43     background-image: -moz-radial-gradient($gradient)
  44     background-image: -ms-radial-gradient($gradient)
  45     background-image: radial-gradient($gradient)
  46
  47 @mixin radius($radius: 5px)
  48     -moz-border-radius: $radius
  49     -webkit-border-radius: $radius
  50     border-radius: $radius
  51
  52 @mixin box-shadow($bsval: 0px 1px 4px #777)
  53     -moz-box-shadow: $bsval
  54     -webkit-box-shadow: $bsval
  55     -box-shadow: $bsval
  56
  57 @mixin transition($transval: (border linear 0.2s, box-shadow linear 0.2s))
  58     -webkit-transition: $transval
  59     -moz-transition: $transval
  60     -ms-transition: $transval
  61     -o-transition: $transval
  62     transition: $transval
  63
  64 @mixin opacity($opacity: .5)
  65     filter: alpha(opacity=$opacity * 100)
  66     opacity: $opacity
  67
  68 @mixin background-clip($clip: padding-box)
  69     -webkit-background-clip: $clip
  70     -moz-background-clip: $clip
  71     background-clip: $clip
  72
  73 @mixin unscrew-box
  74     -moz-box-sizing: border-box
  75     -webkit-box-sizing: border-box
  76     box-sizing: border-box
  77
  78 // Transforms the (readable) text of an inline element into an mmlicons icon,
  79 // allows for actual readable text in-code (and in readers?) with iconic looks
  80 @mixin text-to-icon($icon-name, $color: #404040)
  81     font-size: 1px
  82     letter-spacing: -1px
  83     color: transparent
  84     &:before
  85         font-family: "mnmliconsRegular"
  86         content: $icon-name
  87         font-size: 20px
  88         color: $color
  89
  90 // }}}
  91
  92 .openerp.openerp-web-client-container
  93     height: 100%
  94     position: relative
  95
  96 .openerp
  97     // Global style {{{
  98     padding: 0
  99     margin: 0
 100     font-family: "Lucida Grande", Helvetica, Verdana, Arial, sans-serif
 101     color: #4c4c4c
 102     font-size: 13px
 103     background: white
 104     // }}}
 105     // Tag reset {{{
 106     a
 107         text-decoration: none
 108     table
 109         padding: 0
 110         font-size: 13px
 111         border-collapse: collapse
 112     thead
 113         font-weight: bold
 114         background-color: #f0f0f0
 115         th
 116             border-right: 1px dotted #afafb6
 117             &:last-child
 118                 border-right: none
 119     th, td
 120         padding: 0
 121         text-align: left
 122     th
 123         font-weight: bold
 124         vertical-align: middle
 125     td
 126         vertical-align: top
 127     .zebra tbody tr:nth-child(odd) td
 128         background-color: #f0f0fa
 129         @include vertical-gradient(#f0f0fa, #eeeef6)
 130     .zebra tbody tr:hover td
 131         @include vertical-gradient(#eee, #dedede)
 132     .numeric
 133         text-align: right
 134         width: 82px
 135         input
 136             text-align: right
 137     ul, li, ol
 138         margin: 0
 139         padding: 0
 140     li
 141         list-style-type: none
 142     // }}}
 143     // Generic classes {{{
 144     .oe_i
 145         font-family: "mnmliconsRegular" !important
 146         font-size: 21px
 147         font-weight: 300 !important
 148     .oe_e
 149         font-family: "entypoRegular" !important
 150         font-size: 34px
 151         font-weight: 300 !important
 152     .oe_left
 153         float: left
 154         margin-right: 8px
 155     .oe_right
 156         float: right
 157         margin-left: 8px
 158     .oe_text_right
 159         text-align: right
 160     .oe_clear
 161         clear: both
 162     .oe_wait
 163         cursor: wait
 164     .oe_fade
 165         color: #888
 166         //font-size: 12px
 167     .oe_bold
 168         font-weight: bold
 169     // }}}
 170     // Button style {{{
 171     a.button:link, a.button:visited, button, input[type='submit']
 172         display: inline-block
 173         border: 1px solid #ababab
 174         color: #404040
 175         margin: 0
 176         padding: 4px 12px
 177         font-size: 13px
 178         text-align: center
 179         @include vertical-gradient(#efefef, #d8d8d8)
 180         @include radius(3px)
 181         @include box-shadow((0 1px 2px rgba(0, 0, 0, .1), 0 1px 1px rgba(255, 255, 255, .8) inset))
 182         text-shadow: 0 1px 1px rgba(255, 255, 255, .5)
 183         -webkit-font-smoothing: antialiased
 184         outline: none
 185
 186     a.button:hover, button:hover, input[type='submit']:hover
 187         @include vertical-gradient(#f6f6f6, #e3e3e3)
 188         cursor: pointer
 189
 190     a.button:focus, button:focus, input[type='submit']:focus
 191         border: 1px solid #80bfff
 192         @include vertical-gradient(#f6f6f6, #e3e3e3)
 193         @include box-shadow((0 0 3px #80bfff, 0 1px 1px rgba(255, 255, 255, .8) inset))
 194
 195     a.button:active, a.button.active, button:active, button.active, input[type='submit']:active, input[type='submit'].active
 196         background: #e3e3e3
 197         background: -moz-linear-gradient(top, #e3e3e3, #f6f6f6) #1b468f
 198         background: -webkit-gradient(linear, left top, left bottom, from(#e3e3e3), to(#f6f6f6)) #1b468f
 199         background: linear-gradient(top, #e3e3e3, #f6f6f6) #1b468f
 200         @include box-shadow(none)
 201
 202     a.button.disabled, button:disabled, input[type='submit']:disabled
 203         background: #efefef !important
 204         border: 1px solid #d1d1d1 !important
 205         @include box-shadow(none !important)
 206         color: #aaa !important
 207         cursor: default
 208         text-shadow: 0 1px 1px #fff !important
 209
 210     button.primary
 211         color: white
 212         @include vertical-gradient(#dc5f59, #b33630)
 213         @include box-shadow(none)
 214
 215     button.primary:hover
 216         @include vertical-gradient(lighten(#dc5f59, 3%), lighten(#b33630, 3%))
 217         @include box-shadow(0 0 1px rgba(0,0,0,0.2))
 218
 219     button.primary:active
 220         @include vertical-gradient(#b33630, #dc5f59)
 221         @include box-shadow(none)
 222
 223     button.following
 224         color: white
 225         width: 120px
 226         @include vertical-gradient($colour4, darken($colour4, 3%))
 227
 228     button.unfollow
 229         display: none
 230         color: white
 231         width: 120px
 232         @include vertical-gradient(#dc5f59, #b33630)
 233
 234     // }}}
 235     // Loading {{{
 236     .oe_loading
 237         display: none
 238         z-index: 100
 239         position: fixed
 240         top: 0
 241         right: 50%
 242         padding: 4px 12px
 243         background: #A61300
 244         color: white
 245         text-align: center
 246         border: 1px solid #900
 247         border-top: none
 248         -moz-border-radius-bottomright: 8px
 249         -moz-border-radius-bottomleft: 8px
 250         border-bottom-right-radius: 8px
 251         border-bottom-left-radius: 8px
 252     // }}}
 253     // Notification {{{
 254     .oe_notification
 255         z-index: 1050
 256     // }}}
 257     // Login {{{
 258     .oe_login
 259         background: url("/web/static/src/img/pattern.png") repeat
 260         text-align: center
 261         font-size: 14px
 262         height: 100%
 263         li
 264             list-style-type: none
 265             padding-bottom: 4px
 266         button
 267             float: right
 268             display: inline-block
 269             cursor: pointer
 270             padding: 6px 16px
 271             border: 1px solid #222
 272             color: white
 273             margin: 0
 274             @include vertical-gradient(#b92020, #600606)
 275             @include radius(4px)
 276             @include box-shadow((0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 1px rgba(155, 155, 155, 0.4) inset))
 277         input, select
 278             width: 252px
 279             font-family: "Lucida Grande", Helvetica, Verdana, Arial
 280             border: 1px solid #999999
 281             background: whitesmoke
 282             @include box-shadow(inset 0 1px 4px rgba(0, 0, 0, 0.3))
 283             @include radius(3px)
 284         input
 285             margin-bottom: 9px
 286             padding: 5px 6px
 287         select
 288             padding: 1px
 289         .oe_login_dbpane
 290             position: fixed
 291             top: 0
 292             right: 8px
 293             padding: 5px 10px
 294             color: #eee
 295             border: solid 1px #333
 296             background: #1e1e1e
 297             background: rgba(30,30,30,0.94)
 298             @include radius(0 0 8px 8px)
 299             input
 300                 padding: 2px 4px
 301                 margin: 4px 0
 302         .oe_login_bottom
 303             position: absolute
 304             top: 50%
 305             left: 0
 306             right: 0
 307             bottom: 0
 308             text-shadow: 0 1px 1px #999999
 309             @include vertical-gradient(#b41616, #600606)
 310         .oe_login_pane
 311             position: absolute
 312             top: 50%
 313             left: 50%
 314             margin: -160px -166px
 315             border: solid 1px #333333
 316             background: #1e1e1e
 317             background: rgba(30,30,30,0.94)
 318             padding: 22px 32px
 319             color: #eee
 320             text-align: left
 321             @include radius(8px)
 322             @include box-shadow(0 0 18px rgba(0, 0, 0, 0.9))
 323             h2
 324                 margin-top: 0
 325                 font-size: 18px
 326         .oe_login_logo
 327             position: absolute
 328             top: -70px
 329             left: 0
 330             width: 100%
 331             margin: 0 auto
 332             text-align: center
 333         .oe_login_footer
 334             position: absolute
 335             bottom: -40px
 336             left: 0
 337             width: 100%
 338             text-align: center
 339             a
 340                 color: #eee
 341                 margin: 0 8px
 342                 &:hover
 343                     text-decoration: underline
 344             span
 345                 font-weight: bold
 346                 font-size: 16px
 347         .oe_login_error_message
 348             display: none
 349             background-color: #b41616
 350             color: #eee
 351             padding: 14px 18px
 352             margin-top: 15px
 353             text-align: center
 354             @include radius(4px)
 355             @include box-shadow(0 1px 4px rgba(0, 0, 0, 0.8))
 356     .oe_login_invalid
 357         .oe_login_error_message
 358             display: inline-block
 359     // }}}
 360     // DatabaseManager {{{
 361     .oe_database_manager
 362         background: #fff
 363         color: #000
 364         text-align: left
 365         .oe_database_manager_menu
 366             color: #000
 367     // }}}
 368     // WebClient {{{
 369     .oe_webclient
 370         width: 100%
 371         height: 100%
 372         border-spacing: 0px
 373     // }}}
 374     // WebClient.fullscreen {{{
 375     .oe_content_full_screen
 376         .oe_application
 377             top: 0
 378             left: 0
 379         .oe_topbar, .oe_leftbar
 380             display: none
 381     // }}}
 382     // WebClient.topbar {{{
 383     .oe_topbar
 384         width: 100%
 385         height: 31px
 386         border-top: solid 1px #d3d3d3
 387         @include vertical-gradient(#646060, #262626)
 388
 389         .oe_topbar_item
 390             li
 391                 float: left
 392                 a
 393                     display: block
 394                     padding: 5px 10px 7px
 395                     line-height: 20px
 396                     height: 20px
 397                     color: #eee
 398                     vertical-align: top
 399                     text-shadow: 0 1px 1px rgba(0,0,0,0.2)
 400                     &:hover
 401                         background: #303030
 402                         color: white
 403                         @include box-shadow(0 1px 2px rgba(255,255,255,0.3) inset)
 404             .oe_active
 405                 background: #303030
 406                 font-weight: bold
 407                 color: white
 408                 @include box-shadow(0 1px 2px rgba(255,255,255,0.3) inset)
 409
 410         .oe_topbar_avatar
 411             width: 24px
 412             height: 24px
 413             margin: -2px 2px 0 0
 414             @include radius(4px)
 415         .oe_topbar_avatar
 416             vertical-align: top
 417         .oe_dropdown_toggle:after
 418             width: 0
 419             height: 0
 420             display: inline-block
 421             content: "&darr"
 422             text-indent: -99999px
 423             vertical-align: top
 424             margin-top: 8px
 425             margin-left: 4px
 426             border-left: 4px solid transparent
 427             border-right: 4px solid transparent
 428             border-top: 4px solid white
 429             @include opacity(0.5)
 430     // }}}
 431     // Webclient.leftbar {{{
 432     .oe_leftbar
 433         width: 220px
 434         background: #f0eeee
 435         border-right: 1px solid #afafb6
 436         text-shadow: 0 1px 1px white
 437         padding-bottom: 16px
 438         line-height: 18px
 439     a.oe_logo
 440         width: 220px
 441         display: block
 442         text-align: center
 443         height: 70px
 444         line-height: 70px
 445         img
 446             height: 40px
 447             width: 157px
 448             margin: 14px 0
 449     .oe_footer
 450         position: fixed
 451         bottom: 0
 452         padding: 4px 0
 453         background: #f0eeee
 454         width: 220px
 455         text-align: center
 456         a
 457             font-weight: 800
 458             font-family: serif
 459             font-size: 16px
 460             color: black
 461             span
 462                 color: #c81010
 463                 font-style: italic
 464     // }}}
 465     // UserMenu {{{
 466     .oe_user_menu
 467         float: right
 468         padding: 0
 469         margin: 0
 470         li
 471             list-style-type: none
 472             float: left
 473         .oe_dropdown
 474             position: relative
 475
 476         .oe_dropdown_options
 477             float: left
 478             background: #333
 479             background: rgba(37,37,37,0.9)
 480             display: none
 481             position: absolute
 482             top: 32px
 483             right: -1px
 484             border: 0
 485             z-index: 900
 486             margin-left: 0
 487             margin-right: 0
 488             padding: 6px 0
 489             zoom: 1
 490             border-color: #999
 491             border-color: rgba(0, 0, 0, 0.2)
 492             border-style: solid
 493             border-width: 0 1px 1px
 494             @include radius(0 0 6px 6px)
 495             @include box-shadow(0 1px 4px rgba(0,0,0,0.3))
 496             @include background-clip()
 497             li
 498                 float: none
 499                 display: block
 500                 background-color: none
 501                 a
 502                     white-space: nowrap
 503                     display: block
 504                     padding: 4px 15px
 505                     clear: both
 506                     font-weight: normal
 507                     line-height: 18px
 508                     color: #eee
 509                     &:hover
 510                         @include vertical-gradient(#292929, #191919)
 511                         @include box-shadow(none)
 512                 hr
 513                     border-top: 1px solid #999
 514                     border-bottom: 0
 515     // }}}
 516     // Systray {{{
 517     .oe_systray > div
 518         float: left
 519         padding: 0 4px 0 4px
 520     .oe_systray
 521         float: right
 522
 523         .oe_systray_dropdown
 524             position: relative
 525         .oe_systray_dropdown:hover .oe_systray_dropdown_options
 526             display: block
 527         .oe_systray_dropdown_options
 528             background: #333
 529             background: rgba(37,37,37,0.9)
 530             display: none
 531             position: absolute
 532             z-index: 900
 533             border: 0
 534             margin-left: 0
 535             margin-right: 0
 536             padding: 6px 0
 537             border-color: #999
 538             border-color: rgba(0, 0, 0, 0.2)
 539             border-style: solid
 540             border-width: 0 1px 1px
 541             @include radius(0 0 6px 6px)
 542             @include box-shadow(0 1px 4px rgba(0,0,0,0.3))
 543             @include background-clip()
 544             li
 545                 float: none
 546                 display: block
 547                 background-color: none
 548                 a
 549                     display: block
 550                     padding: 4px 15px
 551                     clear: both
 552                     font-weight: normal
 553                     line-height: 18px
 554                     color: #eee
 555                     &:hover
 556                         @include vertical-gradient(#292929, #191919)
 557                         @include box-shadow(none)
 558     // }}}
 559     // Menu {{{
 560     .oe_menu
 561         float: left
 562         padding: 0
 563         margin: 0
 564         li
 565             float: left
 566         a
 567             display: block
 568             padding: 5px 10px 7px
 569             line-height: 20px
 570             height: 20px
 571             color: #eee
 572             vertical-align: top
 573             text-shadow: 0 1px 1px rgba(0,0,0,0.2)
 574             &:hover
 575                 background: #303030
 576                 color: white
 577                 @include box-shadow(0 1px 2px rgba(255,255,255,0.3) inset)
 578         .oe_active
 579             background: #303030
 580             font-weight: bold
 581             color: white
 582             @include box-shadow(0 1px 2px rgba(255,255,255,0.3) inset)
 583     .oe_menu_more_container
 584         position: relative
 585         .oe_menu_more
 586             position: absolute
 587             padding: 0
 588             background-color: #646060
 589             z-index: 1
 590             border: 1px solid black
 591             border-bottom-left-radius: 5px
 592             border-bottom-right-radius: 5px
 593             li
 594                 float: none
 595                 a
 596                     white-space: nowrap
 597     .oe_secondary_menu_section
 598         font-weight: bold
 599         margin-left: 8px
 600         color: $colour4
 601     .oe_secondary_submenu
 602         padding: 2px 0 8px 0
 603         margin: 0
 604         width: 100%
 605         display: inline-block
 606         > li
 607             position: relative
 608             padding: 1px 0 1px 20px
 609             a
 610                 display: block
 611                 color: #4c4c4c
 612                 padding: 2px 4px 2px 0
 613             .oe_menu_label
 614                 position: absolute
 615                 top: 1px
 616                 right: 1px
 617                 font-size: 10px
 618                 background: $colour4
 619                 color: white
 620                 padding: 2px 4px
 621                 margin: 1px 6px 0 0
 622                 border: 1px solid lightGray
 623                 text-shadow: 0 1px 1px rgba(0,0,0,0.2)
 624                 @include radius(4px)
 625                 @include box-shadow(inset 0 1px 1px rgba(0, 0, 0, 0.2))
 626         .oe_menu_counter
 627             float: right
 628             background: #8a89ba
 629             color: #eee
 630             font-size: 12px
 631             border: 1px solid lightgray
 632             padding: 0px 4px 0px 4px
 633             text-shadow: 0 1px 1px rgba(0,0,0,0.2)
 634             margin: 0px
 635             @include radius(4px)
 636         .oe_active
 637             background: $colour4
 638             border-top: 1px solid lightGray
 639             border-bottom: 1px solid lightGray
 640             text-shadow: 0 1px 1px rgba(0,0,0,0.2)
 641             @include box-shadow(inset 0 1px 1px rgba(0, 0, 0, 0.2))
 642             a
 643                 color: white
 644             .oe_menu_label
 645                 background: #eee
 646                 color: $colour4
 647                 text-shadow: 0 1px 1px white
 648                 @include box-shadow(0 1px 1px rgba(0, 0, 0, 0.2))
 649             .oe_menu_counter
 650                 background: #eee
 651                 color: #8a89ba
 652         .oe_menu_toggler:before
 653             width: 0
 654             height: 0
 655             display: inline-block
 656             content: "&darr"
 657             text-indent: -99999px
 658             vertical-align: top
 659             margin-left: -12px
 660             margin-top: 4px
 661             margin-right: 4px
 662             border-top: 4px solid transparent
 663             border-bottom: 4px solid transparent
 664             border-left: 4px solid #4c4c4c
 665             @include opacity(0.5)
 666         .oe_menu_opened:before
 667             margin-top: 6px
 668             margin-left: -16px
 669             margin-right: 4px
 670             border-left: 4px solid transparent
 671             border-right: 4px solid transparent
 672             border-top: 4px solid #4c4c4c
 673     // }}}
 674     // ActionManager {{{
 675     .oe_application
 676         width: 100%
 677         a
 678             color: $colour4
 679             &:hover
 680                 text-decoration: underline
 681     // }}}
 682     // Content Header MIT {{{
 683     .oe-view-manager-header
 684         border-top: 1px solid #cacaca
 685         border-bottom: 1px solid #cacaca
 686         @include vertical-gradient(#fcfcfc, #dedede)
 687         @include box-shadow((0 1px 0 rgba(255,255,255,0.4), 0 0 9px rgba(0,0,0,0.1)))
 688         h2
 689             float: left
 690             font-size: 18px
 691             margin: 1px 0
 692             a
 693                 color: $colour4
 694         .buttons
 695             padding-right: 8px
 696             li
 697                 float: left
 698                 margin-right: 12px
 699         .filter
 700             vertical-align: top
 701             li
 702                 height: 24px
 703                 line-height: 24px
 704                 padding: 0 8px
 705         .header-row
 706             height: 26px
 707             line-height: 26px
 708             margin: 8px
 709             clear: both
 710             text-shadow: 0 1px 1px white
 711             .dropdown-toggle:after
 712                 margin-top: 7px
 713                 margin-left: 6px
 714                 border-top-color: #404040
 715         .oe_vm_switch
 716             li
 717                 padding-left: 1px
 718                 text-align: center
 719                 width: 24px
 720                 height: 24px
 721                 line-height: 24px
 722         .pagination
 723             li
 724                 height: 24px
 725                 line-height: 24px
 726                 padding: 0 8px
 727         .button-group
 728             display: inline-block
 729             border: 1px solid #ababab
 730             @include radius(5px)
 731             li
 732                 float: left
 733                 border-right: 1px solid #ababab
 734                 &:last-child
 735                     border: none
 736             a
 737                 color: #4c4c4c
 738                 &:hover
 739                     text-decoration: none
 740             .active
 741                 width: 100%
 742                 background: #999
 743                 @include box-shadow(0 1px 4px rgba(0,0,0,0.3) inset)
 744                 color: #fff
 745                 text-shadow: 0 1px 2px rgba(0,0,0,0.4)
 746     // }}}
 747     // ViewManager.header {{{
 748     .oe_view_manager_header
 749         width: 100%
 750         border-top: 1px solid #cacaca
 751         border-bottom: 1px solid #cacaca
 752         @include vertical-gradient(#fcfcfc, #dedede)
 753         @include box-shadow((0 1px 0 rgba(255,255,255,0.4), 0 0 9px rgba(0,0,0,0.1)))
 754         .oe_header_row
 755             //min-height: 26px
 756             //line-height: 26px
 757             clear: both
 758             text-shadow: 0 1px 1px white
 759             td
 760                 padding: 8px
 761         .oe_header_row:last-child
 762             td
 763                 padding-top: 0
 764         .oe_header_row:first-child
 765             td
 766                 padding-top: 8px
 767         .oe_view_manager_sidebar
 768             margin: 0px auto
 769             width: 400px
 770             text-align: center
 771         td
 772             line-height: 26px
 773         h2
 774             font-size: 18px
 775             margin: 0
 776             float: left
 777             a
 778                 color: $colour4
 779         .oe_button_group
 780             display: inline-block
 781             border: 1px solid #ababab
 782             @include radius(5px)
 783             li
 784                 float: left
 785                 border-right: 1px solid #ababab
 786                 &:last-child
 787                     border: none
 788             a
 789                 color: #4c4c4c
 790                 &:hover
 791                     text-decoration: none
 792             .active
 793                 background: #999
 794                 @include box-shadow(0 1px 4px rgba(0,0,0,0.3) inset)
 795                 a
 796                     color: #fff
 797                     text-shadow: 0 1px 2px rgba(0,0,0,0.4)
 798         .oe_view_manager_buttons
 799             white-space: nowrap
 800     // }}}
 801     // ViewManager.pager {{{
 802     .oe_view_manager_pager
 803         line-height: 26px
 804     .oe_pager_value
 805         float: left
 806         margin-right: 8px
 807     .oe_pager_group
 808         float: left
 809         height: 24px
 810         line-height: 24px
 811         display: inline-block
 812         border: 1px solid #ababab
 813         cursor: pointer
 814         @include radius(5px)
 815         li
 816             height: 24px
 817             line-height: 24px
 818             padding: 0
 819             float: left
 820             border-right: 1px solid #ababab
 821             &:last-child
 822                 border: none
 823         a
 824             color: #4c4c4c
 825             padding: 0 8px
 826             &:hover
 827                 text-decoration: none
 828         .active
 829             background: #999
 830             @include box-shadow(0 1px 4px rgba(0,0,0,0.3) inset)
 831             a
 832                 color: #fff
 833                 text-shadow: 0 1px 2px rgba(0,0,0,0.4)
 834     // }}}
 835     // ViewManager.switches {{{
 836     .oe_view_manager_switch
 837         li
 838             text-align: center
 839             width: 24px
 840             height: 24px
 841             line-height: 16px
 842             a
 843                 position: relative
 844         .oe_vm_switch_list:after, .oe_vm_switch_tree:after
 845             padding: 2px
 846             content: "i"
 847         .oe_vm_switch_graph:after
 848             font-family: "mnmliconsRegular" !important
 849             font-size: 21px
 850             font-weight: 300 !important
 851             content: "}"
 852             top: -2px
 853             position: relative
 854         .oe_vm_switch_gantt:after
 855             font-family: "mnmliconsRegular" !important
 856             font-size: 21px
 857             font-weight: 300 !important
 858             content: "y"
 859             top: -2px
 860             position: relative
 861         .oe_vm_switch_calendar:after
 862             content: "P"
 863         .oe_vm_switch_kanban:after
 864             content: "k"
 865         .oe_vm_switch_diagram:after
 866             content: "f"
 867     // }}}
 868     // ViewManager.sidebar {{{
 869     .oe_form_dropdown_section
 870         position: relative
 871         display: inline-block
 872     .oe_dropdown_toggle:after
 873         width: 0
 874         height: 0
 875         display: inline-block
 876         content: "&darr"
 877         text-indent: -99999px
 878         vertical-align: top
 879         border-left: 4px solid transparent
 880         border-right: 4px solid transparent
 881         border-top: 4px solid white
 882         @include opacity(0.5)
 883         margin-top: 7px
 884         margin-left: 6px
 885         border-top-color: #404040
 886     .oe_dropdown_menu
 887         display: none
 888         position: absolute
 889         top: 28px
 890         left: 0px
 891         padding: 8px
 892         border: 1px solid #afafb6
 893         width: 120px
 894         overflow-x: hidden
 895         z-index: 900
 896         text-align: left
 897         background: white
 898         @include radius(3px)
 899         @include box-shadow(0 1px 4px rgba(0,0,0,0.3))
 900         li
 901             list-style-type: none
 902             float: none
 903             display: block
 904             background-color: none
 905             a
 906                 display: block
 907                 padding: 3px 6px
 908                 clear: both
 909                 font-weight: normal
 910                 line-height: 14px
 911                 color: #4c4c4c
 912                 text-decoration: none
 913                 cursor: pointer
 914                 &:hover
 915                     text-decoration: none
 916                     @include vertical-gradient(#f0f0fa, #eeeef6)
 917                     @include box-shadow(none)
 918     .oe_sidebar
 919         white-space: nowrap
 920     // }}}
 921     // SearchView xmo {{{
 922     .oe_searchview
 923         cursor: text
 924         position: relative
 925         float: right
 926         padding-right: 20px
 927         width: 410px
 928         border: 1px solid #ababab
 929         background: white
 930         @include radius(1em)
 931         @include box-shadow(0 1px 2px rgba(0,0,0,0.2) inset)
 932
 933         &.oe_focused
 934             border-color: $facets-border-selected
 935             @include box-shadow(0 1px 2px $facets-border-selected inset)
 936
 937         .oe_searchview_clear
 938             cursor: pointer
 939             position: absolute
 940             top: 0
 941             right: 22px
 942             width: 15px
 943             height: 100%
 944             background: url(../img/attachments-close.png) center center no-repeat
 945
 946         .oe_searchview_unfold_drawer
 947             position: absolute
 948             top: 0
 949             right: 0
 950             height: 100%
 951             line-height: 2.5em
 952             padding: 0 7px 0 4px
 953             color: #ccc
 954             cursor: pointer
 955             &:hover
 956                 color: #999
 957             &:before
 958                 content: "◀"
 959
 960         .oe_searchview_facets
 961             &:before
 962                 color: #ccc
 963                 font-family: "mnmliconsRegular"
 964                 content: "r"
 965                 font-size: 150%
 966                 padding: 0 1px 0 3px
 967                 display: inline
 968
 969             *
 970                 vertical-align: top
 971                 display: inline-block
 972                 line-height: 26px
 973
 974             .oe_searchview_input, .oe_searchview_facet
 975                 height: 26px
 976                 &:focus
 977                     outline: none
 978
 979             .oe_searchview_input
 980                 padding: 0 3px
 981
 982             .oe_searchview_facet
 983                 position: relative
 984                 cursor: pointer
 985                 border: 1px solid $facets-border
 986                 @include radius(3px)
 987                 background: #8786b7
 988                 -webkit-font-smoothing: auto
 989                 padding-left: 1.1em
 990                 // spacing for opera, FF
 991                 margin: 1px 0
 992
 993                 &:focus
 994                     border-color: $facets-border-selected
 995                     @include box-shadow(0 0 3px 1px $facets-border-selected)
 996
 997                 .oe_facet_values
 998                     background: #f0f0fa
 999                     @include radius(0 3px 3px 0)
1000
1001                 .oe_facet_category, .oe_facet_value
1002                     height: 24px
1003                     padding: 1px 0.1em
1004
1005                 .oe_facet_category
1006                     color: white
1007                     text-shadow: 0 1px 1px rgba(0, 0, 0, 0.4)
1008
1009                 .oe_facet_value
1010                     border-left: 1px solid $facets-border
1011
1012                 .oe_facet_remove
1013                     position: absolute
1014                     top: 0
1015                     left: 2px
1016                     color: white
1017
1018                     &:hover
1019                         color: #ccc
1020
1021         &.oe_searchview_open_drawer
1022             .oe_searchview_drawer
1023                 display: block
1024             .oe_searchview_unfold_drawer:before
1025                 content: "▼"
1026
1027         .oe_searchview_drawer
1028             position: absolute
1029             z-index: 1
1030             // detach drawer from field slightly
1031             margin-top: 3px
1032             top: 100%
1033             right: 0
1034             background-color: white
1035             min-width: 100%
1036             display: none
1037             border: 1px solid #ccc
1038             text-align: left
1039             padding-bottom: 0.5em
1040             @include radius(1em)
1041
1042             > div
1043                 border-top: 1px solid #ccc
1044                 margin: 3px 0
1045             > div:first-child
1046                 border-top: none
1047                 margin: 0
1048
1049             h4, h4 *
1050                 margin: 0
1051                 cursor: pointer
1052
1053             h4:before
1054                 content: "▸ "
1055
1056             button, .button
1057                 border: none
1058                 background: transparent
1059                 padding: 0 2px
1060                 @include box-shadow(none)
1061                 @include radius(0)
1062
1063             .oe_searchview_filters
1064                 display: table
1065                 width: 100%
1066
1067                 > div
1068                     @include unscrew-box
1069                     display: table-cell
1070                     width: 50%
1071
1072                 h3
1073                     margin: 2px 4px 2px 8px
1074                     color: $section-title-color
1075
1076                 ul
1077                     margin: 0 12px 3px
1078                     padding: 0
1079                     list-style: none
1080
1081                 li
1082                     list-style: none
1083                     padding: 3px 6px 3px 18px
1084                     line-height: 14px
1085                     color: inherit
1086                     cursor: pointer
1087
1088                     &.oe_selected
1089                         background: url(/web/static/src/img/icons/gtk-apply.png) left 2px no-repeat
1090                     // after oe_selected so background color is not overridden
1091                     &:hover
1092                         background-color: $hover-background
1093
1094
1095             .oe_searchview_custom
1096                 form
1097                     display: none
1098
1099                     button
1100                         @include text-to-icon("S")
1101                 li
1102                     cursor: pointer
1103                     position: relative
1104                     line-height: 1.2em
1105                     padding: 2px 20px 2px 25px
1106
1107                     &.oe_searchview_custom_private
1108                         background: url(/web/static/src/img/icons/terp-locked.png) 5px center no-repeat
1109
1110                     &:hover
1111                         background-color: $hover-background
1112
1113                     button
1114                         position: absolute
1115                         top: 0
1116                         right: 5px
1117
1118
1119             .oe_searchview_advanced
1120                 form
1121                     display: none
1122
1123                 button.oe_add_condition:before
1124                     content: "⊞ "
1125                 button.oe_apply:before
1126                     content: "⚡ "
1127
1128                 ul
1129                     list-style: none
1130                     padding: 0
1131                 li
1132                     list-style: none
1133                     margin: 0
1134                     white-space: nowrap
1135
1136             .oe_opened
1137                 h4:before
1138                     content: "▾ "
1139                 form
1140                     display: block
1141
1142             // delete buttons
1143             .oe_searchview_custom_delete, .searchview_extended_delete_prop
1144                 @include text-to-icon("d")
1145     // }}}
1146     // Views Common {{{
1147     .oe_view_nocontent
1148         > img
1149             float: left
1150             margin: 1.5em
1151         > div
1152             // don't encroach on my arrow
1153             overflow: hidden
1154             padding: 35px 0px 0px 0px
1155             max-width: 700px
1156             font-size: 125%
1157     .oe_view_topbar
1158         border-bottom: 1px solid #cacaca
1159         @include vertical-gradient(#fcfcfc, #dedede)
1160         padding: 0 8px
1161         line-height: 30px
1162     // }}}
1163     // FormView.body {{{
1164     .oe_formview
1165         background: white
1166     .oe_form_header
1167         padding: 8px
1168     .oe_form_invalid
1169         input, select, textarea
1170             background-color: #F66 !important
1171             border: 1px solid #D00 !important
1172     .oe_form_button_save_dirty
1173         color: white
1174         background: #dc5f59
1175         background: -moz-linear-gradient(#dc5f59, #b33630)
1176         background: -webkit-gradient(linear, left top, left bottom, from(#dc5f59), to(#b33630))
1177         background: -webkit-linear-gradient(#dc5f59, #b33630)
1178         -moz-box-shadow: none
1179         -webkit-box-shadow: none
1180         -box-shadow: none
1181         font-weight: bold
1182         &:hover
1183             background: #ED6F6A
1184     // }}}
1185     // FormView.customdivs {{{
1186     .oe_form_topbar
1187         border-bottom: 1px solid #cacaca
1188         @include vertical-gradient(#fcfcfc, #dedede)
1189         padding: 0 8px
1190         line-height: 30px
1191         button
1192             font-size: 12px
1193             height: 24px !important
1194             line-height: 24px
1195             vertical-align: top
1196             padding: 0 10px
1197             margin: 3px 4px 3px 0
1198             span.i
1199                 line-height: 20px
1200                 height: 24px
1201         ul
1202             height: 30px
1203             padding: 0
1204             margin: 0
1205             text-shadow: 0 1px 1px white
1206             border-left: 1px solid #cacaca
1207             border-right: 1px solid #cacaca
1208             li
1209                 padding: 0
1210                 margin: 0
1211                 float: left
1212                 vertical-align: top
1213                 border-right: 1px solid #cacaca
1214                 height: 30px
1215                 padding: 0 12px
1216                 &:first-child
1217                     border-left: 1px solid #cacaca
1218                 a
1219                     color: #4c4c4c
1220                     &:hover
1221                         color: black
1222         .oe_form_steps
1223             img
1224                 margin: 0 8px
1225                 vertical-align: top
1226             li
1227                 border-right: none
1228                 padding: 0
1229                 &:first-child
1230                     margin-left: 12px
1231                     border-left: none
1232                 &:last-child
1233                     margin-right: 12px
1234         .oe_form_steps_active
1235             font-weight: bold
1236             color: #b33630
1237     .oe_form_topbar.oe_form_topbar_hifirst button:first-child, button.oe_form_button_hi
1238         color: white
1239         background: #DC5F59
1240         background: -moz-linear-gradient(#DC5F59, #B33630)
1241         background: -webkit-gradient(linear, left top, left bottom, from(#DC5F59), to(#B33630))
1242         background: -webkit-linear-gradient(#DC5F59, #B33630)
1243         -moz-box-shadow: none
1244         -webkit-box-shadow: none
1245         -box-shadow: none
1246     .oe_form_topbar.oe_form_topbar_hifirst button:first-child:hover, button.oe_form_button_hi:hover
1247         background: #DF6B66
1248         background: -moz-linear-gradient( #DF6B66, #BF3A33)
1249         background: -webkit-gradient(linear, left top, left bottom, from( #DF6B66), to( #BF3A33))
1250         background: -webkit-linear-gradient( #DF6B66, #BF3A33)
1251         -moz-box-shadow: 0 0 1px rgba(0, 0, 0, 0.2)
1252         -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0.2)
1253         -box-shadow: 0 0 1px rgba(0, 0, 0, 0.2)
1254     .oe_application
1255         .oe_form_sheetbg
1256             background: url(/web/static/src/img/form_sheetbg.png)
1257             padding: 8px 0
1258             border-bottom: 1px solid #ddd
1259         .oe_form_sheet_width, .oe_form_bottom
1260             min-width: 650px
1261             max-width: 980px
1262             margin: 0 auto
1263         .oe_form_sheet
1264             padding: 8px 8px 8px 8px
1265             background: white
1266             min-height: 420px
1267             border: 1px solid #afafb6
1268             @include box-shadow(0 0 10px rgba(0,0,0,0.3))
1269     // }}}
1270     // FormView.layout {{{
1271     .oe_form
1272         .oe_form_group_cell
1273             line-height: 18px
1274             padding: 2px
1275             height: 20px
1276         .oe_form_group_cell > .oe_form_field_many2one,
1277         .oe_form_group_cell > .oe_form_field_many2one input,
1278         .oe_form_group_cell > .oe_form_field_char input,
1279         .oe_form_group_cell > .oe_form_field_text textarea,
1280         .oe_form_group_cell > .oe_form_field_email,
1281         .oe_form_group_cell > .oe_form_field_email input,
1282         .oe_form_group_cell > .oe_form_field_url,
1283         .oe_form_group_cell > .oe_form_field_url input,
1284         .oe_form_group_cell > .oe_form_field_float input,
1285         .oe_form_group_cell > .oe_form_field_selection select,
1286         .oe_form_group_cell > div > .oe_datepicker_root,
1287         .oe_form_group_cell > div > .oe_datepicker_root > input.oe_datepicker_master
1288             width: 100%
1289         .oe_form_group_cell.oe_form_group_nested
1290             padding: 0
1291     // }}}
1292     // FormView.label {{{
1293     .oe_form
1294         .oe_form_label_help[for], .oe_form_label[for]
1295             font-weight: bold
1296             white-space: nowrap
1297             padding-right: 8px
1298             span
1299                 font-size: 80%
1300                 color: darkGreen
1301                 vertical-align: top
1302                 position: relative
1303                 top: -4px
1304                 padding: 0 2px
1305     // }}}
1306     // FormView.fields {{{
1307     .oe_form
1308         h2 input
1309             font-size: 20px
1310             font-weight: bold
1311             height: 30px
1312         textarea
1313             resize: vertical
1314         input[type="text"],
1315         input[type="password"],
1316         input[type="file"],
1317         select
1318             height: 22px
1319             padding-top: 2px
1320         input[type="text"],
1321         input[type="password"],
1322         input[type="file"],
1323         select,
1324         textarea
1325             -moz-box-sizing: border-box
1326             -webkit-box-sizing: border-box
1327             -ms-box-sizing: border-box
1328             box-sizing: border-box
1329             padding: 0 2px
1330             margin: 0 2px
1331             border: 1px solid #999
1332             -moz-border-radius: 3px
1333             -webkit-border-radius: 3px
1334             border-radius: 3px
1335             background: white
1336             min-width: 70px
1337             color: #1f1f1f
1338         input[readonly],
1339         select[readonly],
1340         textarea[readonly],
1341         input[disabled],
1342         select[disabled]
1343             background: #E5E5E5 !important
1344             color: #666
1345         textarea[disabled]
1346             border: none
1347             border-left: 8px solid #eee
1348             padding-left: 8px
1349             @include box-shadow(none)
1350             @include radius(0px)
1351         .oe_form_field_many2one input,
1352         .oe_form_field_binary input,
1353         .oe_form_field_binary input,
1354         .oe_form_field_email input,
1355         .oe_form_field_url input
1356             border-right: none
1357             -webkit-border-top-right-radius: 0px
1358             -webkit-border-bottom-right-radius: 0px
1359             -moz-border-radius-topright: 0px
1360             -moz-border-radius-bottomright: 0px
1361             border-top-right-radius: 0px
1362             border-bottom-right-radius: 0px
1363         .oe_form_field_email button img,
1364         .oe_form_field_url button img
1365             vertical-align: top
1366         .oe_form_field_date,
1367         .oe_form_field_datetime
1368             white-space: nowrap
1369         .oe_form_field_boolean
1370             padding-top: 4px
1371         .oe_form_field_datetime input
1372             min-width: 11em
1373         .oe_form_field_many2manytags
1374             .text-wrap
1375                 width: 100% !important
1376                 textarea
1377                     width: 100% !important
1378             .oe_form_field_many2manytags_box
1379                 border-radius: 2px
1380                 box-sizing: border-box
1381                 position: relative
1382                 float: left
1383                 border: 1px solid #9DACCC
1384                 background: #E2E6F0
1385                 color: black
1386                 padding: 0px 3px 0px 3px
1387                 margin: 0 2px 2px 0
1388                 cursor: pointer
1389                 height: 16px
1390                 font: 11px "lucida grande", tahoma, verdana, arial, sans-serif
1391             .text-core .text-wrap .text-dropdown .text-list .text-suggestion em
1392                 font-style: italic
1393                 text-decoration: none
1394         .oe_datepicker_container
1395             display: none
1396         .oe_datepicker_root
1397             display: inline-block
1398         .oe_form_required
1399             input, select, textarea
1400                 background-color: #D2D2FF !important
1401         .oe_form_invalid
1402             input, select, textarea
1403                 background-color: #F66 !important
1404                 border: 1px solid #D00 !important
1405         .oe_button.oe_field_button
1406             display: block
1407             -webkit-border-top-left-radius: 0px
1408             -webkit-border-bottom-left-radius: 0px
1409             -moz-border-radius-topleft: 0px
1410             -moz-border-radius-bottomleft: 0px
1411             border-top-left-radius: 0px
1412             border-bottom-left-radius: 0px
1413             margin-right: -1px
1414             height: 22px
1415         .oe_input_icon
1416             cursor: pointer
1417             margin: 3px 0 0 -21px
1418             vertical-align: top
1419         .oe_input_icon_disabled
1420             position: absolute
1421             cursor: default
1422             opacity: 0.5
1423             filter: alpha(opacity=50)
1424             right: 5px
1425             top: 3px
1426         .oe_form_group_cell .oe_kanban_view
1427             // Hack due to absolute positioning of kanban view messing with o2m
1428             position: static
1429     // }}}
1430     // FormView.buttons {{{
1431     .oe_form
1432         .oe_form_button.oe_button
1433             height: 22px
1434             color: #4c4c4c
1435             span
1436                 position: relative
1437                 vertical-align: top
1438         .oe_form_button > img
1439             vertical-align: -3px
1440             padding: 0 2px
1441         .oe_form_group_cell > .oe_form_button.oe_button
1442             display: block
1443             white-space: nowrap
1444             min-width: 100%
1445             width: 100%
1446     // }}}
1447     // FormView.binaryfile {{{
1448     /* http://www.quirksmode.org/dom/inputfile.html
1449      * http://stackoverflow.com/questions/2855589/replace-input-type-file-by-an-image
1450      */
1451     .oe_form
1452         .oe-binary-file-set
1453             overflow: hidden
1454             position: relative
1455             display: inline-block
1456             width: 45px
1457             height: 30px
1458         input.oe-binary-file
1459             z-index: 0
1460             line-height: 0
1461             font-size: 12px
1462             position: absolute
1463             // Should be adjusted for all browsers
1464             top: 1px
1465             right: 10px
1466             opacity: 0
1467             filter: alpha(opacity = 0)
1468             -ms-filter: "alpha(opacity=0)"
1469             margin: 0
1470             padding: 0
1471     // }}}
1472     // FormView.separator {{{
1473     .oe_horizontal_border
1474         border-bottom: 1px solid black
1475     .oe_horizontal_separator
1476         font-weight: bold
1477         font-size: 20px
1478         margin: 20px 0px 10px 0px
1479         color: #aab
1480     .oe_horizontal_separator:empty
1481         height: 5px
1482     .oe_vertical_separator
1483         border-left: 1px solid #666
1484         padding: 0 4px 0 4px
1485     // }}}
1486     // FormView.notebook {{{
1487     .oe_form_notebook
1488         margin: 8px 0
1489         padding: 0 8px
1490         list-style: none
1491         zoom: 1
1492     .oe_form_notebook:before, .oe_form_notebook:after
1493         display: table
1494         content: ""
1495         zoom: 1
1496     .oe_form_notebook:after
1497         clear: both
1498     .oe_form_notebook > li
1499         float: left
1500     .oe_form_notebook > li > a
1501         display: block
1502         color: #4c4c4c
1503     .oe_form_notebook
1504         border-color: #ddd
1505         border-style: solid
1506         border-width: 0 0 1px
1507     .oe_form_notebook > li
1508         position: relative
1509         margin-bottom: -1px
1510     .oe_form_notebook > li > a
1511         padding: 0 12px
1512         margin-right: 2px
1513         line-height: 30px
1514         border: 1px solid transparent
1515         @include radius(4px 4px 0 0)
1516     .oe_form_notebook > li > a:hover
1517         text-decoration: none
1518         background-color: #eee
1519         border-color: #eee #eee #ddd
1520     .oe_form_notebook > li.ui-state-active > a, .oe_form_notebook > li.ui-state-active > a:hover
1521         background-color: #ffffff
1522         border: 1px solid #ddd
1523         border-bottom-color: transparent
1524         cursor: default
1525     .oe_form_notebook_page
1526         padding: 0
1527     .ui-tabs-hide
1528         display: none
1529
1530     // }}}
1531     // FormView.progressbar {{{
1532     .oe_form
1533         .oe_form_field_progressbar.ui-progressbar
1534             height: 22px
1535             font-size: 10px
1536             -moz-box-sizing: border-box
1537             -webkit-box-sizing: border-box
1538             -ms-box-sizing: border-box
1539             box-sizing: border-box
1540             border: 1px solid #999
1541             -moz-border-radius: 3px
1542             -webkit-border-radius: 3px
1543             border-radius: 3px
1544             background: white
1545             min-width: 50px
1546
1547             span
1548                 position: absolute
1549                 margin-left: 10px
1550                 font-weight: bold
1551
1552             .ui-widget-header
1553                 background: #cccccc url(/web/static/lib/jquery.ui/css/smoothness/images/ui-bg_highlight-soft_75_cccccc_1x100.png) 50% 50% repeat-x
1554     // }}}
1555     // FormView.viewmanager {{{
1556     .oe_form
1557         .oe_view_manager_header2
1558             td
1559                 padding: 0px 8px
1560                 line-height: 16px
1561                 .oe_i
1562                     font-size: 13px
1563                 .oe_pager_group
1564                     height: auto
1565                     line-height: 16px
1566                     li
1567                         height: auto
1568                         line-height: 16px
1569     .oe-select-create-popup-view-form > .oe_formview > .oe_form_pager
1570         display: none
1571
1572     // }}}
1573     // FormView.classes for openerp views {{{
1574     .oe_form
1575         .oe_form_group_odd_border > tbody > tr.oe_form_group_row > td.oe_form_group_cell:nth-child(odd),
1576         .oe_form_group_label_border > tbody > tr.oe_form_group_row > td.oe_form_group_cell_label
1577             border-right: 1px solid #ddd
1578             label
1579                 display: block
1580                 min-width: 120px
1581         .oe_form_group_odd_border > tbody > tr.oe_form_group_row > td.oe_form_group_cell,
1582         .oe_form_group_label_border > tbody > tr.oe_form_group_row > td.oe_form_group_cell
1583             padding-left: 8px
1584         .oe_form_subtotal_footer
1585             float: right
1586             > div
1587                 text-align: right
1588                 padding: 3px
1589             label
1590                 font-weight: normal !important
1591             span
1592                 display: inline-block
1593                 min-width: 80px
1594                 text-align: right
1595             .oe_form_subtotal_footer_separator
1596                 border-top: 1px solid #cacaca
1597                 font-size: 120%
1598                 font-weight: bold
1599                 label
1600                     font-weight: bold !important
1601     // }}}
1602     // ListView {{{
1603     .oe-listview-content
1604         width: 100%
1605         > thead
1606             border-bottom: 2px solid #cacaca
1607             background: #eee
1608             vertical-align: top
1609             td, th
1610                 padding: 3px 6px
1611                 line-height: 18px
1612             th:after
1613                 content: ""
1614                 float: right
1615                 margin-top: 7px
1616                 border-width: 0 4px 4px
1617                 border-style: solid
1618                 border-color: #000 transparent
1619                 visibility: hidden
1620             th.sortup:after
1621                 visibility: visible
1622                 @include opacity(0.6)
1623             th.sortdown:after
1624                 border-bottom: none
1625                 border-left: 4px solid transparent
1626                 border-right: 4px solid transparent
1627                 border-top: 4px solid #000
1628                 visibility: visible
1629                 @include box-shadow(none)
1630                 @include opacity(0.6)
1631             // TODO mit
1632             //th:hover:after
1633             //    border-bottom: none
1634             //    border-left: 4px solid transparent
1635             //    border-right: 4px solid transparent
1636             //    border-top: 4px solid #000
1637             //    visibility: visible
1638             //    @include box-shadow(none)
1639             //    @include opacity(0.6)
1640         > tbody
1641             cursor: pointer
1642             background: white
1643             > tr
1644                 border-top: 1px solid #ddd
1645                 > td.oe-field-cell
1646                     padding: 3px 6px
1647                 > td, > th
1648                     line-height: 18px
1649                     > button
1650                         border: none
1651                         background: transparent
1652                         padding: 0
1653                         @include box-shadow(none)
1654                 > td.oe_list_checkbox:first-child, th.oe_list_checkbox:first-child
1655                     width: 17px
1656                     &:after
1657                         border-width: 0
1658                 > td.oe-number
1659                     text-align: right !important
1660             > tr:nth-child(odd)
1661                 background-color: #f0f0fa
1662                 @include vertical-gradient(#f0f0fa, #eeeef6)
1663         > tfoot
1664             border-top: 2px solid #cacaca
1665             border-bottom: 1px solid #cacaca
1666             background: #eee
1667             font-weight: bold
1668
1669         > tbody tr:hover td, tbody tr:hover th
1670             @include vertical-gradient(#eee, #dedede)
1671
1672         .numeric
1673             text-align: right
1674             width: 82px
1675             input
1676                 text-align: right
1677     // }}}
1678     // Translation {{{
1679     .oe_trad_field.touched
1680         border: 1px solid green !important
1681     // }}}
1682     // Tooltips {{{
1683     &.oe_tooltip
1684         font-size: 12px
1685         .oe_tooltip_string
1686             color: #FD5
1687             font-weight: bold
1688             font-size: 13px
1689         .oe_tooltip_help
1690             white-space: pre-wrap
1691         .oe_tooltip_technical
1692             padding: 0 0 4px 0
1693             margin: 5px 0 0 15px
1694             li
1695                 list-style: circle
1696         .oe_tooltip_technical_title
1697             font-weight: bold
1698     // }}}
1699     // Debugging stuff {{{
1700     .oe_layout_debugging
1701         .oe_form_group
1702             outline: 2px dashed green
1703         .oe_form_group_cell
1704             outline: 1px solid blue
1705         .oe_form_group:hover, .oe_form_group_cell:hover
1706             outline-color: red
1707         .oe_form_group_row_incomplete > td:last-child:after
1708             content: "[Incomplete Row]"
1709             background: red
1710             padding: 2px
1711             font-weight: bold
1712             color: white
1713             float: right
1714         .oe_form_group_row_incomplete.oe_form_group_row_newline > td:last-child:after
1715             content: "[newline]"
1716
1717     .oe_debug_view
1718         float: left
1719     .oe_debug_view_log
1720         font-size: 95%
1721     .oe_debug_view_log label
1722         display: block
1723         width: 49%
1724         text-align: right
1725         float: left
1726         font-weight: bold
1727         color: #009
1728     .oe_debug_view_log span
1729         display: block
1730         width: 49%
1731         float: right
1732         color: #333
1733     // }}}
1734
1735 .kitten-mode-activated
1736     background-image: url(http://placekitten.com/g/1365/769)
1737     background-size: cover
1738     background-attachment: fixed
1739     >*
1740         opacity: 0.70
1741
1742 // Transitional overrides for old styles {{{
1743 .openerp
1744     .oe_form_field_many2one
1745         td:first-child
1746             position: relative
1747         span.oe-m2o-drop-down-button
1748             position: absolute
1749             top: 3px
1750             right: 2px
1751 // }}}
1752
1753 // au BufWritePost,FileWritePost *.sass :!sass --style expanded --line-numbers <afile> > "%:p:r.css"
1754 // vim:tabstop=4:shiftwidth=4:softtabstop=4:fdm=marker: