[IMP] website, *: review existing navbar templates and templates system

*: portal, website_sale, website_sale_wishlist

Portal-without-website header is now more basic, without the need of
a collapsed element. It is then entirely replaced when website is
installed with header templates, t-calling all the main parts.

Part of https://github.com/odoo/odoo/pull/56427
task-2264627

X-original-commit: d3d5983e0a76eb6500e0d3f78f128879b50390e0
Co-authored-by: qsm-odoo <qsm@odoo.com>
This commit is contained in:
Cocographique
2020-08-28 08:19:39 +00:00
committed by Xavier-Do
co-authored by qsm-odoo
parent 0029236566
commit 2a1aa808e9
11 changed files with 473 additions and 139 deletions
+14 -19
View File
@@ -6,28 +6,23 @@
<attribute name="t-attf-class" add="#{'o_portal' if is_portal else ''}" separator=" "/>
</xpath>
<xpath expr="//div[@id='wrapwrap']/header/img" position="replace">
<nav class="navbar navbar-expand-md navbar-light bg-light">
<div id="top_menu_container" class="container">
<nav class="navbar navbar-expand navbar-light bg-light">
<div class="container">
<a href="/" class="navbar-brand logo">
<img t-att-src="'/logo.png?company=%s' % res_company.id" t-att-alt="'Logo of %s' % res_company.name" t-att-title="res_company.name"/>
</a>
<button type="button" class="navbar-toggler" data-toggle="collapse" data-target="#top_menu_collapse">
<span class="navbar-toggler-icon o_not_editable"/>
</button>
<div class="collapse navbar-collapse" id="top_menu_collapse">
<ul class="nav navbar-nav ml-auto text-right" id="top_menu">
<t t-call="portal.placeholder_user_sign_in">
<t t-set="_item_class" t-value="'nav-item'"/>
<t t-set="_link_class" t-value="'nav-link'"/>
</t>
<t t-call="portal.user_dropdown">
<t t-set="_user_name" t-value="true"/>
<t t-set="_item_class" t-value="'nav-item dropdown'"/>
<t t-set="_link_class" t-value="'nav-link'"/>
<t t-set="_dropdown_menu_class" t-value="'dropdown-menu-right'"/>
</t>
</ul>
</div>
<ul id="top_menu" class="nav navbar-nav ml-auto">
<t t-call="portal.placeholder_user_sign_in">
<t t-set="_item_class" t-value="'nav-item'"/>
<t t-set="_link_class" t-value="'nav-link'"/>
</t>
<t t-call="portal.user_dropdown">
<t t-set="_user_name" t-value="true"/>
<t t-set="_item_class" t-value="'nav-item dropdown'"/>
<t t-set="_link_class" t-value="'nav-link'"/>
<t t-set="_dropdown_menu_class" t-value="'dropdown-menu-right'"/>
</t>
</ul>
</div>
</nav>
</xpath>
@@ -87,7 +87,7 @@ tour.register('test_reset_page_view_complete_flow_part2', {
content: "select oe_structure view",
trigger: '#s2id_ace-view-list', // use select2 version
run: function () {
var viewId = $('#ace-view-list option:contains("oe_structure")').val();
var viewId = $('#ace-view-list option:contains("oe_structure_test_website_page")').val();
$('#ace-view-list').val(viewId).trigger('change');
},
},
+1 -1
View File
@@ -183,9 +183,9 @@ class Theme(models.AbstractModel):
self.disable_view('website.option_ripple_effect')
# Reinitialize header templates
self.enable_view('website.template_header_default')
self.disable_view('website.template_header_hamburger')
self.disable_view('website.template_header_vertical')
self.disable_view('website.option_header_hamburger_center_logo')
# Reinitialize footer templates
self.enable_view('website.footer_custom')
@@ -1767,14 +1767,6 @@ options.registry.collapse = options.Class.extend({
});
options.registry.Header = options.Class.extend({
/**
* @override
*/
async updateUI() {
await this._super(...arguments);
const isHamburger = this.$('.navbar-toggler').is(':visible');
this.$el.find('#hamburger_opt_label').toggleClass('d-none', isHamburger);
},
//--------------------------------------------------------------------------
// Private
@@ -1793,6 +1785,28 @@ options.registry.Header = options.Class.extend({
}
return this._super(...arguments);
},
/**
* @override
*/
async _renderOriginalXML($xml) {
const uiFragment = await this._super(...arguments);
const widgets = this._requestUserValueWidgets('header_alignment_opt', 'header_hamburger_type_opt');
for (const widget of widgets) {
const titleEl = widget.el.querySelector('we-title');
const spanEl1 = document.createElement('span');
spanEl1.textContent = " (+ ";
titleEl.appendChild(spanEl1);
const iconEl = document.createElement('i');
iconEl.classList.add('fa', 'fa-mobile');
titleEl.appendChild(iconEl);
const spanEl2 = document.createElement('span');
spanEl2.textContent = ")";
titleEl.appendChild(spanEl2);
}
return uiFragment;
},
});
const VisibilityPageOptionUpdate = options.Class.extend({
@@ -265,7 +265,7 @@ $o-base-website-values-palette: (
'header-links-style': 'default', // 'default' / 'fill' / 'outline' / 'pills' / 'block' / 'border-bottom'
'logo-height': null, // Default to navbar height (see portal)
'hamburger-type': 'default', // 'default' / 'off-canvas'
'hamburger-position': 'right', // 'right' / 'left' / 'center'
'hamburger-position': 'left', // 'left' / 'center' / 'right'
'footer-template': 'default',
'footer-effect': null, // null / 'slideout_slide_hover' / 'slideout_shadow'
+28 -22
View File
@@ -700,13 +700,16 @@ $-transition-duration: 200ms;
}
}
@if o-website-value('header-template') == 'vertical' {
@include media-breakpoint-up(md) {
.o_header_centered_logo {
display: none;
}
@include media-breakpoint-up(lg) {
.navbar-brand {
font-size: 0px;
font-size: 0;
opacity: 0;
img {
height: 0px;
height: 0;
}
}
}
@@ -779,34 +782,20 @@ header {
&:not(.o_header_is_scrolled) {
$-is-hamburger: o-website-value('header-template') == 'hamburger';
$-is-vertical: o-website-value('header-template') == 'vertical';
@include media-breakpoint-up(md) {
@if $-is-hamburger or $-is-vertical {
@if $-is-hamburger {
#top_menu_container {
padding-top: $spacer * 0.5;
padding-bottom: $spacer * 0.5;
}
}
@if $-is-vertical {
.navbar-brand {
margin-bottom: $spacer;
}
}
}
}
.navbar {
flex-direction: if($-hamburger-left, row-reverse, row);
}
#top_menu_container {
flex-direction: inherit;
}
@if $-hamburger-right {
.navbar-brand {
margin-right: 0;
margin-left: $navbar-padding-x;
}
} @else if $-hamburger-center {
@if $-hamburger-center {
.collapsing, .show {
#top_menu {
@if not $-off-canvas-hamburger {
@@ -848,6 +837,7 @@ header {
}
#top_menu {
flex: 0 0 auto !important;
overflow: auto;
flex-wrap: nowrap;
@if $-hamburger-center {
@@ -856,6 +846,8 @@ header {
} @else {
max-width: 560px;
}
min-width: 250px;
margin: 0 !important;
background-color: o-color('menu');
transition: transform $-transition-duration cubic-bezier(.694, .0482, .335, 1);
@@ -903,11 +895,11 @@ header {
}
}
&.collapsing #top_menu {
@if o-website-value('hamburger-position') == 'center' {
@if $-hamburger-center {
transform: translateY(-100%);
} @else if o-website-value('hamburger-position') == 'left' {
} @else if $-hamburger-left {
transform: translateX(-100%);
} @else if o-website-value('hamburger-position') == 'right' {
} @else if $-hamburger-right {
transform: translateX(100%);
}
}
@@ -925,6 +917,20 @@ header {
}
}
@if o-website-value('header-template') == 'vertical' {
header .o_header_centered_logo {
order: -1;
width: 50%;
margin-top: $spacer;
@include media-breakpoint-up(lg) {
order: inherit;
width: 40%;
margin-bottom: $spacer;
}
}
}
// Mega menu
.o_mega_menu {
width: 100%;
@@ -46,7 +46,7 @@ tour.register('html_editor_multiple_templates', {
content: "select oe_structure specific view",
trigger: 'div.ace_line .ace_xml:contains("somenewcontent")',
run: function () {
var viewId = $('#ace-view-list option:contains("oe_structure")').val();
var viewId = $('#ace-view-list option:contains("oe_structure_test_ui")').val();
$('#ace-view-list').val(viewId).trigger('change');
},
},
+21 -17
View File
@@ -563,8 +563,8 @@
<we-select string="Template" data-variable="header-template" data-reload="/">
<we-button title="Default"
data-name="header_logo_menu_opt"
data-customize-website-views=""
data-name="header_default_opt"
data-customize-website-views="website.template_header_default"
data-customize-website-variable="'default'"
data-img="/website/static/src/img/snippets_options/header_template_default.png"/>
<we-button title="Hamburger menu"
@@ -579,29 +579,33 @@
data-img="/website/static/src/img/snippets_options/header_template_vertical.png"/>
</we-select>
<we-title id="hamburger_opt_label">Hamburger (Mobile)</we-title>
<we-select string="⌙ Type" data-variable="hamburger-type" data-reload="/">
<!-- Generic alignment option controling all the template at once. -->
<!-- Currently needed to be this way as the SCSS variable controls -->
<!-- the mobile alignement which is the same for all templates. -->
<we-select string="⌙ Alignment"
data-name="header_alignment_opt"
data-variable="hamburger-position"
data-reload="/">
<we-button data-customize-website-views="" data-customize-website-variable="'left'">Left</we-button>
<we-button data-customize-website-views="website.template_header_default_align_center, website.template_header_hamburger_align_center" data-customize-website-variable="'center'">Center</we-button>
<we-button data-customize-website-views="website.template_header_default_align_right, website.template_header_hamburger_align_right" data-customize-website-variable="'right'">Right</we-button>
</we-select>
<!-- Generic Hamburger Options (mobile or not) -->
<we-select string="⌙ Hamburger Type"
data-name="header_hamburger_type_opt"
data-variable="hamburger-type"
data-reload="/">
<we-button data-customize-website-variable="'default'"
data-customize-website-views="">Default</we-button>
<we-button data-name="off_canvas_menu_opt"
data-customize-website-variable="'off-canvas'"
data-customize-website-views="website.option_header_off_canvas">Off-Canvas</we-button>
data-customize-website-views="website.option_header_off_canvas, website.option_header_off_canvas_template_header_hamburger">Off-Canvas</we-button>
</we-select>
<we-select string="⌙ Position" data-variable="hamburger-position" data-reload="/">
<we-button data-customize-website-variable="'right'">Right</we-button>
<we-button data-customize-website-variable="'left'">Left</we-button>
<we-button data-customize-website-variable="'center'">Center / Full</we-button>
</we-select>
<we-select string="⌙ Logo" data-dependencies="off_canvas_menu_opt" data-reload="/">
<we-select string=" ⌙ Logo" data-dependencies="off_canvas_menu_opt" data-reload="/">
<we-button data-customize-website-views="">Text</we-button>
<we-button data-customize-website-views="website.option_header_off_canvas_logo_show">Image</we-button>
</we-select>
<we-checkbox string="Center Main Logo"
data-dependencies="header_hamburger_opt"
data-apply-to=".navbar-brand"
data-customize-website-views="website.option_header_hamburger_center_logo"
data-select-class="mx-md-auto"
data-no-preview="true"/>
<we-select id="header_visibilities_list" string="Header Visibility">
<we-button id="option_header_visibility_standard"
+324 -47
View File
@@ -124,27 +124,6 @@
<xpath expr="//header" position="attributes">
<attribute name="data-name">Header</attribute>
</xpath>
<xpath expr="//header/nav" position="attributes">
<!-- Background now controlled by css configuration, using color combinations -->
<attribute name="class" add="o_colored_level o_cc" remove="bg-light" separator=" "/>
</xpath>
<xpath expr="//header//a[hasclass('navbar-brand')]" position="replace">
<t t-call="website.placeholder_header_brand"/>
</xpath>
<xpath expr="//header//div[@id='top_menu_collapse']" position="attributes">
<attribute name="class" separator=" " add="flex-grow-0"/>
</xpath>
<xpath expr="//header//ul[@id='top_menu']" position="attributes">
<attribute name="class" separator=" " add="o_menu_loading" remove="text-right ml-auto"/>
</xpath>
<xpath expr="//header//ul[@id='top_menu']/t[@t-call='portal.placeholder_user_sign_in']" position="before">
<t t-foreach="website.menu_id.child_id" t-as="submenu">
<t t-call="website.submenu">
<t t-set="item_class" t-value="'nav-item'"/>
<t t-set="link_class" t-value="'nav-link'"/>
</t>
</t>
</xpath>
<xpath expr="//footer" position="attributes">
<attribute name="data-name">Footer</attribute>
@@ -225,41 +204,340 @@
</xpath>
</template>
<!-- Navbar -->
<template id="navbar_toggler" name="Navbar Toggler">
<button type="button" t-attf-class="navbar-toggler #{_toggler_class}" data-toggle="collapse" data-target="#top_menu_collapse">
<span class="navbar-toggler-icon o_not_editable"/>
</button>
</template>
<!-- Navbar Nav -->
<template id="navbar_nav" name="Navbar Nav">
<ul id="top_menu" t-attf-class="nav navbar-nav o_menu_loading #{_nav_class}">
<t t-raw="0"/>
</ul>
</template>
<!-- Header templates -->
<template id="template_header_hamburger" inherit_id="website.layout" name="Template Header Hamburger" active="False">
<xpath expr="//header//nav[hasclass('navbar')]" position="attributes">
<attribute name="class" remove="navbar-expand-md" separator=" "/>
</xpath>
<xpath expr="//header//button[hasclass('navbar-toggler')]" position="replace">
<div class="o_navbar_toggler_container">$0</div>
</xpath>
<xpath expr="//header//ul[@id='top_menu']" position="attributes">
<attribute name="class" separator=" " remove="text-right"/>
<!-- "Default" template -->
<template id="template_header_default" inherit_id="website.layout" name="Template Header Default" active="True">
<xpath expr="//header//nav" position="replace">
<nav class="navbar navbar-expand-lg navbar-light o_colored_level o_cc shadow-sm">
<div id="top_menu_container" class="container justify-content-start justify-content-lg-between">
<!-- Brand -->
<t t-call="website.placeholder_header_brand">
<t t-set="_link_class" t-value="'mr-4'"/>
</t>
<!-- Navbar Toggler -->
<t t-call="website.navbar_toggler">
<t t-set="_toggler_class" t-value="'ml-auto'"/>
</t>
<!-- Navbar Collapse -->
<div id="top_menu_collapse" class="collapse navbar-collapse order-last order-lg-0">
<t t-call="website.navbar_nav">
<t t-set="_nav_class" t-value="'flex-grow-1'"/>
<!-- Menu -->
<t t-foreach="website.menu_id.child_id" t-as="submenu">
<t t-call="website.submenu">
<t t-set="item_class" t-value="'nav-item'"/>
<t t-set="link_class" t-value="'nav-link'"/>
</t>
</t>
<!-- Sign In -->
<t t-call="portal.placeholder_user_sign_in">
<t t-set="_item_class" t-value="'nav-item ml-lg-auto'"/>
<t t-set="_link_class" t-value="'nav-link font-weight-bold'"/>
</t>
<!-- User Dropdown -->
<t t-call="portal.user_dropdown">
<t t-set="_user_name" t-value="true"/>
<t t-set="_item_class" t-value="'nav-item dropdown ml-lg-auto'"/>
<t t-set="_link_class" t-value="'nav-link font-weight-bold'"/>
</t>
</t>
</div>
<!-- Button -->
<div class="oe_structure" id="oe_structure_header_default_1"/>
</div>
</nav>
</xpath>
</template>
<template id="template_header_default_oe_structure_header_default_1" inherit_id="website.template_header_default" name="Template Header Default (oe_structure_header_default_1)">
<xpath expr="//*[hasclass('oe_structure')][@id='oe_structure_header_default_1']" position="replace">
<div class="oe_structure" id="oe_structure_header_default_1">
<section class="s_text_block" data-snippet="s_text_block" data-name="Text">
<div class="container">
<a href="#" class="btn btn-primary ml-4">Button</a>
</div>
</section>
</div>
</xpath>
</template>
<template id="template_header_default_align_center" inherit_id="website.template_header_default" active="False">
<xpath expr="//t[@t-set='_nav_class']" position="replace">
<t t-set="_nav_class" t-value="'mx-auto'"/>
</xpath>
</template>
<template id="template_header_default_align_right" inherit_id="website.template_header_default" active="False">
<xpath expr="//t[@t-set='_nav_class']" position="replace">
<t t-set="_nav_class" t-value="'ml-auto'"/>
</xpath>
</template>
<!-- "Hamburger" template -->
<template id="template_header_hamburger" inherit_id="website.layout" name="Template Header Hamburger" active="False">
<xpath expr="//header//nav" position="replace">
<nav class="navbar navbar-light o_colored_level o_cc">
<div id="top_menu_container" class="container">
<!-- Brand -->
<t t-call="website.placeholder_header_brand">
<t t-set="_link_class" t-value="'mr-auto'"/>
</t>
<ul class="nav navbar-nav navbar-expand">
<!-- Sign In -->
<t t-call="portal.placeholder_user_sign_in">
<t t-set="_item_class" t-value="'nav-item'"/>
<t t-set="_link_class" t-value="'nav-link'"/>
</t>
<!-- User Dropdown -->
<t t-call="portal.user_dropdown">
<t t-set="_icon" t-value="true"/>
<t t-set="_item_class" t-value="'nav-item dropdown'"/>
<t t-set="_link_class" t-value="'nav-link'"/>
<t t-set="_dropdown_menu_class" t-value="'position-absolute dropdown-menu-right'"/>
</t>
</ul>
<!-- Navbar Toggler -->
<t t-call="website.navbar_toggler">
<t t-set="_toggler_class" t-value="'order-first mr-auto'"/>
</t>
<!-- Button -->
<div class="oe_structure" id="oe_structure_header_hamburger_1"/>
<!-- Navbar Collapse -->
<div id="top_menu_collapse" class="collapse navbar-collapse">
<div class="oe_structure" id="oe_structure_header_hamburger_2"/>
<t t-call="website.navbar_nav">
<!-- Menu -->
<t t-foreach="website.menu_id.child_id" t-as="submenu">
<t t-call="website.submenu">
<t t-set="item_class" t-value="'nav-item'"/>
<t t-set="link_class" t-value="'nav-link'"/>
</t>
</t>
</t>
<div class="oe_structure" id="oe_structure_header_hamburger_3"/>
</div>
</div>
</nav>
</xpath>
</template>
<template id="template_header_hamburger_oe_structure_header_hamburger_1" inherit_id="website.template_header_hamburger" name="Template Header Hamburger (oe_structure_header_hamburger_1)">
<xpath expr="//*[hasclass('oe_structure')][@id='oe_structure_header_hamburger_1']" position="replace">
<div class="oe_structure" id="oe_structure_header_hamburger_1">
<section class="s_text_block" data-snippet="s_text_block" data-name="Text">
<div class="container">
<a href="#" class="btn btn-primary ml-4">Button</a>
</div>
</section>
</div>
</xpath>
</template>
<template id="template_header_hamburger_oe_structure_header_hamburger_2" inherit_id="website.template_header_hamburger" name="Template Header Hamburger (oe_structure_header_hamburger_2)">
<xpath expr="//*[hasclass('oe_structure')][@id='oe_structure_header_hamburger_2']" position="replace">
<div class="oe_structure" id="oe_structure_header_hamburger_2">
<section class="s_text_block" data-snippet="s_text_block" data-name="Text">
<div class="container">
<div class="s_hr text-left pt16 pb16" data-name="Separator">
<hr class="w-100 mx-auto" style="border-top-width: 1px; border-top-style: solid; border-color: var(--300);"/>
</div>
</div>
</section>
</div>
</xpath>
</template>
<template id="template_header_hamburger_oe_structure_header_hamburger_3" inherit_id="website.template_header_hamburger" name="Template Header Hamburger (oe_structure_header_hamburger_3)">
<xpath expr="//*[hasclass('oe_structure')][@id='oe_structure_header_hamburger_3']" position="replace">
<div class="oe_structure" id="oe_structure_header_hamburger_3">
<section class="s_text_block" data-snippet="s_text_block" data-name="Text">
<div class="container">
<div class="row align-items-center">
<!-- Separator -->
<div class="col-lg-12">
<div class="s_hr text-left pt16 pb16" data-name="Separator">
<hr class="w-100 mx-auto" style="border-top-width: 1px; border-top-style: solid; border-color: var(--300);"/>
</div>
</div>
<!-- Social -->
<div class="col-lg-6 pb16">
<div class="s_share text-left no_icon_color" data-name="Social Media">
<h4 class="s_share_title d-none">Follow us</h4>
<a href="/website/social/facebook" class="s_share_facebook" target="_blank">
<i class="fa fa-1x fa-fw fa-facebook"/>
</a>
<a href="/website/social/twitter" class="s_share_twitter" target="_blank">
<i class="fa fa-1x fa-fw fa-twitter"/>
</a>
<a href="/website/social/linkedin" class="s_share_linkedin" target="_blank">
<i class="fa fa-1x fa-fw fa-linkedin"/>
</a>
<a href="/website/social/instagram" class="s_share_instagram" target="_blank">
<i class="fa fa-1x fa-fw fa-instagram"/>
</a>
</div>
</div>
<!-- Contact -->
<div class="col-lg-4 text-lg-right pb16">
<i class="fa fa-1x fa-fw fa-envelope mr-2"/><span><a href="mailto:info@yourcompany.example.com">info@yourcompany.example.com</a></span>
</div>
<div class="col-lg-2 text-lg-right pb16">
<i class="fa fa-1x fa-fw fa-phone mr-2"/><span class="o_force_ltr"><a href="tel:1 (650) 691-3277">1 (650) 691-3277</a></span>
</div>
</div>
</div>
</section>
</div>
</xpath>
</template>
<template id="template_header_hamburger_align_center" inherit_id="website.template_header_hamburger" active="False">
<xpath expr="//t[@t-set='_toggler_class']" position="replace">
<t t-set="_toggler_class" t-value="'ml-4 mr-auto'"/>
</xpath>
</template>
<template id="template_header_hamburger_align_right" inherit_id="website.template_header_hamburger" active="False">
<xpath expr="//t[@t-set='_toggler_class']" position="replace">
<t t-set="_toggler_class" t-value="'ml-4'"/>
</xpath>
</template>
<!-- "Vertical" template -->
<template id="template_header_vertical" inherit_id="website.layout" name="Template Header Vertical" active="False">
<xpath expr="//header//nav[hasclass('navbar')]" position="attributes">
<attribute name="class" add="flex-md-column" separator=" "/>
<xpath expr="//header//nav" position="replace">
<nav class="navbar navbar-expand-lg navbar-light flex-lg-column o_colored_level o_cc shadow-sm py-0">
<div id="top_menu_container" class="container align-items-center flex-row flex-wrap">
<!-- Left -->
<div class="o_header_centered_logo">
<div class="oe_structure" id="oe_structure_header_vertical_1"/>
</div>
<!-- Brand -->
<t t-call="website.placeholder_header_brand">
<t t-set="_link_class" t-value="'m-0'"/>
</t>
<!-- Right -->
<div class="o_header_centered_logo text-right">
<div class="oe_structure" id="oe_structure_header_vertical_2"/>
</div>
<!-- Navbar Toggler -->
<t t-call="website.navbar_toggler">
<t t-set="_toggler_class" t-value="'my-3'"/>
</t>
<!-- Navbar Collapse -->
<div id="top_menu_collapse" class="collapse navbar-collapse flex-wrap">
<div class="oe_structure w-100" id="oe_structure_header_vertical_3"/>
<!-- Nav -->
<t t-call="website.navbar_nav">
<t t-set="_nav_class" t-value="'mx-auto mb-3 mb-lg-0'"/>
<!-- Menu -->
<t t-foreach="website.menu_id.child_id" t-as="submenu">
<t t-call="website.submenu">
<t t-set="item_class" t-value="'nav-item'"/>
<t t-set="link_class" t-value="'nav-link'"/>
</t>
</t>
<!-- Sign In -->
<t t-call="portal.placeholder_user_sign_in">
<t t-set="_item_class" t-value="'nav-item ml-lg-3'"/>
<t t-set="_link_class" t-value="'nav-link'"/>
</t>
<!-- User Dropdown -->
<t t-call="portal.user_dropdown">
<t t-set="_user_name" t-value="True"/>
<t t-set="_item_class" t-value="'nav-item dropdown ml-lg-3'"/>
<t t-set="_link_class" t-value="'nav-link font-weight-bold'"/>
</t>
</t>
</div>
</div>
</nav>
</xpath>
</template>
<template id="template_header_vertical_oe_structure_header_vertical_1" inherit_id="website.template_header_vertical" name="Template Header Vertical (oe_structure_header_vertical_1)">
<xpath expr="//*[hasclass('oe_structure')][@id='oe_structure_header_vertical_1']" position="replace">
<div class="oe_structure" id="oe_structure_header_vertical_1">
<section class="s_text_block" data-snippet="s_text_block" data-name="Text">
<div class="container">
<div class="s_share no_icon_color" data-name="Social Media">
<h6 class="s_share_title d-none">Follow us</h6>
<a href="/website/social/facebook" class="s_share_facebook" target="_blank">
<i class="fa fa-1x fa-fw fa-facebook"/>
</a>
<a href="/website/social/twitter" class="s_share_twitter" target="_blank">
<i class="fa fa-1x fa-fw fa-twitter"/>
</a>
<a href="/website/social/linkedin" class="s_share_linkedin" target="_blank">
<i class="fa fa-1x fa-fw fa-linkedin"/>
</a>
<a href="/website/social/instagram" class="s_share_instagram" target="_blank">
<i class="fa fa-1x fa-fw fa-instagram"/>
</a>
</div>
</div>
</section>
</div>
</xpath>
</template>
<template id="template_header_vertical_oe_structure_header_vertical_2" inherit_id="website.template_header_vertical" name="Template Header Vertical (oe_structure_header_vertical_2)">
<xpath expr="//*[hasclass('oe_structure')][@id='oe_structure_header_vertical_2']" position="replace">
<div class="oe_structure" id="oe_structure_header_vertical_2">
<section class="s_text_block" data-snippet="s_text_block" data-name="Text">
<div class="container">
<small><i class="fa fa-1x fa-fw fa-phone mr-2"/><a href="tel:1 (650) 691-3277">1 (650) 691-3277</a></small>
</div>
</section>
</div>
</xpath>
</template>
<template id="template_header_vertical_oe_structure_header_vertical_3" inherit_id="website.template_header_vertical" name="Template Header Vertical (oe_structure_header_vertical_3)">
<xpath expr="//*[hasclass('oe_structure')][@id='oe_structure_header_vertical_3']" position="replace">
<div class="oe_structure w-100" id="oe_structure_header_vertical_3">
<section class="s_text_block" data-snippet="s_text_block" data-name="Text">
<div class="container">
<div class="s_hr w-100 text-left pt0 pb0" data-name="Separator">
<hr class="w-100 mx-auto" style="border-top-width: 1px; border-top-style: solid; border-color: var(--300);"/>
</div>
</div>
</section>
</div>
</xpath>
</template>
<!-- Navbar Hamburger Options -->
<template id="option_header_off_canvas" inherit_id="website.layout" name="Off-Canvas Header" active="False">
<xpath expr="//header//ul[@id='top_menu']" position="attributes">
<template id="option_header_off_canvas" inherit_id="website.navbar_nav" name="Off-Canvas Header" active="False">
<xpath expr="//ul[@id='top_menu']" position="attributes">
<attribute name="class" separator=" " add="position-relative"/>
</xpath>
<xpath expr="//header//ul[@id='top_menu']" position="before">
<xpath expr="//ul[@id='top_menu']" position="before">
<div class="o_offcanvas_menu_backdrop" data-toggle="collapse" data-target="#top_menu_collapse" aria-label="Toggle navigation"/>
</xpath>
<xpath expr="//header//ul[@id='top_menu']/t[@t-foreach='website.menu_id.child_id']" position="before">
<xpath expr="//ul[@id='top_menu']/t" position="before">
<li class="o_offcanvas_menu_toggler order-first navbar-toggler text-right border-0">
<a href="#top_menu_collapse" class="nav-link px-3" data-toggle="collapse">
<span class="fa-2x">&#215;</span>
</a>
</li>
</xpath>
<xpath expr="//header//ul[@id='top_menu']/t[@t-foreach='website.menu_id.child_id']" position="after">
<xpath expr="//ul[@id='top_menu']/t" position="after">
<li class="o_offcanvas_logo_container order-last navbar-toggler py-4 order-1 mt-auto text-center border-0">
<a href="/" class="o_offcanvas_logo text-center">My Website</a>
</li>
@@ -267,13 +545,18 @@
</template>
<template id="option_header_off_canvas_logo_show" inherit_id="website.option_header_off_canvas" name="Show Logo (Off-Canvas)">
<xpath expr="//header//a[hasclass('o_offcanvas_logo')]" position="replace">
<xpath expr="//a[hasclass('o_offcanvas_logo')]" position="replace">
<a href="/" class="o_offcanvas_logo logo">
<span t-field="website.logo" t-options="{'widget': 'image', 'style': 'max-width: 200px'}" role="img" t-att-aria-label="'Logo of %s' % website.name" t-att-title="website.name" />
</a>
</xpath>
</template>
<template id="option_header_off_canvas_template_header_hamburger" inherit_id="website.template_header_hamburger" active="False" priority="32">
<xpath expr="//div[@id='oe_structure_header_hamburger_2']" position="replace"/>
<xpath expr="//div[@id='oe_structure_header_hamburger_3']" position="replace"/>
</template>
<!-- Header options -->
<template id="option_layout_hide_header" inherit_id="website.layout" active="False">
<xpath expr="//header" position="before">
@@ -281,12 +564,6 @@
</xpath>
</template>
<template id="option_header_hamburger_center_logo" inherit_id="website.template_header_hamburger" name="Template Header Hamburger Center Logo" active="False">
<xpath expr="//header//a[hasclass('navbar-brand')]" position="attributes">
<attribute name="class" separator=" " add="mx-md-auto"/>
</xpath>
</template>
<template id="placeholder_header_brand" name="Placeholder Header Brand">
<span id="o_fake_navbar_brand"/><!-- Need a fake element so that the menu is still placed correctly -->
</template>
@@ -335,9 +612,9 @@
</xpath>
</template>
<template id="header_navbar_pills_style" inherit_id="website.layout" name="Navbar Links Style" active="False">
<xpath expr="//ul[hasclass('navbar-nav')]" position="attributes">
<attribute name="class" add="nav-pills" separator=" "/>
<template id="header_navbar_pills_style" inherit_id="website.navbar_nav" name="Navbar Links Style" active="False">
<xpath expr="//ul[@id='top_menu']" position="attributes">
<attribute name="t-attf-class" add="nav-pills" separator=" "/>
</xpath>
</template>
+30 -11
View File
@@ -73,17 +73,6 @@
</xpath>
</template>
<template id="layout" inherit_id="website.layout">
<xpath expr="//header//ul[@id='top_menu']/t[@t-foreach='website.menu_id.child_id']" position="after">
<t t-call="website_sale.header_cart_link">
<t t-set="_icon" t-value="True"/>
<t t-set="_text" t-value="True"/>
<t t-set="_item_class" t-value="'nav-item'"/>
<t t-set="_link_class" t-value="'nav-link'"/>
</t>
</xpath>
</template>
<template id="header_cart_link" name="Header Cart Link">
<t t-set="website_sale_order" t-value="website.sale_get_order()" />
<t t-set="show_cart" t-value="true"/>
@@ -103,6 +92,36 @@
</xpath>
</template>
<template id="template_header_default" inherit_id="website.template_header_default">
<xpath expr="//t[@t-foreach='website.menu_id.child_id']" position="after">
<t t-call="website_sale.header_cart_link">
<t t-set="_icon" t-value="True"/>
<t t-set="_item_class" t-value="'nav-item mx-lg-3'"/>
<t t-set="_link_class" t-value="'nav-link'"/>
</t>
</xpath>
</template>
<template id="template_header_hamburger" inherit_id="website.template_header_hamburger">
<xpath expr="//t[@t-foreach='website.menu_id.child_id']" position="after">
<t t-call="website_sale.header_cart_link">
<t t-set="_text" t-value="True"/>
<t t-set="_item_class" t-value="'nav-item'"/>
<t t-set="_link_class" t-value="'nav-link'"/>
</t>
</xpath>
</template>
<template id="template_header_vertical" inherit_id="website.template_header_vertical">
<xpath expr="//t[@t-foreach='website.menu_id.child_id']" position="after">
<t t-call="website_sale.header_cart_link">
<t t-set="_icon" t-value="True"/>
<t t-set="_item_class" t-value="'nav-item ml-lg-3'"/>
<t t-set="_link_class" t-value="'nav-link'"/>
</t>
</xpath>
</template>
<!-- Products Search Bar input-group template -->
<template id="website_sale_products_search_box" inherit_id="website.website_search_box" primary="True">
<xpath expr="//input[@name='search']" position="attributes">
@@ -30,17 +30,6 @@
</xpath>
</template>
<template id="layout" inherit_id="website_sale.layout">
<xpath expr="//t[@t-call='website_sale.header_cart_link']" position="after">
<t t-call="website_sale_wishlist.header_wishlist_link">
<t t-set="_icon" t-value="True"/>
<t t-set="_text" t-value="True"/>
<t t-set="_item_class" t-value="'nav-item'"/>
<t t-set="_link_class" t-value="'nav-link'"/>
</t>
</xpath>
</template>
<template id="header_wishlist_link" name="Header Wishlist Link">
<t t-set="wishcount" t-value="len(request.env['product.wishlist'].current())"/>
<t t-set="show_wishes" t-value="True"/>
@@ -62,6 +51,36 @@
</xpath>
</template>
<template id="template_header_default" inherit_id="website_sale.template_header_default">
<xpath expr="//t[@t-call='website_sale.header_cart_link']" position="after">
<t t-call="website_sale_wishlist.header_wishlist_link">
<t t-set="_icon" t-value="True"/>
<t t-set="_item_class" t-value="'nav-item mr-lg-3'"/>
<t t-set="_link_class" t-value="'nav-link'"/>
</t>
</xpath>
</template>
<template id="template_header_hamburger" inherit_id="website_sale.template_header_hamburger">
<xpath expr="//t[@t-call='website_sale.header_cart_link']" position="after">
<t t-call="website_sale_wishlist.header_wishlist_link">
<t t-set="_text" t-value="True"/>
<t t-set="_item_class" t-value="'nav-item'"/>
<t t-set="_link_class" t-value="'nav-link'"/>
</t>
</xpath>
</template>
<template id="template_header_vertical" inherit_id="website_sale.template_header_vertical">
<xpath expr="//t[@t-call='website_sale.header_cart_link']" position="after">
<t t-call="website_sale_wishlist.header_wishlist_link">
<t t-set="_icon" t-value="True"/>
<t t-set="_item_class" t-value="'nav-item ml-lg-3'"/>
<t t-set="_link_class" t-value="'nav-link'"/>
</t>
</xpath>
</template>
<template id="product_wishlist" name="Wishlist Page">
<t t-call="website.layout">
<t t-set="additional_title">Shop Wishlist</t>