[FIX] website: properly allow to edit header texts and links
The text and links in the header configurations were always the root elements that were editable. For them to be properly editable, we need their container (at minimum) to be the root editable element. Indeed, on root editable elements, only the class and style can be changed (if not dynamic). But changing a link requires to change the href, the target. Changing a text style requires to change the tag entirely, etc. For this to work, the `_link_class` configuration was removed, it was in fact mostly useless and actually even breaking some layouts. So doing this fix actually improves the design as well. For the layout were it made sense, it actually became useless by refactoring the templates. This was necessary anyway for texts which did not use `_link_class` but were root editable nodes anyway because of the `t-if` conditions laying around. closes odoo/odoo#140869 Signed-off-by: Quentin Smetz (qsm) <qsm@odoo.com>
This commit is contained in:
qsm-odoo
@@ -352,7 +352,6 @@
|
||||
<!-- Text element -->
|
||||
<t t-call="website.placeholder_header_text_element">
|
||||
<t t-set="_div_class" t-valuef="mt-2 border-top pt-2 o_border_contrast"/>
|
||||
<t t-set="_link_class" t-valuef="d-block p-1"/>
|
||||
</t>
|
||||
<!-- Social -->
|
||||
<t t-call="website.placeholder_header_social_links">
|
||||
@@ -564,7 +563,6 @@
|
||||
<t t-call="website.placeholder_header_text_element">
|
||||
<t t-set="_txt_elt_content" t-valuef="phone_mail"/>
|
||||
<t t-set="_div_class" t-valuef="mt-2 border-top pt-2 o_border_contrast"/>
|
||||
<t t-set="_link_class" t-valuef="d-block p-1"/>
|
||||
</t>
|
||||
<!-- Social -->
|
||||
<t t-call="website.placeholder_header_social_links">
|
||||
@@ -660,8 +658,8 @@
|
||||
<ul class="o_header_stretch_elts navbar-nav flex-shrink-0 ps-2">
|
||||
<!-- Text element -->
|
||||
<t t-call="website.placeholder_header_text_element">
|
||||
<t t-set="_txt_elt_content" t-valuef="mail_stretched"/>
|
||||
<t t-set="_div_class" t-valuef="h-100 border-start o_border_contrast"/>
|
||||
<t t-set="_link_class" t-valuef="o_navlink_background_hover d-flex align-items-center h-100 text-reset"/>
|
||||
</t>
|
||||
<!-- Search bar -->
|
||||
<t t-call="website.placeholder_header_search_box">
|
||||
@@ -1317,9 +1315,8 @@
|
||||
</li>
|
||||
<!-- Text element -->
|
||||
<t t-call="website.placeholder_header_text_element">
|
||||
<t t-set="_div_class" t-valuef="mt-2 border-top pt-2 o_border_contrast"/>
|
||||
<t t-set="_link_class" t-valuef="d-block p-1"/>
|
||||
<t t-set="_txt_elt_content" t-valuef="phone_mail"/>
|
||||
<t t-set="_div_class" t-valuef="mt-2 border-top pt-2 o_border_contrast"/>
|
||||
</t>
|
||||
<!-- Social -->
|
||||
<t t-call="website.placeholder_header_social_links">
|
||||
@@ -2893,11 +2890,13 @@ Sitemap: <t t-esc="url_root"/>sitemap.xml
|
||||
<template id="website.header_text_element" inherit_id="website.placeholder_header_text_element" name="Header Text element" active="True">
|
||||
<xpath expr="." position="inside">
|
||||
<li t-attf-class="#{_item_class}">
|
||||
<div t-attf-class="s_text_block #{_div_class} #{'d-flex flex-column flex-lg-row gap-1 gap-lg-4 align-items-lg-center' if _txt_elt_content == 'list' else ''}" data-name="Text">
|
||||
<t t-if="_txt_elt_content == 'sentence'">
|
||||
<t t-if="_txt_elt_content == 'sentence'">
|
||||
<div t-attf-class="s_text_block #{_div_class}" data-name="Text">
|
||||
<small>Free Returns and Standard Shipping</small>
|
||||
</t>
|
||||
<t t-elif="_txt_elt_content == 'list'">
|
||||
</div>
|
||||
</t>
|
||||
<t t-elif="_txt_elt_content == 'list'">
|
||||
<div t-attf-class="s_text_block d-flex flex-column flex-lg-row gap-1 gap-lg-4 align-items-lg-center #{_div_class}" data-name="Text">
|
||||
<small class="d-flex align-items-center">
|
||||
<i class="fa fa-1x fa-fw fa-usd fa-stack me-1"/>
|
||||
Low Price Guarantee
|
||||
@@ -2910,33 +2909,47 @@ Sitemap: <t t-esc="url_root"/>sitemap.xml
|
||||
<i class="fa fa-1x fa-fw fa-truck fa-stack me-1"/>
|
||||
Standard Shipping
|
||||
</small>
|
||||
</t>
|
||||
<t t-elif="_txt_elt_content == 'phone_mail'">
|
||||
<a href="tel:+1 (650) 555-0111" t-attf-class="nav-link o_nav-link_secondary #{_link_class}">
|
||||
</div>
|
||||
</t>
|
||||
<t t-elif="_txt_elt_content == 'phone_mail'">
|
||||
<div t-attf-class="s_text_block #{_div_class}" data-name="Text">
|
||||
<a href="tel:+1 (650) 555-0111" class="nav-link o_nav-link_secondary">
|
||||
<small>
|
||||
<i class="fa fa-1x fa-fw fa-phone me-1"/>͏ <!-- Empty character needed to be able to delete the icon. -->
|
||||
<span class="o_force_ltr">+1 (650) 555-0111</span>
|
||||
</small>
|
||||
</a>
|
||||
<a href="mailto:info@yourcompany.example.com" t-attf-class="nav-link o_nav-link_secondary #{_link_class}">
|
||||
<a href="mailto:info@yourcompany.example.com" class="nav-link o_nav-link_secondary">
|
||||
<small>
|
||||
<i class="fa fa-1x fa-fw fa-envelope me-1"/>
|
||||
info@yourcompany.example.com
|
||||
info@yourcompany.example.com
|
||||
</small>
|
||||
</a>
|
||||
</t>
|
||||
<t t-elif="_txt_elt_content == 'mail'">
|
||||
<a href="mailto:info@yourcompany.example.com" t-attf-class="nav-link o_nav-link_secondary #{_link_class}">
|
||||
</div>
|
||||
</t>
|
||||
<t t-elif="_txt_elt_content == 'mail'">
|
||||
<div t-attf-class="s_text_block #{_div_class}" data-name="Text">
|
||||
<a href="mailto:info@yourcompany.example.com" class="nav-link o_nav-link_secondary">
|
||||
<small><i class="fa fa-1x fa-fw fa-envelope me-1"/> info@yourcompany.example.com</small>
|
||||
</a>
|
||||
</t>
|
||||
<t t-else="">
|
||||
<a href="tel:+1 (650) 555-0111" t-attf-class="nav-link o_nav-link_secondary p-2 #{_link_class}">
|
||||
</div>
|
||||
</t>
|
||||
<t t-elif="_txt_elt_content == 'mail_stretched'">
|
||||
<div t-attf-class="s_text_block #{_div_class}" data-name="Text">
|
||||
<a href="tel:+1 (650) 555-0111" class="nav-link o_nav-link_secondary p-2 o_navlink_background_hover d-flex align-items-center h-100 text-reset">
|
||||
<i class="fa fa-1x fa-fw fa-phone me-1"/>
|
||||
<span class="o_force_ltr"><small>+1 (650) 555-0111</small></span>
|
||||
</a>
|
||||
</t>
|
||||
</div>
|
||||
</div>
|
||||
</t>
|
||||
<t t-else="">
|
||||
<div t-attf-class="s_text_block #{_div_class}" data-name="Text">
|
||||
<a href="tel:+1 (650) 555-0111" class="nav-link o_nav-link_secondary p-2">
|
||||
<i class="fa fa-1x fa-fw fa-phone me-1"/>
|
||||
<span class="o_force_ltr"><small>+1 (650) 555-0111</small></span>
|
||||
</a>
|
||||
</div>
|
||||
</t>
|
||||
</li>
|
||||
</xpath>
|
||||
</template>
|
||||
|
||||
Reference in New Issue
Block a user