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

1964 lines
60 KiB
Sass
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

@charset "utf-8"
// Variables {{{
$section-title-color: #8786b7
$facets-border: #afafb6
$facets-border-selected: #a6a6fe
$hover-background: #f0f0fa
$colour4: #8a89ba
$sheet-max-width: 860px
// }}}
// Mixins {{{
@font-face
font-family: 'mnmliconsRegular'
src: url('/web/static/src/font/mnmliconsv21-webfont.eot') format('eot')
src: url('/web/static/src/font/mnmliconsv21-webfont.woff') format('woff')
src: url('/web/static/src/font/mnmliconsv21-webfont.ttf') format('truetype')
src: url('/web/static/src/font/mnmliconsv21-webfont.svg') format('svg') active
font-weight: normal
font-style: normal
@font-face
font-family: 'EntypoRegular'
src: url('/web/static/src/font/entypo-webfont.eot') format('eot')
src: url('/web/static/src/font/entypo-webfont.eot?#iefix') format('embedded-opentype')
src: url('/web/static/src/font/entypo-webfont.woff') format('woff')
src: url('/web/static/src/font/entypo-webfont.ttf') format('truetype')
src: url('/web/static/src/font/entypo-webfont.svg') format('svg') active
font-weight: normal
font-style: normal
@mixin reset()
border: none
padding: 0
margin: 0
background: none
@include radius(none)
@include box-shadow(none)
@mixin vertical-gradient($startColor: #555, $endColor: #333)
background-color: $startColor
background-image: -webkit-gradient(linear, left top, left bottom, from($startColor), to($endColor)) /* Saf4+, Chrome */
background-image: -webkit-linear-gradient(top, $startColor, $endColor) /* Chrome 10+, Saf5.1+, iOS 5+ */
background-image: -moz-linear-gradient(top, $startColor, $endColor) /* FF3.6 */
background-image: -ms-linear-gradient(top, $startColor, $endColor) /* IE10 */
background-image: -o-linear-gradient(top, $startColor, $endColor) /* Opera 11.10+ */
background-image: linear-gradient(to bottom, $startColor, $endColor)
@mixin radial-gradient($gradient)
background-position: center center
background-image: -webkit-radial-gradient(circle, $gradient)
background-image: -moz-radial-gradient($gradient)
background-image: -ms-radial-gradient($gradient)
background-image: radial-gradient($gradient)
@mixin radius($radius: 5px)
-moz-border-radius: $radius
-webkit-border-radius: $radius
border-radius: $radius
@mixin box-shadow($bsval: 0px 1px 4px #777)
-moz-box-shadow: $bsval
-webkit-box-shadow: $bsval
box-shadow: $bsval
@mixin transition($transval: (border linear 0.2s, box-shadow linear 0.2s))
-webkit-transition: $transval
-moz-transition: $transval
-ms-transition: $transval
-o-transition: $transval
transition: $transval
@mixin opacity($opacity: .5)
filter: alpha(opacity=$opacity * 100)
opacity: $opacity
@mixin background-clip($clip: padding-box)
-webkit-background-clip: $clip
-moz-background-clip: $clip
background-clip: $clip
@mixin box-sizing($type: content)
// type = border || content || padding
-webkit-box-sizing: #{$type}-box
-moz-box-sizing: #{$type}-box
-ms-box-sizing: #{$type}-box
box-sizing: #{$type}-box
// Transforms the (readable) text of an inline element into an mmlicons icon,
// allows for actual readable text in-code (and in readers?) with iconic looks
@mixin text-to-icon($icon-name, $color: #404040)
font-size: 1px
letter-spacing: -1px
color: transparent
&:before
font: 21px "mnmliconsRegular"
content: $icon-name
color: $color
// }}}
.openerp.openerp_webclient_container
height: 100%
position: relative
.openerp
// Global style {{{
padding: 0
margin: 0
font-family: "Lucida Grande", Helvetica, Verdana, Arial, sans-serif
color: #4c4c4c
font-size: 13px
background: white
// }}}
// Tag reset {{{
a
text-decoration: none
table
padding: 0
border-collapse: collapse
thead
font-weight: bold
background-color: #f0f0f0
th
border-right: 1px dotted #afafb6
&:last-child
border-right: none
th, td
padding: 0
text-align: left
th
font-weight: bold
vertical-align: middle
td
vertical-align: top
.zebra tbody tr:nth-child(odd) td
background-color: #f0f0fa
@include vertical-gradient(#f0f0fa, #eeeef6)
.zebra tbody tr:hover td
@include vertical-gradient(#eee, #dedede)
ul, li, ol
margin: 0
padding: 0
li
list-style-type: none
input, textarea, select
padding: 2px 4px
border: 1px solid #ccc
@include radius(3px)
background: white
img
vertical-align: middle
h4
margin: 4px 0
// }}}
// Button style {{{
a.button:link, a.button:visited, button, input[type='submit']
display: inline-block
border: 1px solid #ababab
color: #404040
margin: 0
padding: 3px 12px
font-size: 13px
text-align: center
@include vertical-gradient(#efefef, #d8d8d8)
@include radius(3px)
@include box-shadow((0 1px 2px rgba(0, 0, 0, .1), 0 1px 1px rgba(255, 255, 255, .8) inset))
text-shadow: 0 1px 1px rgba(255, 255, 255, .5)
-webkit-font-smoothing: antialiased
outline: none
a.button:hover, button:hover, input[type='submit']:hover
@include vertical-gradient(#f6f6f6, #e3e3e3)
cursor: pointer
a.button:focus, button:focus, input[type='submit']:focus
border: 1px solid #80bfff
@include vertical-gradient(#f6f6f6, #e3e3e3)
@include box-shadow((0 0 3px #80bfff, 0 1px 1px rgba(255, 255, 255, .8) inset))
a.button:active, a.button.active, button:active, button.active, input[type='submit']:active, input[type='submit'].active
@include vertical-gradient(#e3e3e3, #f6f6f6)
@include box-shadow(none)
a.button.disabled, button:disabled, input[type='submit']:disabled
background: #efefef !important
border: 1px solid #d1d1d1 !important
@include box-shadow(none !important)
color: #aaa !important
cursor: default
text-shadow: 0 1px 1px #fff !important
// }}}
// Jquery ui Overrides {{{
.ui-widget
font-family: "Lucida Grande", Helvetica, Verdana, Arial, sans-serif
font-size: 13px
.ui-menu
.ui-menu-item
margin: 0 8px 0 0
padding: 0 0 0 12px
width: auto
a.ui-state-active
background: #f0f0fa
// Modal box
&.ui-dialog
display: none
padding: 6px
//overflow: hidden
background-color: rgba(60,60,60,0.7)
border: 1px solid
border-color: #888 #555 #444
//overflow: hidden
@include radius(8px)
@include box-shadow(0 1px 12px rgba(0, 0, 0, 0.6))
@include background-clip()
.ui-dialog-content
padding: 0px
.ui-dialog-titlebar, .ui-dialog-content, .ui-dialog-buttonpane
padding: 16px
.ui-dialog-titlebar
border-bottom: 1px solid #cacaca
@include radius(2px 2px 0 0)
@include vertical-gradient(#FCFCFC, #DEDEDE)
.ui-dialog-title
margin: 0
padding: 0
.ui-widget-header
border: none
.ui-dialog-content
background: white
.ui-dialog-buttonpane
border-top: 1px solid #e0e0e0
background: #f5f7f9
margin: 0
@include radius(0 0 2px 2px)
button
margin: 0
.ui-dialog-buttonset
float: left
.ui-dialog-titlebar-close
padding: 0
.ui-icon-closethick
display: none
&:before
content: "×"
font-size: 18px
font-weight: bold
line-height: 16px
color: black
text-shadow: 0 1px 0 white
padding: 0
cursor: pointer
background: transparent
border: 0
&:hover
color: black
text-decoration: none
.oe_about
background-color: white
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAKUlEQVQIHWO8e/fufwYsgAUkJigoiCIF5DMyoYggcUiXgNnBiGQKmAkARpcEQeriln4AAAAASUVORK5CYII=)
@include radius(0 0 2px 2px)
a
color: #8A89BA
&:hover
text-decoration: underline
.oe_logo
margin-left: -6px
.oe_bottom
position: absolute
top: 50%
left: 0
right: 0
bottom: 0
text-shadow: 0 1px 1px #999999
@include vertical-gradient(#b41616, #600606)
color: #eee
padding: 0 16px
@include radius(0 0 2px 2px)
a
color: #eee
&.ui-dialog.oe_act_window
.ui-dialog-content
padding: 0px
.modal-backdrop
position: fixed
top: 0
right: 0
bottom: 0
left: 0
z-index: 1040
background-color: black
@include opacity(.3)
// }}}
// Generic classes {{{
.oe_i
font-family: "mnmliconsRegular" !important
font-size: 21px
font-weight: 300 !important
.oe_e
font-family: "entypoRegular" !important
font-size: 34px
font-weight: 300 !important
.oe_left
float: left
margin-right: 8px
.oe_right
float: right
margin-left: 8px
.oe_text_right
text-align: right
.oe_clear
clear: both
.oe_wait
cursor: wait
.oe_fade
color: #888
font-weight: normal
.oe_bold
font-weight: bold
.oe_inline
width: auto !important
.oe_highlight
color: white
background: #DC5F59
button.oe_highlight
@include vertical-gradient(#dc5f59, #b33630)
@include box-shadow(none)
button.oe_highlight:active
@include vertical-gradient(#b33630, #dc5f59)
@include box-shadow(none)
button.oe_highlight:hover
@include vertical-gradient(#DF6B66, #BF3A33)
//@include vertical-gradient(lighten(#dc5f59, 3%), lighten(#b33630, 3%))
@include box-shadow(0 0 1px rgba(0, 0, 0, 0.2))
.oe_form_dirty
.oe_highlight_on_dirty
color: white
background: #dc5f59
font-weight: bold
button.oe_highlight_on_dirty
@include vertical-gradient(#dc5f59, #b33630)
@include box-shadow(none)
&:hover
background: #ED6F6A
.oe_title
width: 50%
float: left
.oe_title:after
content: "."
display: block
height: 0
clear: both
visibility: hidden
.oe_button_box
width: 270px
text-align: right
button
margin: 4px
.oe_avatar
margin: 0 6px 15px 0
> img
height: 90px
max-width: 100px
@include radius(3px)
@include box-shadow(0 1px 3px rgba(0, 0, 0, 0.3))
border: none
.oe_avatar + div
margin-left: 5px
.oe_button.oe_link
@include reset()
img
display: none
span
@include reset()
color: #8A89BA
font-weight: bold
&:hover
text-decoration: underline
.oe_webclient
.oe_star_on, .oe_star_off
color: #cccccc
text-shadow: 0 0 2px black
vertical-align: top
position: relative
top: -5px
.oe_star_on:hover, .oe_star_off:hover
text-decoration: none
.oe_star_on
color: gold
// }}}
// Tags (for many2many tags, among others) {{{
.oe_tag
border-radius: 2px
@include box-sizing(border)
border: 1px solid #9DACCC
background: #E2E6F0
color: black !important
padding: 0px 3px 0px 3px
margin: 0 2px 2px 0
height: 16px
// font: 11px "lucida grande", tahoma, verdana, arial, sans-serif
.oe_tags
.text-wrap
width: 100% !important
textarea
width: 100% !important
.text-core .text-wrap .text-dropdown .text-list .text-suggestion em
font-style: italic
text-decoration: none
// }}}
// Tooltips {{{
&.oe_tooltip
font-size: 12px
.oe_tooltip_string
color: #FD5
font-weight: bold
font-size: 13px
.oe_tooltip_help
white-space: pre-wrap
.oe_tooltip_technical
padding: 0 0 4px 0
margin: 5px 0 0 15px
li
list-style: circle
.oe_tooltip_technical_title
font-weight: bold
// }}}
// Notebook {{{
.oe_notebook
margin: 8px 0
padding: 0 16px
list-style: none
zoom: 1
.oe_notebook.ui-corner-all
@include radius(0)
.oe_notebook:before, .oe_notebook:after
display: table
content: ""
zoom: 1
.oe_notebook:after
clear: both
.oe_notebook > li
float: left
.oe_notebook > li > a
display: block
color: #4c4c4c
.oe_notebook
border-color: #ddd
border-style: solid
border-width: 0 0 1px
.oe_notebook > li
position: relative
.oe_notebook > li > a
padding: 0 12px
margin-right: 2px
line-height: 30px
border: 1px solid transparent
@include radius(4px 4px 0 0)
.oe_notebook > li > a:hover
text-decoration: none
background-color: #eee
border-color: #eee #eee #ddd
.oe_notebook > li.ui-state-active > a, .oe_notebook > li.ui-state-active > a:hover
background-color: #ffffff
border: 1px solid #ddd
border-bottom-color: transparent
cursor: default
.oe_notebook_page
padding: 0
div.ui-tabs
padding: 3px 0px 3px 0px
.ui-tabs-hide
display: none
// }}}
// Dropdown {{{
.oe_dropdown, .oe_dropdown_hover, .oe_dropdown_toggle
position: relative
cursor: pointer
.oe_dropdown_toggle
color: #404040
font-weight: normal
.oe_dropdown_hover:hover .oe_dropdown_menu, .oe_dropdown_menu.oe_opened
display: block
.oe_dropdown_menu
display: none
position: absolute
top: 26px
left: 0
z-index: 1
border: 1px solid #afafb6
background: white
padding: 4px 0
min-width: 140px
text-align: left
@include radius(3px)
@include box-shadow(0 1px 4px rgba(0,0,0,0.3))
> li
&:hover
@include vertical-gradient(#f0f0fa, #eeeef6)
@include box-shadow(none)
list-style-type: none
float: none
display: block
position: relative
padding: 2px 8px
> a
white-space: nowrap
display: block
color: #4c4c4c
text-decoration: none
&:hover
text-decoration: none
.oe_dropdown_arrow:after
width: 0
height: 0
display: inline-block
content: "&darr"
text-indent: -99999px
vertical-align: top
margin-top: 8px
margin-left: 4px
border-left: 4px solid transparent
border-right: 4px solid transparent
border-top: 4px solid#404040
@include opacity(0.5)
.oe_sidebar
white-space: nowrap
.oe_dropdown_menu
.oe_sidebar_add_attachment
height: 20px
cursor: pointer
padding-left: 6px
margin-top: 6px
span
font-weight: bold
.oe_hidden_input_file
width: 200px
&:hover
@include vertical-gradient(#f0f0fa, #eeeef6)
@include box-shadow(none)
li
.oe_sidebar_delete_item
position: absolute
top: 4px
right: 4px
display: none
width: 12px
height: 12px
padding: 1px
color: #8786b7
line-height: 8px
text-align: center
font-weight: bold
text-shadow: 0 1px 1px white
&:hover
text-decoration: none
color: white
background: #8786b7
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.4)
@include radius(2px)
&:hover
.oe_sidebar_delete_item
display: inline-block
// }}}
// Loading {{{
.oe_loading
display: none
z-index: 100
position: fixed
top: 0
right: 50%
padding: 4px 12px
background: #A61300
color: white
text-align: center
border: 1px solid #900
border-top: none
-moz-border-radius-bottomright: 8px
-moz-border-radius-bottomleft: 8px
border-bottom-right-radius: 8px
border-bottom-left-radius: 8px
// }}}
// Notification {{{
.oe_notification
z-index: 1050
// }}}
// Login {{{
.oe_login
background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAYAAADgzO9IAAAAKUlEQVQIHWO8e/fufwYsgAUkJigoiCIF5DMyoYggcUiXgNnBiGQKmAkARpcEQeriln4AAAAASUVORK5CYII=)
text-align: center
font-size: 14px
height: 100%
li
list-style-type: none
padding-bottom: 4px
button
float: right
display: inline-block
cursor: pointer
padding: 6px 16px
border: 1px solid #222
color: white
margin: 0
@include vertical-gradient(#b92020, #600606)
@include radius(4px)
@include box-shadow((0 1px 2px rgba(0, 0, 0, 0.1), 0 1px 1px rgba(155, 155, 155, 0.4) inset))
input, select
width: 252px
font-family: "Lucida Grande", Helvetica, Verdana, Arial
border: 1px solid #999999
background: whitesmoke
@include box-shadow(inset 0 1px 4px rgba(0, 0, 0, 0.3))
@include radius(3px)
input
margin-bottom: 9px
padding: 5px 6px
select
padding: 1px
.oe_login_dbpane
position: fixed
top: 0
right: 8px
padding: 5px 10px
color: #eee
border: solid 1px #333
background: #1e1e1e
background: rgba(30,30,30,0.94)
@include radius(0 0 8px 8px)
input
padding: 2px 4px
margin: 4px 0
.oe_login_bottom
position: absolute
top: 50%
left: 0
right: 0
bottom: 0
text-shadow: 0 1px 1px #999999
@include vertical-gradient(#b41616, #600606)
.oe_login_pane
position: absolute
top: 50%
left: 50%
margin: -160px -166px
border: solid 1px #333333
background: #1e1e1e
background: rgba(30,30,30,0.94)
padding: 22px 32px
color: #eee
text-align: left
@include radius(8px)
@include box-shadow(0 0 18px rgba(0, 0, 0, 0.9))
h2
margin-top: 0
font-size: 18px
.oe_login_logo
position: absolute
top: -70px
left: 0
width: 100%
margin: 0 auto
text-align: center
.oe_login_footer
position: absolute
bottom: -40px
left: 0
width: 100%
text-align: center
a
color: #eee
margin: 0 8px
&:hover
text-decoration: underline
span
font-weight: bold
font-size: 16px
.oe_login_error_message
display: none
background-color: #b41616
color: #eee
padding: 14px 18px
margin-top: 15px
text-align: center
@include radius(4px)
@include box-shadow(0 1px 4px rgba(0, 0, 0, 0.8))
.oe_login_invalid
.oe_login_error_message
display: inline-block
// }}}
// DatabaseManager {{{
.oe_database_manager
background: #fff
color: #000
text-align: left
.oe_database_manager_menu
color: #000
// }}}
// WebClient {{{
.oe_webclient
width: 100%
height: 100%
border-spacing: 0px
// }}}
// WebClient.fullscreen {{{
.oe_content_full_screen
.oe_application
top: 0
left: 0
.oe_topbar, .oe_leftbar
display: none
// }}}
// WebClient.topbar {{{
.oe_topbar
width: 100%
height: 31px
border-top: solid 1px #d3d3d3
@include vertical-gradient(#646060, #262626)
.oe_topbar_item
display: block
padding: 5px 10px 7px
line-height: 20px
height: 20px
color: #eee
vertical-align: top
text-shadow: 0 1px 1px rgba(0,0,0,0.2)
&:hover
background: #303030
color: white
@include box-shadow(0 1px 2px rgba(255,255,255,0.3) inset)
.oe_active
background: #303030
font-weight: bold
color: white
@include box-shadow(0 1px 2px rgba(255,255,255,0.3) inset)
.oe_topbar_avatar
width: 24px
height: 24px
margin: -2px 2px 0 0
@include radius(3px)
.oe_topbar_avatar
vertical-align: top
.oe_dropdown_arrow:after
border-top: 4px solid white
.oe_dropdown_menu
top: 32px
background: #333
background: rgba(37,37,37,0.9)
border-color: #999
border-color: rgba(0, 0, 0, 0.2)
border-style: solid
border-width: 0 1px 1px
@include radius(0 0 6px 6px)
@include background-clip()
li
float: none
padding: 3px 12px
a
color: #eee
&:hover
@include vertical-gradient(#292929, #191919)
@include box-shadow(none)
// }}}
// Webclient.leftbar {{{
.oe_leftbar
display: none
width: 220px
background: #f0eeee
border-right: 1px solid #afafb6
text-shadow: 0 1px 1px white
padding-bottom: 16px
a.oe_logo
width: 220px
display: block
text-align: center
height: 70px
line-height: 70px
img
height: 40px
width: 157px
margin: 14px 0
.oe_footer
position: fixed
bottom: 0
padding: 4px 0
background: #f0eeee
width: 220px
text-align: center
a
font-weight: 800
font-family: serif
font-size: 16px
color: black
span
color: #c81010
font-style: italic
// }}}
// UserMenu {{{
.oe_user_menu
float: right
padding: 0
margin: 0
li
list-style-type: none
float: left
.oe_dropdown_menu
right: -1px
// }}}
// Systray {{{
.oe_systray > div
float: left
padding: 0 4px 0 4px
.oe_systray
float: right
// }}}
// Menu {{{
.oe_menu
float: left
padding: 0
margin: 0
li
float: left
a
display: block
padding: 5px 10px 7px
line-height: 20px
height: 20px
color: #eee
vertical-align: top
text-shadow: 0 1px 1px rgba(0,0,0,0.2)
&:hover
background: #303030
color: white
@include box-shadow(0 1px 2px rgba(255,255,255,0.3) inset)
.oe_active
background: #303030
font-weight: bold
color: white
@include box-shadow(0 1px 2px rgba(255,255,255,0.3) inset)
.oe_secondary_menu_section
font-weight: bold
margin-left: 8px
color: $colour4
.oe_secondary_submenu
padding: 2px 0 8px 0
margin: 0
width: 100%
display: inline-block
> li
position: relative
padding: 1px 0 1px 20px
a
display: block
color: #4c4c4c
padding: 2px 4px 2px 0
.oe_menu_label
position: absolute
top: 1px
right: 1px
font-size: 10px
background: $colour4
color: white
padding: 2px 4px
margin: 1px 6px 0 0
border: 1px solid lightGray
text-shadow: 0 1px 1px rgba(0,0,0,0.2)
@include radius(4px)
@include box-shadow(inset 0 1px 1px rgba(0, 0, 0, 0.2))
.oe_menu_counter
float: right
background: #8a89ba
color: #eee
font-size: 10px
border: 1px solid lightgray
padding: 2px 4px
text-shadow: 0 1px 1px rgba(0,0,0,0.2)
margin: 0px
@include radius(4px)
.oe_active
background: $colour4
border-top: 1px solid lightGray
border-bottom: 1px solid lightGray
text-shadow: 0 1px 1px rgba(0,0,0,0.2)
@include box-shadow(inset 0 1px 1px rgba(0, 0, 0, 0.2))
a
color: white
.oe_menu_label
background: #eee
color: $colour4
text-shadow: 0 1px 1px white
@include box-shadow(0 1px 1px rgba(0, 0, 0, 0.2))
.oe_menu_counter
background: #eee
color: #8a89ba
.oe_menu_toggler:before
width: 0
height: 0
display: inline-block
content: "&darr"
text-indent: -99999px
vertical-align: top
margin-left: -12px
margin-top: 4px
margin-right: 4px
border-top: 4px solid transparent
border-bottom: 4px solid transparent
border-left: 4px solid #4c4c4c
@include opacity(0.5)
.oe_menu_opened:before
margin-top: 6px
margin-left: -16px
margin-right: 4px
border-left: 4px solid transparent
border-right: 4px solid transparent
border-top: 4px solid #4c4c4c
// }}}
// ActionManager {{{
.oe_application
width: 100%
a
color: $colour4
&:hover
text-decoration: underline
> div
height: 100%
// }}}
// ViewManager common {{{
.oe_view_manager
.oe_view_manager_body
height: inherit
.oe_view_manager_view_kanban
height: inherit
table.oe_view_manager_header
width: 100%
table-layout: fixed
.oe_header_row
//min-height: 26px
//line-height: 26px
clear: both
text-shadow: 0 1px 1px white
.oe_header_row:last-child
td
padding-top: 0
.oe_view_manager_sidebar
margin: 0px auto
text-align: center
td
line-height: 26px
h2
font-size: 18px
margin: 0
float: left
a
color: $colour4
.oe_button_group
display: inline-block
border: 1px solid #ababab
@include radius(5px)
li
float: left
border-right: 1px solid #ababab
&:last-child
border: none
a
color: #4c4c4c
&:hover
text-decoration: none
.active
background: #999
@include box-shadow(0 1px 4px rgba(0,0,0,0.3) inset)
a
color: #fff
text-shadow: 0 1px 2px rgba(0,0,0,0.4)
.oe_view_manager_buttons
white-space: nowrap
// }}}
// ViewManager.pager {{{
.oe_view_manager_pager
line-height: 26px
.oe_pager_value
float: left
margin-right: 8px
.oe_pager_group
float: left
height: 24px
line-height: 24px
display: inline-block
border: 1px solid #ababab
cursor: pointer
@include radius(5px)
li
height: 24px
line-height: 24px
padding: 0
float: left
border-right: 1px solid #ababab
&:last-child
border: none
a
color: #4c4c4c
padding: 0 8px
&:hover
text-decoration: none
.active
background: #999
@include box-shadow(0 1px 4px rgba(0,0,0,0.3) inset)
a
color: #fff
text-shadow: 0 1px 2px rgba(0,0,0,0.4)
// }}}
// ViewManager.switches {{{
.oe_view_manager_switch
li
text-align: center
width: 24px
height: 24px
line-height: 16px
a
position: relative
.oe_vm_switch_list:after, .oe_vm_switch_tree:after
padding: 2px
content: "i"
.oe_vm_switch_form:after
content: "m"
.oe_vm_switch_graph:after
font-family: "mnmliconsRegular" !important
font-size: 21px
font-weight: 300 !important
content: "}"
top: -2px
position: relative
.oe_vm_switch_gantt:after
font-family: "mnmliconsRegular" !important
font-size: 21px
font-weight: 300 !important
content: "y"
top: -2px
position: relative
.oe_vm_switch_calendar:after
content: "P"
.oe_vm_switch_kanban:after
content: "k"
.oe_vm_switch_diagram:after
content: "f"
// }}}
// ViewManager application {{{
.oe_view_manager_current
height: 100%
> .oe_view_manager_header
border-top: 1px solid #cacaca
border-bottom: 1px solid #cacaca
@include vertical-gradient(#fcfcfc, #dedede)
@include box-shadow((0 1px 0 rgba(255,255,255,0.4), 0 0 9px rgba(0,0,0,0.1)))
.oe_header_row
td
padding: 8px
.oe_header_row:first-child
td
padding-top: 8px
// }}}
// ViewManager inline {{{
.oe_view_manager_inline
height: 100%
> .oe_view_manager_header
display: none
// }}}
// Viewmanager popup {{{
.oe_popup_form > .oe_formview > .oe_form_pager
display: none !important
// }}}
// SearchView {{{
.oe_searchview
cursor: text
position: relative
float: right
padding: 1px 0
line-height: 18px
width: 400px
border: 1px solid #ababab
background: white
@include radius(13px)
@include box-shadow(0 1px 2px rgba(0,0,0,0.2) inset)
input, textarea
padding: 3px
height: 14px
font-size: 12px
line-height: 18px
&.oe_focused
border-color: $facets-border-selected
@include box-shadow(0 1px 2px $facets-border-selected inset)
.oe_searchview_clear
cursor: pointer
position: absolute
top: 0
right: 18px
width: 15px
height: 100%
background: url(../img/search_reset.gif) center center no-repeat
.oe_searchview_unfold_drawer
position: absolute
top: 0
right: 0
height: 100%
padding: 0 7px 0 4px
color: #ccc
cursor: pointer
&:hover
color: #999
&:before
position: absolute
top: 10px
right: 7px
width: 0
height: 0
display: inline-block
content: ""
vertical-align: top
border-top: 5px solid #4C4C4C
border-left: 5px solid transparent
border-right: 5px solid transparent
@include opacity()
.oe_searchview_search
@include text-to-icon("r", #a3a3a3)
@include box-shadow(none)
@include radius(0)
position: absolute
left: 3px
top: 1px
padding: 0
border: none
background: transparent
.oe_searchview_facets
min-height: 22px
margin-left: 15px
*
vertical-align: top
display: inline-block
line-height: 17px
.oe_searchview_input, .oe_searchview_facet
height: 18px
margin: 1px 0
font-size: 11px
&:focus
outline: none
.oe_searchview_input
padding: 0 0 0 6px
.oe_searchview_facet
position: relative
cursor: pointer
border: 1px solid $facets-border
@include radius(3px)
background: #8786b7
-webkit-font-smoothing: auto
// spacing for opera, FF
&:focus
border-color: $facets-border-selected
@include box-shadow(0 0 3px 1px $facets-border-selected)
.oe_facet_values
background: #f0f0fa
@include radius(0 3px 3px 0)
.oe_facet_category, .oe_facet_value
height: 18px
padding: 0 4px
.oe_facet_category
color: white
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.4)
.oe_facet_category.oe_i
font-size: 16px
.oe_facet_value
border-left: 1px solid $facets-border
text-shadow: 0 1px 1px white
&:last-child
padding-right: 16px
.oe_facet_remove
position: absolute
top: 3px
right: 3px
color: #8786b7
line-height: 8px
width: 12px
height: 12px
text-align: center
font-weight: bold
cursor: pointer
text-shadow: 0 1px 1px white
&:hover
color: white
background: #8786b7
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.4)
@include radius(2px)
&.oe_searchview_open_drawer
.oe_searchview_drawer
display: block
.oe_searchview_drawer
position: absolute
z-index: 100
// detach drawer from field slightly
margin-top: 4px
top: 100%
right: -1px
background-color: white
min-width: 100%
display: none
border: 1px solid #afafb6
text-align: left
@include radius(4px)
@include box-shadow(0 1px 4px rgba(0,0,0,0.3))
> div
border-top: 1px solid #ccc
margin: 0
padding: 8px
> div:first-child
border-top: none
margin: 0
h3
margin: 8px 4px 4px 12px
color: $section-title-color
font-size: 13px
h4, h4 *
margin: 0
cursor: pointer
font-weight: normal
display: inline-block
&:hover
background-color: $hover-background
h4:before
content: ""
color: #a3a3a3
button
margin: 4px 0
.button
border: none
background: transparent
padding: 0 2px
@include box-shadow(none)
@include radius(0)
.oe_searchview_section
display: table
width: 100%
> div
@include box-sizing(border)
display: table-cell
width: 50%
ul
margin: 0 8px 8px
padding: 0
list-style: none
li
list-style: none
padding: 2px 4px 2px 20px
line-height: 14px
color: inherit
cursor: pointer
position: relative
&.oe_selected:before
content: "W"
font-family: "entypoRegular" !important
font-size: 24px
font-weight: 300 !important
color: #a3a3a3
position: absolute
left: 4px
top: -2px
// after oe_selected so background color is not overridden
&:hover
background-color: $hover-background
form
margin-left: 12px
p
margin: 4px 0
line-height: 18px
button
margin: 0 0 8px 0
.oe_searchview_custom
padding: 0 8px 8px 8px
form
display: none
li
cursor: pointer
position: relative
line-height: 14px
padding: 2px 4px 2px 20px
&:hover
background-color: $hover-background
button
position: absolute
top: 0
right: 5px
.oe_searchview_dashboard
form
display: none
margin-top: 2px
.oe_searchview_advanced
form
display: none
margin-top: 8px
button.oe_add_condition:before
content: "Z"
font-family: "entypoRegular" !important
font-size: 24px
font-weight: 300 !important
margin-right: 4px
ul
list-style: none
padding: 0
li
position: relative
list-style: none
margin: 0
white-space: nowrap
.oe_opened
h4:before
content: ""
position: relative
top: -1px
form
display: block
// delete buttons
.oe_searchview_custom_delete, .searchview_extended_delete_prop
display: inline-block
width: 12px
height: 12px
line-height: 12px
padding: 1px
color: #8786b7
line-height: 8px
text-align: center
font-weight: bold
text-shadow: 0 1px 1px white
&:hover
text-decoration: none
color: white
background: #8786b7
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.4)
@include radius(2px)
.oe_searchview_custom_delete
display: none
position: absolute
bottom: 1px
right: 4px
.oe_searchview_custom_private, .oe_searchview_custom_public
&:hover
.oe_searchview_custom_delete
display: inline-block
.oe_searchview_custom_public:after
content: ","
font-family: "entypoRegular" !important
font-size: 22px
font-weight: 300 !important
margin: 0 0 0 4px
padding: 0
// }}}
// Views Common {{{
.oe_view_nocontent
> img
float: left
margin: 1.5em
> div
// don't encroach on my arrow
overflow: hidden
padding: 35px 0px 0px 0px
max-width: 700px
font-size: 125%
// }}}
// FormView.base and dynamic tags {{{
.oe_formview
background: white
.oe_form_dropdown_section
position: relative
display: inline-block
.oe_form_invalid
input, select, textarea
background-color: #F66 !important
border: 1px solid #D00 !important
.oe_view_manager_current .oe_form_editable
.oe_highlight
color: #404040
background: none
button.oe_highlight
@include vertical-gradient(#efefef, #d8d8d8)
@include box-shadow((0 1px 2px rgba(0, 0, 0, .1), 0 1px 1px rgba(255, 255, 255, .8) inset))
button.oe_highlight:active
@include vertical-gradient(#e3e3e3, #f6f6f6)
@include box-shadow(none)
button.oe_highlight:hover
@include vertical-gradient(#f6f6f6, #e3e3e3)
@include box-shadow((0 1px 2px rgba(0, 0, 0, .1), 0 1px 1px rgba(255, 255, 255, .8) inset))
.oe_form_invisible
display: none !important
.oe_form_readonly
.oe_edit_only, .oe_form_field:empty
display: none !important
.oe_form .oe_form_field_date
width: auto
.oe_form_nosheet
margin: 20px
.oe_form_nosheet > header
margin-top: -20px
margin-left: -20px
margin-right: -20px
// }}}
// FormView.custom tags and classes {{{
.oe_form
header
position: relative
border-bottom: 1px solid #cacaca
@include vertical-gradient(#fcfcfc, #dedede)
padding: 0 8px
line-height: 30px
ul
display: inline-block
float: right
div.oe_chatter
min-width: 650px
max-width: $sheet-max-width
margin: 0 auto
ul.oe_form_steps
height: 30px
padding: 0
margin: 0
text-shadow: 0 1px 1px white
img
vertical-align: top
margin-left: 8px
li
border-right: none
padding: 0
margin: 0
float: left
vertical-align: top
height: 30px
padding: 0 0 0 12px
&:first-child
border-left: 1px solid #cacaca
&:last-child
margin-right: 12px
padding-right: 12px
border-right: 1px solid #cacaca
a
color: #4c4c4c
&:hover
color: black
.oe_form_steps_active
font-weight: bold
color: #b33630
.oe_form .oe_subtotal_footer
width: 1% !important
td.oe_form_group_cell
text-align: right
padding: 0 !important
td.oe_form_group_cell_label
border-right: none
.oe_subtotal_footer_separator
width: 108px
border-top: 1px solid #cacaca
font-weight: bold
font-size: 18px
label:after
content: ":"
label.oe_subtotal_footer_separator
font-weight: bold !important
padding: 2px 11px 2px 0px !important
label.oe_form_label_help
font-weight: normal
// no sheet in popups
.oe_application
.oe_form_sheetbg
background: url(/web/static/src/img/form_sheetbg.png)
padding: 8px 0
border-bottom: 1px solid #ddd
.oe_form_sheet_width
min-width: 650px
max-width: $sheet-max-width
margin: 0 auto
.oe_form_sheet
background: white
min-height: 330px
padding: 16px
border: 1px solid #afafb6
@include box-shadow(0 0 10px rgba(0,0,0,0.3))
.ui-tabs
margin: 0 -16px
.oe_notebook_page
padding: 0 16px
// }}}
// FormView.group {{{
.oe_form
.oe_form_button
margin: 2px
td.oe_form_group_cell_label
border-right: 1px solid #ddd
padding: 2px 0px 2px 0px
label
line-height: 18px
display: block
min-width: 120px
td.oe_form_group_cell + .oe_form_group_cell
padding-left: 6px
.oe_form_group
width: 100%
margin: 6px 0 6px 0
.oe_form_group_cell.oe_group_right
padding-left: 20px
// }}}
// FormView.label {{{
.oe_form
.oe_form_label_help[for], .oe_form_label[for]
font-weight: bold
white-space: nowrap
padding-right: 6px
span
font-size: 80%
color: darkGreen
vertical-align: top
position: relative
top: -4px
padding: 0 2px
// }}}
// FormView.separator {{{
.oe_horizontal_border
border-bottom: 1px solid black
.oe_horizontal_separator
font-weight: bold
font-size: 20px
margin: 8px 0px 8px 0px
color: #aab
.oe_horizontal_separator:empty
height: 5px
.oe_vertical_separator
border-left: 1px solid #666
padding: 0 4px 0 4px
// }}}
// FormView.progressbar {{{
.oe_form_field_progressbar
display: inline-block
min-width: 70px
.oe_form_field_progressbar.ui-progressbar
height: 22px
font-size: 10px
@include box-sizing(border)
border: 1px solid #999
@include radius(3px)
background: white
min-width: 50px
span
position: absolute
margin-left: 10px
font-weight: bold
.ui-widget-header
background: #cccccc url(/web/static/lib/jquery.ui/css/smoothness/images/ui-bg_highlight-soft_75_cccccc_1x100.png) 50% 50% repeat-x
// }}}
// FormView.fields {{{
.oe_form
.oe_form_field_text
width: 100%
.oe_form_field_char input,
.oe_form_field_url input,
.oe_form_field_email input,
.oe_form_field_text textarea,
.oe_form_field_selection select
width: 100%
.oe_form_field_text.oe_inline, .oe_form_field_text.oe_inline > textarea
width: 500px
h1, h2, h3, h4, h5, h6
margin: 0 0 4px 0
input
height: inherit !important
font-size: inherit
.oe_form_field
width: 100%
display: inline-block
padding: 2px 2px 2px 0px
line-height: 18px
input
margin: 0px
input[type="text"], input[type="password"], input[type="file"], select
height: 22px
padding-top: 2px
input[type="text"], input[type="password"], input[type="file"], select, textarea
@include box-sizing(border)
background: white
min-width: 70px
color: #1f1f1f
input[readonly], select[readonly], textarea[readonly], input[disabled], select[disabled]
background: #E5E5E5 !important
color: #666
textarea[disabled]
border: none
border-left: 8px solid #eee
padding-left: 8px
@include box-shadow(none)
@include radius(0px)
.oe_form_field_url button img
vertical-align: top
.oe_form_field_date,
.oe_form_field_datetime
white-space: nowrap
.oe_form_field_boolean
padding-top: 4px
width: auto
.oe_datepicker_container
display: none
.oe_datepicker_root
display: inline-block
.oe_form_required
input, select, textarea
background-color: #D2D2FF !important
.oe_form_invalid
input, select, textarea
background-color: #F66 !important
border: 1px solid #D00 !important
.oe_input_icon
cursor: pointer
margin: 3px 0 0 -21px
vertical-align: top
.oe_input_icon_disabled
position: absolute
cursor: default
opacity: 0.5
filter: alpha(opacity=50)
right: 5px
top: 3px
.oe_form_field_with_button.oe_no_button > .oe_button
display: none
.oe_form_field_with_button:not(.oe_no_button)
> .oe_button
float: right
@include radius(0)
border-bottom-left-radius: 0px
height: 22px
.oe_form_field_with_button
input
width: 100%
> div
position: relative
overflow: hidden
.oe_form_editable
.oe_form
.oe_form_field_integer
width: 7em !important
.oe_form_field_float
width: 8em !important
.oe_form_field_date
width: 7.5em !important
.oe_form_field_datetime
width: 11.5em !important
// }}}
// FormView.fields_binary {{{
/* http://www.quirksmode.org/dom/inputfile.html
* http://stackoverflow.com/questions/2855589/replace-input-type-file-by-an-image
*/
.oe_hidden_input_file
overflow: hidden
position: relative
display: inline-block
width: 45px
height: 30px
input.oe_form_binary_file
z-index: 0
line-height: 0
font-size: 12px
position: absolute
// Should be adjusted for all browsers
top: 1px
right: 10px
opacity: 0
filter: alpha(opacity = 0)
-ms-filter: "alpha(opacity=0)"
margin: 0
padding: 0
.oe_form
.oe_form_field_image
padding: 0
position: relative
display: inline-block
width: auto
vertical-align: top
.oe_form_field_image_controls
position: absolute
white-space: nowrap
top: 1px
padding: 3px 0 0 0
margin: 0 1px
display: none
width: 99%
text-align: center
background: url(/web/static/src/img/form_sheetbg.png)
border-bottom: 1px dotted black
@include box-sizing(border)
&:hover .oe_form_field_image_controls
display: block
// }}}
// FormView.many2one {{{
.oe_form_field_many2one
td:first-child
position: relative
span.oe_m2o_drop_down_button
position: absolute
top: 2px
right: 0px
.oe_m2o_cm_button
line-height: 14px
// }}}
// FormView.one2many {{{
.oe_form .oe_form_field_one2many > .oe_view_manager
.oe_list_pager_single_page
display: none
.oe_form_field_one2many,.oe_form_field_many2many
// TODO: oe_form_field_one2many_list?
.oe_list_content
> thead
border-bottom: 1px
> tbody
tr:nth-child(odd)
background: transparent
.oe_list .oe_list_edit_row_save
background: url(/web/static/src/img/iconset-b-remove.png) 50% 50% no-repeat
&:before
visibility: hidden
&> .oe_view_manager
.oe_header_row_top
display: none
.oe_view_manager_header2
td
padding: 0px 8px
line-height: 16px
.oe_i
font-size: 13px
.oe_pager_group
height: auto
line-height: 16px
li
height: auto
line-height: 16px
.oe_list_buttons.oe_editing .oe_list_save
// keep "save row" button hidden in o2m
visibility: hidden
// }}}
// FormView.many2many {{{
.oe_form .oe_form_field_many2many > .oe_list
.oe_list_pager_single_page
display: none
// }}}
// ListView {{{
.oe_list_buttons
.oe_list_save, .oe_list_discard
display: none
&.oe_editing
.oe_list_add, .oe_list_button_import
display: none
.oe_list_save
display: inline-block
.oe_list_discard
display: inline
.oe_list
position: relative
.oe_form .oe_form_field
width: auto
position: absolute
margin: 0 !important // dammit
padding: 0
.oe_list_content
width: 100%
td:first-child, th:first-child
&:after
border-width: 0
td.oe_number
text-align: right !important
max-width: 100px
> thead
border-bottom: 2px solid #cacaca
background: #eee
vertical-align: top
th
position: relative
td, th
padding: 3px 6px
line-height: 18px
th:after
position: absolute
right: 6px
content: ""
margin-top: 7px
border-width: 0 4px 4px
border-style: solid
border-color: #000 transparent
visibility: hidden
th.sortup:after
visibility: visible
@include opacity(0.6)
th.sortdown:after
border-bottom: none
border-left: 4px solid transparent
border-right: 4px solid transparent
border-top: 4px solid #000
visibility: visible
@include box-shadow(none)
@include opacity(0.6)
> tbody
cursor: pointer
> tr
border-top: 1px solid #ddd
> td.oe_list_field_cell
padding: 3px 6px
white-space: pre-line
> td, > th
> button
border: none
background: transparent
padding: 0
@include box-shadow(none)
> td.oe_list_checkbox:first-child, th.oe_list_checkbox:first-child
width: 17px
&:after
border-width: 0
> tr:nth-child(odd)
background-color: #f0f0fa
@include vertical-gradient(#f0f0fa, #eeeef6)
> tfoot
border-top: 2px solid #cacaca
border-bottom: 1px solid #cacaca
background: #eee
font-weight: bold
> tbody tr:hover td, tbody tr:hover th
@include vertical-gradient(#eee, #dedede)
.numeric
text-align: right
width: 82px
input
text-align: right
// }}}
// Translation {{{
.oe_trad_field.touched
border: 1px solid green !important
// }}}
// View Editor {{{
.oe_view_editor
width: 100%
border-collapse: collapse
margin-left: -12px
width: 100%
background-color: white
border-spacing: 0
td
text-align: center
white-space: nowrap
border: 1px solid #D8D8D8
cursor: pointer
font-size: 90%
.oe_view_editor_field td
border: 0px !important
.oe_view_editor tr:hover
background-color: #ecebf2
// }}}
// Debugging stuff {{{
.oe_layout_debugging
.oe_form_group
outline: 2px dashed green
.oe_form_group_cell
outline: 1px solid blue
.oe_form_group:hover, .oe_form_group_cell:hover
outline-color: red
.oe_form_group_row_incomplete > td:last-child:after
content: "[Incomplete Row]"
background: red
padding: 2px
font-weight: bold
color: white
float: right
.oe_form_group_row_incomplete.oe_form_group_row_newline > td:last-child:after
content: "[newline]"
.oe_debug_view
float: left
.oe_debug_view_log
font-size: 95%
.oe_debug_view_log label
display: block
width: 49%
text-align: right
float: left
font-weight: bold
color: #009
.oe_debug_view_log span
display: block
width: 49%
float: right
color: #333
// }}}
//Tree view
.openerp
.tree_header
background-color: #f0f0f0
border-bottom: 1px solid #cacaca
color: #4c4c4c
padding: 5px
height: 25px
button
float: right
height: 27px
margin-right: 5px
.oe-treeview-table
width: 100%
background-color: white
border-spacing: 0
th
padding: 10px
color: #4c4c4c
font-weight: bold
background-color: #f0f0f0
border-bottom: 2px solid #cacaca
.treeview-tr, .treeview-td
cursor: pointer
border-right: 1px dotted #afafb6
vertical-align: top
text-align: left
border-bottom: 1px solid #cfcccc
tr:hover
background-color: #e0e0f8
.oe-number
text-align: right !important
span
font-size: 90%
font-weight: normal
white-space: nowrap
display: block
.treeview-tr.oe-treeview-first
background: transparent url(/web/static/src/img/expand.gif) 0 50% no-repeat
.oe_open .treeview-tr.oe-treeview-first
background-image: url(/web/static/src/img/collapse.gif)
.treeview-tr.oe-treeview-first span, .treeview-td.oe-treeview-first span
margin-left: 16px
// Kitten Mode {{{
.kitten-mode-activated
background-image: url(http://placekitten.com/g/1365/769)
background-size: cover
background-attachment: fixed
>*
opacity: 0.70
// }}}
div.ui-widget-overlay
background: black
@include opacity(0.3)
// au BufWritePost,FileWritePost *.sass :!sass --style expanded --line-numbers <afile> > "%:p:r.css"
// vim:tabstop=4:shiftwidth=4:softtabstop=4:fdm=marker: