[ADD] Add styles for new main menu

bzr revid: fme@openerp.com-20120223150230-n935rq8bv65a6gbj
This commit is contained in:
Fabien Meghazi 2012-02-23 16:02:30 +01:00
parent 865ffbd4cc
commit a90d466ccb
4 changed files with 235 additions and 20 deletions

View File

@ -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;
}

View File

@ -41,7 +41,100 @@
// }}}
.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"
// vim:tabstop=4:shiftwidth=4:softtabstop=4:fdm=marker:

View File

@ -887,7 +887,7 @@ openerp.web.Menu = openerp.web.OldWidget.extend(/** @lends openerp.web.Menu# */
on_toggle_fold: function() {
this.$secondary_menu.toggleClass('oe_folded').toggleClass('oe_unfolded');
if (this.folded) {
this.$secondary_menu.find('.oe_secondary_menu.active').show();
this.$secondary_menu.find('.oe_secondary_menu.oe_active').show();
} else {
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
*/
open_menu: function (menu_id) {
this.$element.add(this.$secondary_menu).find('.active')
.removeClass('active');
this.$element.add(this.$secondary_menu).find('.oe_active')
.removeClass('oe_active');
this.$secondary_menu.find('> .oe_secondary_menu').hide();
var $primary_menu;
@ -913,7 +913,7 @@ openerp.web.Menu = openerp.web.OldWidget.extend(/** @lends openerp.web.Menu# */
if ($secondary_submenu.length) {
for(;;) {
if ($secondary_submenu.hasClass('leaf')) {
$secondary_submenu.addClass('active');
$secondary_submenu.addClass('oe_active');
} else if ($secondary_submenu.hasClass('submenu')) {
$secondary_submenu.addClass('opened')
}
@ -932,9 +932,9 @@ openerp.web.Menu = openerp.web.OldWidget.extend(/** @lends openerp.web.Menu# */
if (!$primary_menu.length) {
return;
}
$primary_menu.addClass('active');
$primary_menu.addClass('oe_active');
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) {
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) {
var $sub_menu, $main_menu,
active = $clicked_menu.is('.active'),
active = $clicked_menu.is('.oe_active'),
sub_menu_visible = 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;
this.$secondary_menu.find('.oe_secondary_menu').hide();
$('.active', this.$element.add(this.$secondary_menu)).removeClass('active');
$main_menu.add($clicked_menu).add($sub_menu).addClass('active');
$('.oe_active', this.$element.add(this.$secondary_menu)).removeClass('oe_active');
$main_menu.add($clicked_menu).add($sub_menu).addClass('oe_active');
if (has_submenu_items) {
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_action.add(this.proxy('on_menu_action'));
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.start();
},

View File

@ -20,9 +20,9 @@
<t t-name="WebClient">
<div class="oe_webclient">
<div class="oe_topbar">
<div id="oe_header" class="header"></div>
<div id="oe_menu" class="menu"></div>
<div class="oe_menu_placeholder" id="oe_menu_temporary_id"/>
</div>
<div id="oe_header" class="header"></div>
<div class="oe_leftbar">
<!--
<a href="#" class="oe_logo"><img src="img/logo.png"/></a>
@ -45,7 +45,6 @@
</td>
</tr>
</table>
</div>
</div>
</t>
@ -375,15 +374,13 @@
><t t-esc="shortcut.name"/></li>
</ul>
<t t-name="Menu">
<table align="center">
<tr>
<td t-foreach="widget.data.data.children" t-as="menu">
<ul class="oe_menu" t-if="widget.data">
<li t-foreach="widget.data.data.children" t-as="menu">
<a href="#" t-att-data-menu="menu.id">
<t t-esc="menu.name"/>
</a>
</td>
</tr>
</table>
</li>
</ul>
</t>
<t t-name="Menu.secondary">
<div t-attf-class="oe_toggle_secondary_menu">