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