[ADD] Add styles for new main menu
bzr revid: fme@openerp.com-20120223150230-n935rq8bv65a6gbj
This commit is contained in:
parent
865ffbd4cc
commit
a90d466ccb
|
@ -0,0 +1,125 @@
|
||||||
|
/* line 43, base.sass */
|
||||||
|
.openerp2 {
|
||||||
|
padding: 0;
|
||||||
|
margin: 0;
|
||||||
|
font-family: "Lucida Grande", Helvetica, Verdana, Arial, sans-serif;
|
||||||
|
color: #4c4c4c;
|
||||||
|
font-size: 13px;
|
||||||
|
background: white;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
/* line 53, base.sass */
|
||||||
|
.openerp2 a {
|
||||||
|
color: #4c4c4c;
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
/* line 59, base.sass */
|
||||||
|
.openerp2 .oe_webclient {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
}
|
||||||
|
/* line 68, base.sass */
|
||||||
|
.openerp2 .oe_topbar {
|
||||||
|
width: 100%;
|
||||||
|
height: 31px;
|
||||||
|
border-top: solid 1px #d3d3d3;
|
||||||
|
border-bottom: solid 1px black;
|
||||||
|
background: #646060;
|
||||||
|
background: -moz-linear-gradient(#646060, #262626);
|
||||||
|
background: -webkit-gradient(linear, left top, left bottom, from(#646060), to(#262626));
|
||||||
|
background: -webkit-linear-gradient(#646060, #262626);
|
||||||
|
}
|
||||||
|
/* line 75, base.sass */
|
||||||
|
.openerp2 .oe_topbar .oe_topbar_item {
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
|
/* line 77, base.sass */
|
||||||
|
.openerp2 .oe_topbar .oe_topbar_item li {
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
|
/* line 79, base.sass */
|
||||||
|
.openerp2 .oe_topbar .oe_topbar_item li a {
|
||||||
|
display: block;
|
||||||
|
padding: 5px 10px 7px;
|
||||||
|
line-height: 20px;
|
||||||
|
height: 20px;
|
||||||
|
color: #eeeeee;
|
||||||
|
vertical-align: top;
|
||||||
|
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
|
||||||
|
}
|
||||||
|
/* line 87, base.sass */
|
||||||
|
.openerp2 .oe_topbar .oe_topbar_item li a:hover {
|
||||||
|
background: #303030;
|
||||||
|
color: white;
|
||||||
|
-moz-box-shadow: 0 1px 2px rgba(255, 255, 255, 0.3) inset;
|
||||||
|
-webkit-box-shadow: 0 1px 2px rgba(255, 255, 255, 0.3) inset;
|
||||||
|
-box-shadow: 0 1px 2px rgba(255, 255, 255, 0.3) inset;
|
||||||
|
}
|
||||||
|
/* line 91, base.sass */
|
||||||
|
.openerp2 .oe_topbar .oe_topbar_item .oe_active {
|
||||||
|
background: #303030;
|
||||||
|
font-weight: bold;
|
||||||
|
color: white;
|
||||||
|
-moz-box-shadow: 0 1px 2px rgba(255, 255, 255, 0.3) inset;
|
||||||
|
-webkit-box-shadow: 0 1px 2px rgba(255, 255, 255, 0.3) inset;
|
||||||
|
-box-shadow: 0 1px 2px rgba(255, 255, 255, 0.3) inset;
|
||||||
|
}
|
||||||
|
/* line 97, base.sass */
|
||||||
|
.openerp2 .oe_topbar .oe_topbar_avatar {
|
||||||
|
width: 24px;
|
||||||
|
height: 24px;
|
||||||
|
margin: -2px 2px 0 0;
|
||||||
|
-moz-border-radius: 4px;
|
||||||
|
-webkit-border-radius: 4px;
|
||||||
|
border-radius: 4px;
|
||||||
|
}
|
||||||
|
/* line 105, base.sass */
|
||||||
|
.openerp2 .oe_menu {
|
||||||
|
float: left;
|
||||||
|
padding: 0;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
/* line 109, base.sass */
|
||||||
|
.openerp2 .oe_menu li {
|
||||||
|
list-style-type: none;
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
|
/* line 112, base.sass */
|
||||||
|
.openerp2 .oe_menu a {
|
||||||
|
display: block;
|
||||||
|
padding: 5px 10px 7px;
|
||||||
|
line-height: 20px;
|
||||||
|
height: 20px;
|
||||||
|
color: #eeeeee;
|
||||||
|
vertical-align: top;
|
||||||
|
text-shadow: 0 1px 1px rgba(0, 0, 0, 0.2);
|
||||||
|
}
|
||||||
|
/* line 120, base.sass */
|
||||||
|
.openerp2 .oe_menu a:hover {
|
||||||
|
background: #303030;
|
||||||
|
color: white;
|
||||||
|
-moz-box-shadow: 0 1px 2px rgba(255, 255, 255, 0.3) inset;
|
||||||
|
-webkit-box-shadow: 0 1px 2px rgba(255, 255, 255, 0.3) inset;
|
||||||
|
-box-shadow: 0 1px 2px rgba(255, 255, 255, 0.3) inset;
|
||||||
|
}
|
||||||
|
/* line 124, base.sass */
|
||||||
|
.openerp2 .oe_menu .oe_active {
|
||||||
|
background: #303030;
|
||||||
|
font-weight: bold;
|
||||||
|
color: white;
|
||||||
|
-moz-box-shadow: 0 1px 2px rgba(255, 255, 255, 0.3) inset;
|
||||||
|
-webkit-box-shadow: 0 1px 2px rgba(255, 255, 255, 0.3) inset;
|
||||||
|
-box-shadow: 0 1px 2px rgba(255, 255, 255, 0.3) inset;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* line 133, base.sass */
|
||||||
|
.openerp .oe-shortcuts {
|
||||||
|
position: static;
|
||||||
|
}
|
||||||
|
/* line 135, base.sass */
|
||||||
|
.openerp #oe_header {
|
||||||
|
clear: both;
|
||||||
|
}
|
|
@ -41,7 +41,100 @@
|
||||||
// }}}
|
// }}}
|
||||||
|
|
||||||
.openerp2
|
.openerp2
|
||||||
// Minh's playground.
|
// Common styles {{{
|
||||||
|
padding: 0
|
||||||
|
margin: 0
|
||||||
|
font-family: "Lucida Grande", Helvetica, Verdana, Arial, sans-serif
|
||||||
|
color: #4c4c4c
|
||||||
|
font-size: 13px
|
||||||
|
background: white
|
||||||
|
position: relative
|
||||||
|
|
||||||
|
a
|
||||||
|
color: #4c4c4c
|
||||||
|
text-decoration: none
|
||||||
|
// }}}
|
||||||
|
|
||||||
|
// WebClient {{{
|
||||||
|
.oe_webclient
|
||||||
|
position: absolute
|
||||||
|
top: 0
|
||||||
|
bottom: 0
|
||||||
|
left: 0
|
||||||
|
right: 0
|
||||||
|
// }}}
|
||||||
|
|
||||||
|
// Topbar {{{
|
||||||
|
.oe_topbar
|
||||||
|
width: 100%
|
||||||
|
height: 31px
|
||||||
|
border-top: solid 1px #d3d3d3
|
||||||
|
border-bottom: solid 1px black
|
||||||
|
@include vertical-gradient(#646060, #262626)
|
||||||
|
|
||||||
|
.oe_topbar_item
|
||||||
|
float: left
|
||||||
|
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_topbar_avatar
|
||||||
|
width: 24px
|
||||||
|
height: 24px
|
||||||
|
margin: -2px 2px 0 0
|
||||||
|
@include radius(4px)
|
||||||
|
// }}}
|
||||||
|
|
||||||
|
// Menu {{{
|
||||||
|
.oe_menu
|
||||||
|
float: left
|
||||||
|
padding: 0
|
||||||
|
margin: 0
|
||||||
|
li
|
||||||
|
list-style-type: none
|
||||||
|
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)
|
||||||
|
// }}}
|
||||||
|
|
||||||
|
.openerp
|
||||||
|
// Transitional overrides for old styles {{{
|
||||||
|
.oe-shortcuts
|
||||||
|
position: static
|
||||||
|
#oe_header
|
||||||
|
clear: both
|
||||||
|
// }}}
|
||||||
|
|
||||||
// au BufWritePost,FileWritePost *.sass :!sass --style expanded --line-numbers <afile> > "%:p:r.css"
|
// au BufWritePost,FileWritePost *.sass :!sass --style expanded --line-numbers <afile> > "%:p:r.css"
|
||||||
// vim:tabstop=4:shiftwidth=4:softtabstop=4:fdm=marker:
|
// vim:tabstop=4:shiftwidth=4:softtabstop=4:fdm=marker:
|
||||||
|
|
|
@ -887,7 +887,7 @@ openerp.web.Menu = openerp.web.OldWidget.extend(/** @lends openerp.web.Menu# */
|
||||||
on_toggle_fold: function() {
|
on_toggle_fold: function() {
|
||||||
this.$secondary_menu.toggleClass('oe_folded').toggleClass('oe_unfolded');
|
this.$secondary_menu.toggleClass('oe_folded').toggleClass('oe_unfolded');
|
||||||
if (this.folded) {
|
if (this.folded) {
|
||||||
this.$secondary_menu.find('.oe_secondary_menu.active').show();
|
this.$secondary_menu.find('.oe_secondary_menu.oe_active').show();
|
||||||
} else {
|
} else {
|
||||||
this.$secondary_menu.find('.oe_secondary_menu').hide();
|
this.$secondary_menu.find('.oe_secondary_menu').hide();
|
||||||
}
|
}
|
||||||
|
@ -903,8 +903,8 @@ openerp.web.Menu = openerp.web.OldWidget.extend(/** @lends openerp.web.Menu# */
|
||||||
* @param {Number} menu_id database id of the terminal menu to select
|
* @param {Number} menu_id database id of the terminal menu to select
|
||||||
*/
|
*/
|
||||||
open_menu: function (menu_id) {
|
open_menu: function (menu_id) {
|
||||||
this.$element.add(this.$secondary_menu).find('.active')
|
this.$element.add(this.$secondary_menu).find('.oe_active')
|
||||||
.removeClass('active');
|
.removeClass('oe_active');
|
||||||
this.$secondary_menu.find('> .oe_secondary_menu').hide();
|
this.$secondary_menu.find('> .oe_secondary_menu').hide();
|
||||||
|
|
||||||
var $primary_menu;
|
var $primary_menu;
|
||||||
|
@ -913,7 +913,7 @@ openerp.web.Menu = openerp.web.OldWidget.extend(/** @lends openerp.web.Menu# */
|
||||||
if ($secondary_submenu.length) {
|
if ($secondary_submenu.length) {
|
||||||
for(;;) {
|
for(;;) {
|
||||||
if ($secondary_submenu.hasClass('leaf')) {
|
if ($secondary_submenu.hasClass('leaf')) {
|
||||||
$secondary_submenu.addClass('active');
|
$secondary_submenu.addClass('oe_active');
|
||||||
} else if ($secondary_submenu.hasClass('submenu')) {
|
} else if ($secondary_submenu.hasClass('submenu')) {
|
||||||
$secondary_submenu.addClass('opened')
|
$secondary_submenu.addClass('opened')
|
||||||
}
|
}
|
||||||
|
@ -932,9 +932,9 @@ openerp.web.Menu = openerp.web.OldWidget.extend(/** @lends openerp.web.Menu# */
|
||||||
if (!$primary_menu.length) {
|
if (!$primary_menu.length) {
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
$primary_menu.addClass('active');
|
$primary_menu.addClass('oe_active');
|
||||||
this.$secondary_menu.find(
|
this.$secondary_menu.find(
|
||||||
'div[data-menu-parent=' + $primary_menu.data('menu') + ']').addClass('active').toggle(!this.folded);
|
'div[data-menu-parent=' + $primary_menu.data('menu') + ']').addClass('oe_active').toggle(!this.folded);
|
||||||
},
|
},
|
||||||
on_menu_click: function(ev, id) {
|
on_menu_click: function(ev, id) {
|
||||||
id = id || 0;
|
id = id || 0;
|
||||||
|
@ -964,7 +964,7 @@ openerp.web.Menu = openerp.web.OldWidget.extend(/** @lends openerp.web.Menu# */
|
||||||
},
|
},
|
||||||
do_menu_click: function($clicked_menu, manual) {
|
do_menu_click: function($clicked_menu, manual) {
|
||||||
var $sub_menu, $main_menu,
|
var $sub_menu, $main_menu,
|
||||||
active = $clicked_menu.is('.active'),
|
active = $clicked_menu.is('.oe_active'),
|
||||||
sub_menu_visible = false,
|
sub_menu_visible = false,
|
||||||
has_submenu_items = false;
|
has_submenu_items = false;
|
||||||
|
|
||||||
|
@ -980,8 +980,8 @@ openerp.web.Menu = openerp.web.OldWidget.extend(/** @lends openerp.web.Menu# */
|
||||||
has_submenu_items = !!$sub_menu.children().length;
|
has_submenu_items = !!$sub_menu.children().length;
|
||||||
this.$secondary_menu.find('.oe_secondary_menu').hide();
|
this.$secondary_menu.find('.oe_secondary_menu').hide();
|
||||||
|
|
||||||
$('.active', this.$element.add(this.$secondary_menu)).removeClass('active');
|
$('.oe_active', this.$element.add(this.$secondary_menu)).removeClass('oe_active');
|
||||||
$main_menu.add($clicked_menu).add($sub_menu).addClass('active');
|
$main_menu.add($clicked_menu).add($sub_menu).addClass('oe_active');
|
||||||
|
|
||||||
if (has_submenu_items) {
|
if (has_submenu_items) {
|
||||||
if (!(this.folded && manual)) {
|
if (!(this.folded && manual)) {
|
||||||
|
@ -1125,7 +1125,7 @@ openerp.web.WebClient = openerp.web.Widget.extend(/** @lends openerp.web.WebClie
|
||||||
self.header.on_logout.add(this.proxy('on_logout'));
|
self.header.on_logout.add(this.proxy('on_logout'));
|
||||||
self.header.on_action.add(this.proxy('on_menu_action'));
|
self.header.on_action.add(this.proxy('on_menu_action'));
|
||||||
self.header.appendTo($("#oe_header"));
|
self.header.appendTo($("#oe_header"));
|
||||||
self.menu = new openerp.web.Menu(self, "oe_menu", "oe_secondary_menu");
|
self.menu = new openerp.web.Menu(self, "oe_menu_temporary_id", "oe_secondary_menu");
|
||||||
self.menu.on_action.add(this.proxy('on_menu_action'));
|
self.menu.on_action.add(this.proxy('on_menu_action'));
|
||||||
self.menu.start();
|
self.menu.start();
|
||||||
},
|
},
|
||||||
|
|
|
@ -20,9 +20,9 @@
|
||||||
<t t-name="WebClient">
|
<t t-name="WebClient">
|
||||||
<div class="oe_webclient">
|
<div class="oe_webclient">
|
||||||
<div class="oe_topbar">
|
<div class="oe_topbar">
|
||||||
<div id="oe_header" class="header"></div>
|
<div class="oe_menu_placeholder" id="oe_menu_temporary_id"/>
|
||||||
<div id="oe_menu" class="menu"></div>
|
|
||||||
</div>
|
</div>
|
||||||
|
<div id="oe_header" class="header"></div>
|
||||||
<div class="oe_leftbar">
|
<div class="oe_leftbar">
|
||||||
<!--
|
<!--
|
||||||
<a href="#" class="oe_logo"><img src="img/logo.png"/></a>
|
<a href="#" class="oe_logo"><img src="img/logo.png"/></a>
|
||||||
|
@ -45,7 +45,6 @@
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
</table>
|
</table>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</t>
|
</t>
|
||||||
|
@ -375,15 +374,13 @@
|
||||||
><t t-esc="shortcut.name"/></li>
|
><t t-esc="shortcut.name"/></li>
|
||||||
</ul>
|
</ul>
|
||||||
<t t-name="Menu">
|
<t t-name="Menu">
|
||||||
<table align="center">
|
<ul class="oe_menu" t-if="widget.data">
|
||||||
<tr>
|
<li t-foreach="widget.data.data.children" t-as="menu">
|
||||||
<td t-foreach="widget.data.data.children" t-as="menu">
|
|
||||||
<a href="#" t-att-data-menu="menu.id">
|
<a href="#" t-att-data-menu="menu.id">
|
||||||
<t t-esc="menu.name"/>
|
<t t-esc="menu.name"/>
|
||||||
</a>
|
</a>
|
||||||
</td>
|
</li>
|
||||||
</tr>
|
</ul>
|
||||||
</table>
|
|
||||||
</t>
|
</t>
|
||||||
<t t-name="Menu.secondary">
|
<t t-name="Menu.secondary">
|
||||||
<div t-attf-class="oe_toggle_secondary_menu">
|
<div t-attf-class="oe_toggle_secondary_menu">
|
||||||
|
|
Loading…
Reference in New Issue