[IMP] factorization of view manager design; split global VS one2many CSS
bzr revid: fp@tinyerp.com-20120615165933-80vj5e6n6lzmgw0p
This commit is contained in:
Fabien Pinckaers
+147
-142
@@ -48,7 +48,7 @@
|
||||
background: white;
|
||||
/* http://www.quirksmode.org/dom/inputfile.html
|
||||
* http://stackoverflow.com/questions/2855589/replace-input-type-file-by-an-image
|
||||
*/
|
||||
*/ */
|
||||
}
|
||||
.openerp a {
|
||||
text-decoration: none;
|
||||
@@ -866,8 +866,149 @@
|
||||
.openerp .oe_application a:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
.openerp .oe_view_manager_header {
|
||||
.openerp .oe_view_manager .oe_view_manager_header {
|
||||
width: 100%;
|
||||
}
|
||||
.openerp .oe_view_manager .oe_view_manager_header .oe_header_row {
|
||||
clear: both;
|
||||
text-shadow: 0 1px 1px white;
|
||||
}
|
||||
.openerp .oe_view_manager .oe_view_manager_header .oe_header_row:last-child td {
|
||||
padding-top: 0;
|
||||
}
|
||||
.openerp .oe_view_manager .oe_view_manager_header .oe_view_manager_sidebar {
|
||||
margin: 0px auto;
|
||||
width: 400px;
|
||||
text-align: center;
|
||||
}
|
||||
.openerp .oe_view_manager .oe_view_manager_header td {
|
||||
line-height: 26px;
|
||||
}
|
||||
.openerp .oe_view_manager .oe_view_manager_header h2 {
|
||||
font-size: 18px;
|
||||
margin: 0;
|
||||
float: left;
|
||||
}
|
||||
.openerp .oe_view_manager .oe_view_manager_header h2 a {
|
||||
color: #8a89ba;
|
||||
}
|
||||
.openerp .oe_view_manager .oe_view_manager_header .oe_button_group {
|
||||
display: inline-block;
|
||||
border: 1px solid #ababab;
|
||||
-moz-border-radius: 5px;
|
||||
-webkit-border-radius: 5px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
.openerp .oe_view_manager .oe_view_manager_header .oe_button_group li {
|
||||
float: left;
|
||||
border-right: 1px solid #ababab;
|
||||
}
|
||||
.openerp .oe_view_manager .oe_view_manager_header .oe_button_group li:last-child {
|
||||
border: none;
|
||||
}
|
||||
.openerp .oe_view_manager .oe_view_manager_header .oe_button_group a {
|
||||
color: #4c4c4c;
|
||||
}
|
||||
.openerp .oe_view_manager .oe_view_manager_header .oe_button_group a:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
.openerp .oe_view_manager .oe_view_manager_header .oe_button_group .active {
|
||||
background: #999999;
|
||||
-moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3) inset;
|
||||
-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3) inset;
|
||||
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3) inset;
|
||||
}
|
||||
.openerp .oe_view_manager .oe_view_manager_header .oe_button_group .active a {
|
||||
color: white;
|
||||
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
|
||||
}
|
||||
.openerp .oe_view_manager .oe_view_manager_header .oe_view_manager_buttons {
|
||||
white-space: nowrap;
|
||||
}
|
||||
.openerp .oe_view_manager .oe_view_manager_pager {
|
||||
line-height: 26px;
|
||||
}
|
||||
.openerp .oe_view_manager .oe_pager_value {
|
||||
float: left;
|
||||
margin-right: 8px;
|
||||
}
|
||||
.openerp .oe_view_manager .oe_pager_group {
|
||||
float: left;
|
||||
height: 24px;
|
||||
line-height: 24px;
|
||||
display: inline-block;
|
||||
border: 1px solid #ababab;
|
||||
cursor: pointer;
|
||||
-moz-border-radius: 5px;
|
||||
-webkit-border-radius: 5px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
.openerp .oe_view_manager .oe_pager_group li {
|
||||
height: 24px;
|
||||
line-height: 24px;
|
||||
padding: 0;
|
||||
float: left;
|
||||
border-right: 1px solid #ababab;
|
||||
}
|
||||
.openerp .oe_view_manager .oe_pager_group li:last-child {
|
||||
border: none;
|
||||
}
|
||||
.openerp .oe_view_manager .oe_pager_group a {
|
||||
color: #4c4c4c;
|
||||
padding: 0 8px;
|
||||
}
|
||||
.openerp .oe_view_manager .oe_pager_group a:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
.openerp .oe_view_manager .oe_pager_group .active {
|
||||
background: #999999;
|
||||
-moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3) inset;
|
||||
-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3) inset;
|
||||
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3) inset;
|
||||
}
|
||||
.openerp .oe_view_manager .oe_pager_group .active a {
|
||||
color: white;
|
||||
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
|
||||
}
|
||||
.openerp .oe_view_manager .oe_view_manager_switch li {
|
||||
text-align: center;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
line-height: 16px;
|
||||
}
|
||||
.openerp .oe_view_manager .oe_view_manager_switch li a {
|
||||
position: relative;
|
||||
}
|
||||
.openerp .oe_view_manager .oe_view_manager_switch .oe_vm_switch_list:after, .openerp .oe_view_manager .oe_view_manager_switch .oe_vm_switch_tree:after {
|
||||
padding: 2px;
|
||||
content: "i";
|
||||
}
|
||||
.openerp .oe_view_manager .oe_view_manager_switch .oe_vm_switch_graph:after {
|
||||
font-family: "mnmliconsRegular" !important;
|
||||
font-size: 21px;
|
||||
font-weight: 300 !important;
|
||||
content: "}";
|
||||
top: -2px;
|
||||
position: relative;
|
||||
}
|
||||
.openerp .oe_view_manager .oe_view_manager_switch .oe_vm_switch_gantt:after {
|
||||
font-family: "mnmliconsRegular" !important;
|
||||
font-size: 21px;
|
||||
font-weight: 300 !important;
|
||||
content: "y";
|
||||
top: -2px;
|
||||
position: relative;
|
||||
}
|
||||
.openerp .oe_view_manager .oe_view_manager_switch .oe_vm_switch_calendar:after {
|
||||
content: "P";
|
||||
}
|
||||
.openerp .oe_view_manager .oe_view_manager_switch .oe_vm_switch_kanban:after {
|
||||
content: "k";
|
||||
}
|
||||
.openerp .oe_view_manager .oe_view_manager_switch .oe_vm_switch_diagram:after {
|
||||
content: "f";
|
||||
}
|
||||
.openerp .oe_view_manager_global > .oe_view_manager_header {
|
||||
border-top: 1px solid #cacaca;
|
||||
border-bottom: 1px solid #cacaca;
|
||||
background-color: #fcfcfc;
|
||||
@@ -881,150 +1022,14 @@
|
||||
-webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4), 0 0 9px rgba(0, 0, 0, 0.1);
|
||||
box-shadow: 0 1px 0 rgba(255, 255, 255, 0.4), 0 0 9px rgba(0, 0, 0, 0.1);
|
||||
}
|
||||
.openerp .oe_view_manager_header .oe_header_row {
|
||||
clear: both;
|
||||
text-shadow: 0 1px 1px white;
|
||||
}
|
||||
.openerp .oe_view_manager_header .oe_header_row td {
|
||||
.openerp .oe_view_manager_global > .oe_view_manager_header .oe_header_row td {
|
||||
padding: 8px;
|
||||
}
|
||||
.openerp .oe_view_manager_header .oe_header_row:last-child td {
|
||||
padding-top: 0;
|
||||
}
|
||||
.openerp .oe_view_manager_header .oe_header_row:first-child td {
|
||||
.openerp .oe_view_manager_global > .oe_view_manager_header .oe_header_row:first-child td {
|
||||
padding-top: 8px;
|
||||
}
|
||||
.openerp .oe_view_manager_header .oe_view_manager_sidebar {
|
||||
margin: 0px auto;
|
||||
width: 400px;
|
||||
text-align: center;
|
||||
}
|
||||
.openerp .oe_view_manager_header td {
|
||||
line-height: 26px;
|
||||
}
|
||||
.openerp .oe_view_manager_header h2 {
|
||||
font-size: 18px;
|
||||
margin: 0;
|
||||
float: left;
|
||||
}
|
||||
.openerp .oe_view_manager_header h2 a {
|
||||
color: #8a89ba;
|
||||
}
|
||||
.openerp .oe_view_manager_header .oe_button_group {
|
||||
display: inline-block;
|
||||
border: 1px solid #ababab;
|
||||
-moz-border-radius: 5px;
|
||||
-webkit-border-radius: 5px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
.openerp .oe_view_manager_header .oe_button_group li {
|
||||
float: left;
|
||||
border-right: 1px solid #ababab;
|
||||
}
|
||||
.openerp .oe_view_manager_header .oe_button_group li:last-child {
|
||||
border: none;
|
||||
}
|
||||
.openerp .oe_view_manager_header .oe_button_group a {
|
||||
color: #4c4c4c;
|
||||
}
|
||||
.openerp .oe_view_manager_header .oe_button_group a:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
.openerp .oe_view_manager_header .oe_button_group .active {
|
||||
background: #999999;
|
||||
-moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3) inset;
|
||||
-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3) inset;
|
||||
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3) inset;
|
||||
}
|
||||
.openerp .oe_view_manager_header .oe_button_group .active a {
|
||||
color: white;
|
||||
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
|
||||
}
|
||||
.openerp .oe_view_manager_header .oe_view_manager_buttons {
|
||||
white-space: nowrap;
|
||||
}
|
||||
.openerp .oe_view_manager_pager {
|
||||
line-height: 26px;
|
||||
}
|
||||
.openerp .oe_pager_value {
|
||||
float: left;
|
||||
margin-right: 8px;
|
||||
}
|
||||
.openerp .oe_pager_group {
|
||||
float: left;
|
||||
height: 24px;
|
||||
line-height: 24px;
|
||||
display: inline-block;
|
||||
border: 1px solid #ababab;
|
||||
cursor: pointer;
|
||||
-moz-border-radius: 5px;
|
||||
-webkit-border-radius: 5px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
.openerp .oe_pager_group li {
|
||||
height: 24px;
|
||||
line-height: 24px;
|
||||
padding: 0;
|
||||
float: left;
|
||||
border-right: 1px solid #ababab;
|
||||
}
|
||||
.openerp .oe_pager_group li:last-child {
|
||||
border: none;
|
||||
}
|
||||
.openerp .oe_pager_group a {
|
||||
color: #4c4c4c;
|
||||
padding: 0 8px;
|
||||
}
|
||||
.openerp .oe_pager_group a:hover {
|
||||
text-decoration: none;
|
||||
}
|
||||
.openerp .oe_pager_group .active {
|
||||
background: #999999;
|
||||
-moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3) inset;
|
||||
-webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3) inset;
|
||||
box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3) inset;
|
||||
}
|
||||
.openerp .oe_pager_group .active a {
|
||||
color: white;
|
||||
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
|
||||
}
|
||||
.openerp .oe_view_manager_switch li {
|
||||
text-align: center;
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
line-height: 16px;
|
||||
}
|
||||
.openerp .oe_view_manager_switch li a {
|
||||
position: relative;
|
||||
}
|
||||
.openerp .oe_view_manager_switch .oe_vm_switch_list:after, .openerp .oe_view_manager_switch .oe_vm_switch_tree:after {
|
||||
padding: 2px;
|
||||
content: "i";
|
||||
}
|
||||
.openerp .oe_view_manager_switch .oe_vm_switch_graph:after {
|
||||
font-family: "mnmliconsRegular" !important;
|
||||
font-size: 21px;
|
||||
font-weight: 300 !important;
|
||||
content: "}";
|
||||
top: -2px;
|
||||
position: relative;
|
||||
}
|
||||
.openerp .oe_view_manager_switch .oe_vm_switch_gantt:after {
|
||||
font-family: "mnmliconsRegular" !important;
|
||||
font-size: 21px;
|
||||
font-weight: 300 !important;
|
||||
content: "y";
|
||||
top: -2px;
|
||||
position: relative;
|
||||
}
|
||||
.openerp .oe_view_manager_switch .oe_vm_switch_calendar:after {
|
||||
content: "P";
|
||||
}
|
||||
.openerp .oe_view_manager_switch .oe_vm_switch_kanban:after {
|
||||
content: "k";
|
||||
}
|
||||
.openerp .oe_view_manager_switch .oe_vm_switch_diagram:after {
|
||||
content: "f";
|
||||
.openerp .oe_form_field_one2many > .oe_view_manager .oe_header_row_top {
|
||||
display: none;
|
||||
}
|
||||
.openerp .oe_form_dropdown_section {
|
||||
position: relative;
|
||||
|
||||
@@ -704,49 +704,79 @@ $colour4: #8a89ba
|
||||
&:hover
|
||||
text-decoration: underline
|
||||
// }}}
|
||||
// ViewManager.header {{{
|
||||
.oe_view_manager_header
|
||||
width: 100%
|
||||
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
|
||||
//min-height: 26px
|
||||
//line-height: 26px
|
||||
clear: both
|
||||
text-shadow: 0 1px 1px white
|
||||
|
||||
// ViewManager common styles
|
||||
.oe_view_manager
|
||||
// ViewManager.header {{{
|
||||
.oe_view_manager_header
|
||||
width: 100%
|
||||
.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
|
||||
width: 400px
|
||||
text-align: center
|
||||
td
|
||||
padding: 8px
|
||||
.oe_header_row:last-child
|
||||
td
|
||||
padding-top: 0
|
||||
.oe_header_row:first-child
|
||||
td
|
||||
padding-top: 8px
|
||||
.oe_view_manager_sidebar
|
||||
margin: 0px auto
|
||||
width: 400px
|
||||
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
|
||||
h2
|
||||
font-size: 18px
|
||||
margin: 0
|
||||
.oe_pager_value
|
||||
float: left
|
||||
a
|
||||
color: $colour4
|
||||
.oe_button_group
|
||||
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
|
||||
@@ -755,76 +785,61 @@ $colour4: #8a89ba
|
||||
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
|
||||
// }}}
|
||||
// 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_graph:after
|
||||
font-family: "mnmliconsRegular" !important
|
||||
font-size: 21px
|
||||
font-weight: 300 !important
|
||||
content: "}"
|
||||
top: -2px
|
||||
position: relative
|
||||
.oe_vm_switch_list:after, .oe_vm_switch_tree:after
|
||||
padding: 2px
|
||||
content: "i"
|
||||
.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"
|
||||
// }}}
|
||||
.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 top header specific style
|
||||
.oe_view_manager_global
|
||||
> .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 one2many specific style
|
||||
.oe_form_field_one2many > .oe_view_manager
|
||||
.oe_header_row_top
|
||||
display: none
|
||||
|
||||
|
||||
// ViewManager.sidebar {{{
|
||||
.oe_form_dropdown_section
|
||||
position: relative
|
||||
|
||||
@@ -433,7 +433,6 @@
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
|
||||
<div class="oe_view_manager_body">
|
||||
<t t-foreach="widget.views_src" t-as="view">
|
||||
<div t-attf-class="oe_view_manager_view_#{view.view_type}"/>
|
||||
@@ -1178,8 +1177,6 @@
|
||||
</t>
|
||||
|
||||
<t t-name="One2Many.viewmanager" t-extend="ViewManager">
|
||||
<t t-jquery=".oe_header_row_top" t-operation="replace"/>
|
||||
|
||||
<t t-jquery=".oe-view-manager-header">
|
||||
this.attr('t-if', 'views.length != 1');
|
||||
</t>
|
||||
|
||||
Reference in New Issue
Block a user