[REF] website*: frontend user navbar
* Remove use of bootstrap navbar * Add navbar.less file for compatibility with enterprise * Modify the location of the "new page/product/..." elements
This commit is contained in:
qsm-odoo
@@ -312,15 +312,6 @@
|
||||
.o_mail_navbar_dropdown {
|
||||
width: 350px;
|
||||
padding: 0;
|
||||
@media (max-width: @screen-xs-max) {
|
||||
background-color: white!important;
|
||||
max-height: none!important;
|
||||
position: fixed!important;
|
||||
top: @navbar-height;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.o_spinner {
|
||||
.o-flex-display();
|
||||
|
||||
@@ -0,0 +1,174 @@
|
||||
|
||||
.o_main_navbar {
|
||||
position: relative;
|
||||
height: @odoo-navbar-height;
|
||||
border: 1px solid @odoo-navbar-inverse-link-hover-bg;
|
||||
background-color: @odoo-brand-primary;
|
||||
color: white;
|
||||
.box-shadow(0px 0px 8px @odoo-main-text-color);
|
||||
|
||||
> button {
|
||||
float: left;
|
||||
width: @odoo-navbar-height - 2;
|
||||
height: @odoo-navbar-height - 2;
|
||||
border: none;
|
||||
padding: 0;
|
||||
line-height: @odoo-navbar-height - 2;
|
||||
background-color: transparent;
|
||||
|
||||
font-size: 18px;
|
||||
.user-select(none);
|
||||
|
||||
&:hover, &:focus {
|
||||
background-color: @odoo-navbar-inverse-link-hover-bg;
|
||||
}
|
||||
&:focus, &:active, &:focus:active {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
&.o_menu_toggle {
|
||||
margin-right: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
> ul {
|
||||
display: block;
|
||||
float: left;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
list-style: none;
|
||||
|
||||
> li {
|
||||
position: relative;
|
||||
display: block;
|
||||
float: left;
|
||||
|
||||
> a {
|
||||
display: block;
|
||||
height: @odoo-navbar-height - 2;
|
||||
padding: 0 10px;
|
||||
color: white;
|
||||
line-height: @odoo-navbar-height - 2;
|
||||
|
||||
&:hover {
|
||||
background-color: @odoo-navbar-inverse-link-hover-bg;
|
||||
}
|
||||
|
||||
&:focus, &:active, &:focus:active {
|
||||
outline: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.o_menu_systray {
|
||||
float: right;
|
||||
.open .dropdown-menu {
|
||||
left: auto;
|
||||
right: 0;
|
||||
}
|
||||
.o_user_menu {
|
||||
float: right;
|
||||
.oe_topbar_avatar {
|
||||
height: 15px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.o_menu_brand {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.open .dropdown-menu {
|
||||
max-height: 90vh; // the dropdown should not overstep the viewport
|
||||
overflow: auto;
|
||||
margin-top: 0;
|
||||
|
||||
.o-menu-indentation(@index) when (@index < 6) {
|
||||
> li.o_menu_header_lvl_@{index}, > li .o_menu_entry_lvl_@{index} {
|
||||
padding-left: @odoo-dropdown-hpadding + (@index - 2)*12px;
|
||||
}
|
||||
.o-menu-indentation(@index + 1);
|
||||
}
|
||||
.o-menu-indentation(3);
|
||||
}
|
||||
|
||||
@media (max-width: @screen-xs-max) {
|
||||
.o-transition(height, 200ms, linear);
|
||||
|
||||
position: relative;
|
||||
height: @odoo-navbar-height;
|
||||
overflow: hidden;
|
||||
|
||||
> ul {
|
||||
> li {
|
||||
float: none;
|
||||
.dropdown-backdrop {
|
||||
display: none;
|
||||
}
|
||||
|
||||
&.open .dropdown-menu {
|
||||
max-height: none;
|
||||
}
|
||||
}
|
||||
|
||||
&.o_menu_sections {
|
||||
width: 100%;
|
||||
|
||||
> li.open .dropdown-menu {
|
||||
position: static;
|
||||
float: none;
|
||||
background-color: transparent;
|
||||
box-shadow: none;
|
||||
border: none;
|
||||
overflow: visible;
|
||||
|
||||
> li > a {
|
||||
background-color: transparent;
|
||||
color: inherit;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
&.o_menu_systray {
|
||||
.o-position-absolute(0px, @odoo-navbar-height - 2, auto, @odoo-navbar-height - 2);
|
||||
height: @odoo-navbar-height - 2;
|
||||
text-align: right;
|
||||
|
||||
> li {
|
||||
display: inline-block;
|
||||
|
||||
&.open .dropdown-menu {
|
||||
.o-position-absolute(@odoo-navbar-height, 0, 0, 0);
|
||||
position: fixed;
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
|
||||
.o_user_menu .oe_topbar_name {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.o_menu_brand {
|
||||
float: none;
|
||||
margin: 0;
|
||||
border-bottom: 1px solid @odoo-navbar-inverse-link-hover-bg;
|
||||
color: transparent;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: @screen-xs-max) {
|
||||
body.o_mobile_menu_opened {
|
||||
overflow: hidden;
|
||||
height: 100%;
|
||||
height: 100vh;
|
||||
|
||||
.o_main_navbar {
|
||||
height: 100%;
|
||||
overflow: auto;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -151,6 +151,8 @@
|
||||
<t t-call="web.less_helpers"/>
|
||||
|
||||
<link rel="stylesheet" type="text/less" href="/web/static/src/less/import_bootstrap.less"/>
|
||||
<link rel="stylesheet" type="text/less" href="/web/static/src/less/navbar.less"/> <!-- Compatibility -->
|
||||
|
||||
<script type="text/javascript" src="/web/static/src/js/framework/session_instance.js"></script>
|
||||
</template>
|
||||
|
||||
|
||||
@@ -1,156 +1,105 @@
|
||||
<?xml version="1.0" encoding="utf-8"?>
|
||||
<openerp>
|
||||
<data>
|
||||
<odoo>
|
||||
<!-- Front-end/Back-end integration -->
|
||||
<template groups="base.group_user" id="user_navbar" inherit_id="website.layout">
|
||||
<xpath expr="//body/div['id=wrawrap']" position="before">
|
||||
<t t-if="website and menu_data">
|
||||
<div id="website_editor_container" class="wb_hidden_xs">
|
||||
<nav id="website_main_menu_navbar" role="navigation">
|
||||
<ul id="oe_applications">
|
||||
<li class="dropdown active">
|
||||
<a class="dropdown full hidden-xs" data-toggle="dropdown" href="#">
|
||||
<i class="fa fa-th-large"/> WEBSITE
|
||||
<b class="caret"/></a>
|
||||
<ul class="dropdown-menu">
|
||||
<li t-as="menu" t-foreach="menu_data['children']">
|
||||
<t t-set="debug_param" t-value="'?&debug=' if debug else ''"/>
|
||||
<a t-att-class="'oe_menu_toggler' if menu.get('children') else 'oe_menu_leaf'" t-att-data-action-id="menu['action'] and menu['action'].split(',')[1] or ''" t-att-data-action-model="menu['action'] and menu['action'].split(',')[0] or ''" t-att-data-menu="menu['id']" t-att-href="'/web%s#menu_id=%s&action=%s' % (debug_param, menu['id'], menu['action'] and menu['action'].split(',')[1] or '')">
|
||||
<i t-attf-class="fa #{menu.get('icon')} fa-lg fa-fw" t-if="menu.get('icon')"/>
|
||||
<span class="oe_menu_text">
|
||||
<t t-esc="menu['name']"/>
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul> <!-- / #oe_applications -->
|
||||
<ul>
|
||||
<li class="o_menu_brand">Website</li>
|
||||
</ul>
|
||||
<ul id="oe_systray">
|
||||
<!-- Mobile preview -->
|
||||
<li class="o_mobile_preview">
|
||||
<a data-action="show-mobile-preview" href="#">
|
||||
<span title="Mobile preview">
|
||||
<i class="fa fa-mobile"/>
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
<!-- Promote -->
|
||||
<li class="dropdown" groups="base.group_website_designer">
|
||||
<a class="dropdown-toggle waves" data-toggle="dropdown" href="#" id="promote-menu-button">
|
||||
<span class="title">PROMOTE</span>
|
||||
<span class="caret"/>
|
||||
</a>
|
||||
<ul class="dropdown-menu oe_promote_menu" role="menu">
|
||||
<li>
|
||||
<a data-action="promote-current-page" href="#">
|
||||
<span title="Promote page on the web">Optimize SEO</span>
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="https://www.adspike.com">
|
||||
<span title="Optimize your AdWords account">Optimize AdWords Campaign</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
|
||||
<!-- Content -->
|
||||
<!-- All the li after #website_addPage_list will be automatically
|
||||
hidden and cloned to #website_addPage_modal -->
|
||||
|
||||
<li class="dropdown content" groups="base.group_website_publisher" t-if="editable">
|
||||
<a id="content-menu-button" class="dropdown-toggle waves" data-toggle="dropdown" href="#">CONTENT <span class="caret"></span></a>
|
||||
<ul class="dropdown-menu oe_content_menu" role="menu">
|
||||
<li groups="base.group_website_designer">
|
||||
<a data-action="edit_menu" href="#"><span title="Edit Top Menu">Edit Menu</span></a>
|
||||
</li>
|
||||
<t t-if="deletable">
|
||||
<li>
|
||||
<ul>
|
||||
<li groups="base.group_website_designer">
|
||||
<a href="#" data-action="rename_page">Rename Page</a>
|
||||
</li>
|
||||
<li groups="base.group_website_designer">
|
||||
<a href="#" data-action="delete_page">Delete Page</a>
|
||||
</li>
|
||||
<xpath expr="//body" position="attributes">
|
||||
<attribute name="class">o_connected_user</attribute>
|
||||
</xpath>
|
||||
<xpath expr="//body/div['id=wrawrap']" position="before">
|
||||
<nav t-if="website and menu_data" id="oe_main_menu_navbar" class="o_main_navbar">
|
||||
<ul id="oe_applications">
|
||||
<li class="dropdown active">
|
||||
<a class="dropdown full" data-toggle="dropdown" href="#">
|
||||
<i class="fa fa-th-large"/> WEBSITE <b class="caret"/>
|
||||
</a>
|
||||
<ul class="dropdown-menu">
|
||||
<li t-as="menu" t-foreach="menu_data['children']">
|
||||
<t t-set="debug_param" t-value="'?&debug=' if debug else ''"/>
|
||||
<a t-att-class="'oe_menu_toggler' if menu.get('children') else 'oe_menu_leaf'" t-att-data-action-id="menu['action'] and menu['action'].split(',')[1] or ''" t-att-data-action-model="menu['action'] and menu['action'].split(',')[0] or ''" t-att-data-menu="menu['id']" t-att-href="'/web%s#menu_id=%s&action=%s' % (debug_param, menu['id'], menu['action'] and menu['action'].split(',')[1] or '')">
|
||||
<i t-attf-class="fa #{menu.get('icon')} fa-lg fa-fw" t-if="menu.get('icon')"/>
|
||||
<span class="oe_menu_text">
|
||||
<t t-esc="menu['name']"/>
|
||||
</span>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<li groups="base.group_website_designer"></li>
|
||||
</t>
|
||||
<li id="website_addPage_list"></li>
|
||||
<li groups="base.group_website_designer" class="animated" data-dismiss="modal">
|
||||
<a href="#" data-action="new_page">
|
||||
<i class="fa fa-file-o"/>
|
||||
<p>Empty Page</p>
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Customize -->
|
||||
<li class="dropdown" groups="base.group_website_designer" id="customize-menu">
|
||||
<a class="dropdown-toggle waves" data-toggle="dropdown" href="#" id="customize-menu-button">
|
||||
<span class="title">CUSTOMIZE</span>
|
||||
<span class="caret"/>
|
||||
</a>
|
||||
<ul class="dropdown-menu" role="menu">
|
||||
<li id="html_editor">
|
||||
<a data-action="ace" href="#advanced-view-editor">HTML Editor</a>
|
||||
</ul>
|
||||
|
||||
<button type="button" class="fa fa-bars pull-right visible-xs-block o_mobile_menu_toggle"/>
|
||||
|
||||
<div class="o_menu_brand">Website</div>
|
||||
|
||||
<ul class="o_menu_sections">
|
||||
<!-- Promote -->
|
||||
<li class="dropdown" groups="base.group_website_designer">
|
||||
<a class="dropdown-toggle waves" data-toggle="dropdown" href="#" id="promote-menu-button">Promote</a>
|
||||
<ul class="dropdown-menu oe_promote_menu" role="menu">
|
||||
<li><a data-action="promote-current-page" href="#" title="Promote page on the web">Optimize SEO</a></li>
|
||||
<li><a href="https://www.adspike.com" title="Optimize your AdWords account">Optimize AdWords Campaign</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li id="theme_customize">
|
||||
<a href="#">Customize Theme</a>
|
||||
<!-- Content -->
|
||||
<li class="dropdown content" groups="base.group_website_publisher" t-if="editable">
|
||||
<a id="content-menu-button" class="dropdown-toggle waves" data-toggle="dropdown" href="#">Content</a>
|
||||
<ul class="dropdown-menu oe_content_menu" role="menu">
|
||||
<li groups="base.group_website_designer">
|
||||
<a data-action="edit_menu" href="#" title="Edit Top Menu">Edit Menu</a>
|
||||
</li>
|
||||
<li t-if="deletable" groups="base.group_website_designer"><a href="#" data-action="rename_page">Rename Page</a></li>
|
||||
<li t-if="deletable" groups="base.group_website_designer"><a href="#" data-action="delete_page">Delete Page</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li id="install_apps">
|
||||
<a href="/web#return_label=Website&action=website.action_module_website">Install Apps</a>
|
||||
<!-- Customize -->
|
||||
<li class="dropdown" groups="base.group_website_designer" id="customize-menu">
|
||||
<a class="dropdown-toggle waves" data-toggle="dropdown" href="#" id="customize-menu-button">Customize</a>
|
||||
<ul class="dropdown-menu" role="menu">
|
||||
<li id="html_editor"><a data-action="ace" href="#advanced-view-editor">HTML Editor</a></li>
|
||||
<li id="theme_customize"><a href="#">Customize Theme</a></li>
|
||||
<li id="install_apps"><a href="/web#return_label=Website&action=website.action_module_website">Install Apps</a></li>
|
||||
<li class="divider"/>
|
||||
</ul>
|
||||
</li>
|
||||
<li class="divider"/>
|
||||
</ul>
|
||||
</li>
|
||||
<!-- Help -->
|
||||
<li class="dropdown">
|
||||
<a class="dropdown-toggle waves" data-toggle="dropdown" href="#" id="help-menu-button">
|
||||
<span class="title">HELP</span>
|
||||
<span class="caret"/>
|
||||
</a>
|
||||
<ul class="dropdown-menu" id="help-menu" role="menu">
|
||||
<li class="dropdown-header">HELP & TUTORIALS</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul> <!-- / #oe_systray -->
|
||||
<!-- Help -->
|
||||
<li class="dropdown">
|
||||
<a class="dropdown-toggle waves" data-toggle="dropdown" href="#" id="help-menu-button">Help</a>
|
||||
<ul class="dropdown-menu" id="help-menu" role="menu">
|
||||
<li class="dropdown-header">HELP & TUTORIALS</li>
|
||||
</ul>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<ul id="oe_editzone" class="right" groups="base.group_website_publisher">
|
||||
<li groups="base.group_website_designer">
|
||||
<button data-action="new_page" class="btn primary full" href="#" data-toggle="modal" data-target="#website_addPage_modal">
|
||||
<i class="material-icons"></i>NEW PAGE</button>
|
||||
</li>
|
||||
<li t-if="not translatable">
|
||||
<button class="btn full accent" data-action="edit" type="button">
|
||||
<i class="material-icons"></i>EDIT PAGE</button>
|
||||
</li>
|
||||
<li t-if="translatable">
|
||||
<button class="btn full accent btn-xs" data-action="translate" type="button">TRANSLATE</button>
|
||||
</li>
|
||||
<li t-if="translatable">
|
||||
<a class="btn btn-link" data-action="edit_master" href="#">or Edit Master</a>
|
||||
</li>
|
||||
</ul> <!-- / #oe_editzone -->
|
||||
|
||||
</nav> <!-- / #website_main_menu_navbar -->
|
||||
</div>
|
||||
</t>
|
||||
</xpath>
|
||||
|
||||
<!-- Add new page/content modal -->
|
||||
<xpath expr="//body/div['id=wrawrap']" position="after">
|
||||
<div class="modal" id="website_addPage_modal">
|
||||
<div class="modal-dialog" data-dismiss="modal">
|
||||
<ul class="website_addPage_ul"></ul>
|
||||
</div>
|
||||
</div>
|
||||
</xpath>
|
||||
<ul class="o_menu_systray">
|
||||
<!-- Mobile preview -->
|
||||
<li class="o_mobile_preview hidden-xs">
|
||||
<a data-action="show-mobile-preview" href="#"><span title="Mobile preview" class="fa fa-mobile"/></a>
|
||||
</li>
|
||||
<!-- Page Edition -->
|
||||
<li groups="base.group_website_publisher,base.group_website_designer">
|
||||
<a data-action="new_page" href="#" data-toggle="modal" data-target="#o_website_add_page_modal"><span class="fa fa-plus"/> NEW PAGE</a>
|
||||
</li>
|
||||
<li t-if="not translatable" groups="base.group_website_publisher">
|
||||
<a data-action="edit" href="#"><span class="fa fa-pencil"/> EDIT PAGE</a>
|
||||
</li>
|
||||
<li t-if="translatable" groups="base.group_website_publisher">
|
||||
<a data-action="translate" href="#">TRANSLATE</a>
|
||||
</li>
|
||||
<li t-if="translatable" groups="base.group_website_publisher">
|
||||
<a data-action="edit_master" href="#">or Edit Master</a>
|
||||
</li>
|
||||
</ul>
|
||||
</nav>
|
||||
</xpath>
|
||||
|
||||
<!-- Add new page/content modal -->
|
||||
<xpath expr="//body/div['id=wrawrap']" position="after">
|
||||
<div class="modal" id="o_website_add_page_modal">
|
||||
<div class="modal-dialog modal-lg" data-dismiss="modal">
|
||||
<ul>
|
||||
<li groups="base.group_website_designer"><a href="#" data-action="new_page"><i class="fa fa-file-o"/><p>New Page</p></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</xpath>
|
||||
</template>
|
||||
</data>
|
||||
</openerp>
|
||||
</odoo>
|
||||
|
||||
@@ -458,8 +458,8 @@
|
||||
|
||||
<!-- User Navbar -->
|
||||
<template id="content_new_blogpost" inherit_id="website.user_navbar" groups="base.group_website_designer">
|
||||
<xpath expr="//ul[@id='oe_systray']/li/ul[@class='dropdown-menu oe_content_menu']" position="inside">
|
||||
<li><a href="#" data-action="new_blog_post">New Blog Post</a></li>
|
||||
<xpath expr="//div[@id='o_website_add_page_modal']//ul" position="inside">
|
||||
<li><a href="#" data-action="new_blog_post"><i class="fa fa-rss"/><p>New Blog Post</p></a></li>
|
||||
</xpath>
|
||||
</template>
|
||||
|
||||
|
||||
@@ -623,8 +623,8 @@
|
||||
|
||||
<!-- User Navbar -->
|
||||
<template id="content_new_event" inherit_id="website.user_navbar" groups="event.group_event_manager">
|
||||
<xpath expr="//ul[@id='oe_systray']/li/ul[@class='dropdown-menu oe_content_menu']" position="inside">
|
||||
<li><a href="#" data-action="new_event">New Event</a></li>
|
||||
<xpath expr="//div[@id='o_website_add_page_modal']//ul" position="inside">
|
||||
<li><a href="#" data-action="new_event"><i class="fa fa-glass"/><p>New Event</p></a></li>
|
||||
</xpath>
|
||||
</template>
|
||||
</data>
|
||||
|
||||
@@ -1537,8 +1537,8 @@
|
||||
|
||||
<!-- User Navbar -->
|
||||
<template id="content_new_forum" inherit_id="website.user_navbar" groups="base.group_user">
|
||||
<xpath expr="//ul[@id='oe_systray']/li/ul[@class='dropdown-menu oe_content_menu']" position="inside">
|
||||
<li><a href="#" data-action="new_forum">New Forum</a></li>
|
||||
<xpath expr="//div[@id='o_website_add_page_modal']//ul" position="inside">
|
||||
<li><a href="#" data-action="new_forum"><i class="fa fa-comment"/><p>New Forum</p></a></li>
|
||||
</xpath>
|
||||
</template>
|
||||
|
||||
|
||||
@@ -294,8 +294,8 @@
|
||||
|
||||
<!-- User Navbar -->
|
||||
<template id="content_new_job_offer" inherit_id="website.user_navbar" groups="base.group_hr_manager">
|
||||
<xpath expr="//ul[@id='oe_systray']/li/ul[@class='dropdown-menu oe_content_menu']" position="inside">
|
||||
<li><a href="/jobs/add" class="js_link2post">New Job Offer</a></li>
|
||||
<xpath expr="//div[@id='o_website_add_page_modal']//ul" position="inside">
|
||||
<li><a href="/jobs/add" class="js_link2post"><i class="fa fa-briefcase"/><p>New Job Offer</p></a></li>
|
||||
</xpath>
|
||||
</template>
|
||||
|
||||
|
||||
@@ -1471,8 +1471,8 @@
|
||||
|
||||
<!-- User Navbar -->
|
||||
<template id="content_new_product" inherit_id="website.user_navbar" groups="base.group_sale_manager">
|
||||
<xpath expr="//ul[@id='oe_systray']/li/ul[@class='dropdown-menu oe_content_menu']" position="inside">
|
||||
<li><a id="create-new-product" href="#" data-action="new_product">New Product</a></li>
|
||||
<xpath expr="//div[@id='o_website_add_page_modal']//ul" position="inside">
|
||||
<li><a id="create-new-product" href="#" data-action="new_product"><i class="fa fa-shopping-cart"/><p>New Product</p></a></li>
|
||||
</xpath>
|
||||
</template>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user