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