[FIX] website: reorder/reword header's options

task-2335267

Part-of: #57942
X-original-commit: fb8fbc879cdd27ba751f64f205d97e53c1a03559
This commit is contained in:
stefanorigano (SRI)
2020-09-22 18:51:16 +00:00
committed by qsm-odoo
parent 017ab2a3b9
commit e1b15e3768
3 changed files with 96 additions and 125 deletions
@@ -1769,7 +1769,7 @@ options.registry.collapse = options.Class.extend({
},
});
options.registry.HeaderLogo = options.Class.extend({
options.registry.HeaderNavbar = options.Class.extend({
//--------------------------------------------------------------------------
// Private
@@ -1790,36 +1790,6 @@ options.registry.HeaderLogo = options.Class.extend({
},
});
options.registry.HeaderTemplate = options.Class.extend({
//--------------------------------------------------------------------------
// Private
//--------------------------------------------------------------------------
/**
* @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({
pageOptionName: undefined,
showOptionWidgetName: undefined,
+83 -82
View File
@@ -527,8 +527,7 @@
data-selector="[data-oe-expression='res_company.partner_id']"
data-no-check="true"/>
<div data-js="HeaderTemplate"
data-selector="#wrapwrap > header"
<div data-selector="#wrapwrap > header"
data-no-check="true"
groups="website.group_website_designer">
<we-select string="Template" data-variable="header-template" data-reload="/">
@@ -602,39 +601,6 @@
data-unit="px"
data-save-unit="rem"/>
<!-- 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, website.option_header_off_canvas_template_header_hamburger, website.option_header_off_canvas_template_header_sidebar, website.option_header_off_canvas_template_header_hamburger_full">Off-Canvas</we-button>
</we-select>
<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-row string="Font">
<we-fontfamilypicker data-variable="navbar-font"/>
<we-input data-customize-website-variable="null" data-variable="header-font-size" data-unit="px" data-save-unit="rem"/>
</we-row>
<we-row string="Colors">
<we-colorpicker data-customize-website-color="" data-color="menu"
data-with-combinations="true"/>
@@ -663,30 +629,10 @@
</t>
</div>
<div data-js="HeaderLogo"
data-selector="#wrapwrap > header"
<div data-selector="#wrapwrap > header"
data-no-check="true"
groups="website.group_website_designer">
<we-select string="Logo" data-reload="/">
<we-button data-customize-website-views="" data-name="option_header_brand_none">None</we-button>
<we-button data-customize-website-views="website.option_header_brand_name">Text</we-button>
<we-button data-customize-website-views="website.option_header_brand_logo">Image</we-button>
</we-select>
<we-input string="⌙ Height"
data-dependencies="!option_header_brand_none"
data-customize-website-variable="null"
data-variable="logo-height"
data-unit="px"
data-save-unit="rem"/>
<we-input string="⌙ Height (Scrolled)"
data-name="option_logo_height_scrolled"
data-customize-website-variable="null"
data-variable="fixed-logo-height"
data-unit="px"
data-save-unit="rem"
data-dependencies="!header_effect_scroll_opt"/>
<we-select string="Scroll Effect" data-dependencies="!header_sidebar_opt">
<t t-set="header_effect_standard_label">Standard</t>
<t t-set="header_effect_scroll_label">Scroll</t>
@@ -739,8 +685,70 @@
<small t-esc='header_effect_fadeout_label'/>
</we-button>
</we-select>
</div>
<we-select string="Menu Style" data-variable="header-links-style" data-reload="/">
<div data-js="TopMenuVisibility"
data-selector="[data-main-object^='website.page('] #wrapwrap > header"
data-no-check="true">
<we-select string="Header Position" id="option_header_visibility" data-no-preview="true">
<we-button data-visibility="transparent">Over The Content</we-button>
<we-button data-name="regular_header_visibility_opt"
data-visibility="regular">Regular</we-button>
<we-button data-visibility="hidden">Hidden</we-button>
</we-select>
</div>
<div data-js="topMenuColor"
data-selector="[data-main-object^='website.page('] #wrapwrap > header"
data-no-check="true">
<we-colorpicker string="⌙ Background"
id="option_header_transparent_color"
data-select-style="true"
data-css-property="background-color"
data-color-prefix="bg-"
data-excluded="theme, common, custom"/>
</div>
<!-- Header > Navbar Options -->
<div data-js="HeaderNavbar"
data-selector="#wrapwrap > header > nav"
data-no-check="true"
groups="website.group_website_designer">
<!-- 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, website.option_header_off_canvas_template_header_hamburger, website.option_header_off_canvas_template_header_sidebar, website.option_header_off_canvas_template_header_hamburger_full">Off-Canvas</we-button>
</we-select>
<we-select string="⌙ Off-Canvas 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-row string="Font">
<we-fontfamilypicker data-variable="navbar-font"/>
<we-input data-customize-website-variable="null" data-variable="header-font-size" data-unit="px" data-save-unit="rem"/>
</we-row>
<we-select string="Links Style" data-variable="header-links-style" data-reload="/">
<we-button data-name="option_header_navbar_links_default"
data-customize-website-views=""
data-customize-website-variable="'default'">Default</we-button>
@@ -766,34 +774,27 @@
data-customize-website-views="website.header_hoverable_dropdown">On Hover</we-button>
<we-button data-select-class="" data-name="header_dropdown_on_click_opt">On Click</we-button>
</we-select>
</div>
<div data-js="TopMenuVisibility"
data-selector="[data-main-object^='website.page('] #wrapwrap > header"
data-no-check="true">
<we-select string="Page Visibility" id="option_header_visibility" data-no-preview="true">
<we-button data-name="regular_header_visibility_opt"
data-visibility="regular">Regular</we-button>
<we-button data-visibility="transparent">Transparent</we-button>
<we-button data-visibility="hidden">Hidden</we-button>
<we-select string="Logo type" data-reload="/">
<we-button data-customize-website-views="" data-name="option_header_brand_none">None</we-button>
<we-button data-customize-website-views="website.option_header_brand_name">Text</we-button>
<we-button data-customize-website-views="website.option_header_brand_logo">Image</we-button>
</we-select>
</div>
<we-input string="⌙ Height"
data-dependencies="!option_header_brand_none"
data-customize-website-variable="null"
data-variable="logo-height"
data-unit="px"
data-save-unit="rem"/>
<we-input string="⌙ Height (Scrolled)"
data-name="option_logo_height_scrolled"
data-customize-website-variable="null"
data-variable="fixed-logo-height"
data-unit="px"
data-save-unit="rem"
data-dependencies="!header_effect_scroll_opt"/>
<div data-js="topMenuColor"
data-selector="[data-main-object^='website.page('] #wrapwrap > header"
data-no-check="true">
<we-colorpicker string="Transparent color"
id="option_header_transparent_color"
data-select-style="true"
data-css-property="background-color"
data-color-prefix="bg-"
data-excluded="theme, common, custom"/>
</div>
<div data-selector="#wrapwrap > header"
data-no-check="true"
groups="website.group_website_designer">
<we-checkbox string="Sign In" data-customize-website-views="portal.user_sign_in" data-reload="/"/>
<we-checkbox string="Show Sign In" data-customize-website-views="portal.user_sign_in" data-reload="/"/>
<we-select string="Language Selector" data-reload="/">
<we-button data-name="header_language_selector_none_opt"
data-customize-website-views="">None</we-button>
+12 -12
View File
@@ -223,7 +223,7 @@
<!-- "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">
<nav data-name="Navbar" 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">
@@ -295,7 +295,7 @@
<!-- "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">
<nav data-name="Navbar" class="navbar navbar-light o_colored_level o_cc">
<div id="top_menu_container" class="container">
<!-- Brand -->
<t t-call="website.placeholder_header_brand">
@@ -429,7 +429,7 @@
<!-- "Vertical" template -->
<template id="template_header_vertical" inherit_id="website.layout" name="Template Header Vertical" active="False">
<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">
<nav data-name="Navbar" 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">
@@ -536,7 +536,7 @@
<template id="template_header_sidebar" inherit_id="website.layout" name="Template Header Sidebar" active="False">
<xpath expr="//header//nav" position="replace">
<nav class="navbar navbar-expand-lg navbar-light o_colored_level o_cc shadow pb-3">
<nav data-name="Navbar" class="navbar navbar-expand-lg navbar-light o_colored_level o_cc shadow pb-3">
<div id="top_menu_container" class="container h-100">
<!-- Brand -->
<t t-call="website.placeholder_header_brand"/>
@@ -620,7 +620,7 @@
<template id="template_header_slogan" inherit_id="website.layout" name="Template Header Slogan" active="False">
<xpath expr="//header//nav" position="replace">
<nav class="navbar navbar-expand-lg navbar-light o_colored_level o_cc shadow-sm">
<nav data-name="Navbar" class="navbar navbar-expand-lg navbar-light o_colored_level o_cc shadow-sm">
<div id="top_menu_container" class="container flex-row flex-wrap">
<!-- Brand -->
<t t-call="website.placeholder_header_brand">
@@ -718,7 +718,7 @@
<template id="template_header_contact" inherit_id="website.layout" name="Template Header Contact" active="False">
<xpath expr="//header//nav" position="replace">
<div class="oe_structure" id="oe_structure_header_contact_1"/>
<nav class="navbar navbar-light navbar-expand-lg o_colored_level o_cc shadow-sm">
<nav data-name="Navbar" class="navbar navbar-light navbar-expand-lg o_colored_level o_cc shadow-sm">
<div id="top_menu_container" class="container">
<!-- Brand -->
<t t-call="website.placeholder_header_brand"/>
@@ -803,7 +803,7 @@
<template id="template_header_minimalist" inherit_id="website.layout" name="Template Header Minimalist" active="False">
<xpath expr="//header//nav" position="replace">
<nav class="navbar navbar-light navbar-expand-md o_colored_level o_cc">
<nav data-name="Navbar" class="navbar navbar-light navbar-expand-md o_colored_level o_cc">
<div id="top_menu_container" class="container flex-wrap">
<!-- Brand -->
<t t-call="website.placeholder_header_brand"/>
@@ -871,7 +871,7 @@
</div>
</div>
<div id="top_menu_container" class="container mt-n4">
<nav class="navbar navbar-light navbar-expand-lg o_colored_level o_cc shadow-sm rounded pr-2">
<nav data-name="Navbar" class="navbar navbar-light navbar-expand-lg o_colored_level o_cc shadow-sm rounded pr-2">
<!-- Brand -->
<t t-call="website.placeholder_header_brand"/>
<!-- Navbar Toggler -->
@@ -932,7 +932,7 @@
<template id="template_header_centered_logo" inherit_id="website.layout" name="Template Header Centered Logo" active="False">
<xpath expr="//header//nav" position="replace">
<nav class="navbar navbar-light navbar-expand-lg o_colored_level o_cc">
<nav data-name="Navbar" class="navbar navbar-light navbar-expand-lg o_colored_level o_cc">
<div id="top_menu_container" class="container">
<!-- Navbar Toggler -->
<t t-call="website.navbar_toggler"/>
@@ -978,7 +978,7 @@
<template id="template_header_image" inherit_id="website.layout" name="Template Header Image" active="False">
<xpath expr="//header//nav" position="replace">
<div class="oe_structure" id="oe_structure_header_image_1"/>
<nav class="navbar navbar-light navbar-expand-lg o_colored_level o_cc shadow-sm">
<nav data-name="Navbar" class="navbar navbar-light navbar-expand-lg o_colored_level o_cc shadow-sm">
<div id="top_menu_container" class="container">
<!-- Brand -->
<t t-call="website.placeholder_header_brand"/>
@@ -1049,7 +1049,7 @@
<template id="template_header_hamburger_full" inherit_id="website.layout" name="Template Header Hambuger Full" active="False">
<xpath expr="//header//nav" position="replace">
<nav class="navbar navbar-light o_colored_level o_cc">
<nav data-name="Navbar" class="navbar navbar-light o_colored_level o_cc">
<div id="top_menu_container" class="container">
<!-- Brand -->
<t t-call="website.placeholder_header_brand"/>
@@ -1129,7 +1129,7 @@
<xpath expr="//header//nav" position="replace">
<!-- Topbar -->
<div class="oe_structure" id="oe_structure_header_magazine_1"/>
<nav class="navbar navbar-light o_colored_level o_cc">
<nav data-name="Navbar" class="navbar navbar-light o_colored_level o_cc">
<div id="top_menu_container" class="container">
<!-- Brand -->
<t t-call="website.placeholder_header_brand"/>