pengyuthon/odoo_source
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[REF] website_sale(_*): review product item display

Browse Source 
* comparison

There is a somewhat big difference between BS3 and BS4: <h5> titles
were the size as normal text and <h6> were smaller while, now, <h5>
titles are a lot bigger (1.25x) than normal text and <h6> are the
same size as normal text.

While both system may be consistent, we feel that standing for BS4 is
the best approach. That way, the smallest <hx> (<h6/>) should be used
for titles of items that are numerous in the page. This is the case
for our shop listing, each product as its own title and before, we used
<h5/> element. Using <h6/> for those feels semantically more consistent
and goes with default BS4 style.

Also review the product comparator popover.
This commit is contained in:
qsm-odoo
2018-08-19 16:57:14 +02:00
parent 7debf9deb0
commit 2b18c1e114
2 changed files with 16 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files
addons/website_sale/views/templates.xml
+5 -7
View File
@@ -107,12 +107,10 @@
</div>
</t>
<section>
<h5>
<strong>
<a itemprop="name" t-att-href="product_href" t-att-content="product.name" t-field="product.name" />
</strong>
<h6>
<a itemprop="name" t-att-href="product_href" t-att-content="product.name" t-field="product.name" />
<a role="button" t-if="not show_publish and not product.website_published" t-att-href="product_href" class="btn btn-secondary btn-sm btn-danger" title="This product is unpublished.">Unpublished</a>
</h5>
</h6>
<div itemprop="offers" itemscope="itemscope" itemtype="http://schema.org/Offer" class="product_price" t-if="product.product_variant_ids">
<b>
<t t-if="product.website_price_difference and website.get_current_pricelist().discount_policy=='without_discount'">
@@ -534,11 +532,11 @@
<div class="col-lg-2" style="width: 170px; height:130px; float:left; display:inline; margin-right: 10px; overflow:hidden;">
<div class="mt16 text-center" style="height: 100%;">
<div t-field="alt_product.image_small" t-options="{'widget': 'image', 'class': 'rounded shadow o_alternative_product' }" />
<h5>
<h6>
<a t-attf-href="/shop/product/#{ slug(alt_product) }" style="display: block">
<span t-att-title="alt_product.name" t-field="alt_product.name" class="o_text_overflow" style="display: block;" />
</a>
</h5>
</h6>
</div>
</div>
</t>
addons/website_sale_comparison/views/website_sale_comparison_template.xml
+11 -15
View File
@@ -121,24 +121,20 @@
</template>
<template id="product_product" name="Comparator - Product row in comparator popover">
<div class="row mt8 o_product_row" t-att-data-category_ids="product.public_categ_ids.ids">
<div class="col-md-3 col-3 mb8">
<div class="row no-gutters align-items-center mt-2 o_product_row" t-att-data-category_ids="product.public_categ_ids.ids">
<div class="col-3">
<img class="img img-fluid" t-attf-src="/web/image/product.product/#{product.id}/image_small" style="max-height: 50px;" alt="Product image"/>
</div>
<div class="col-md-7 col-7 mb8 text-left">
<h5>
<strong><a t-attf-href="/shop/product/#{product.product_tmpl_id[0].id}"><t t-esc="product.display_name" /></a></strong>
</h5>
<h5 class="mt0 mb0">
<strong>
<t t-if="(compute_currency(product.lst_price) - product.website_price ) &gt; 0.01 and website.get_current_pricelist().discount_policy=='without_discount'">
<del class="text-danger mr8" style="white-space: nowrap;" t-esc="compute_currency(product.website_public_price)" t-options="{'widget': 'monetary', 'display_currency': website.get_current_pricelist().currency_id, 'from_currency': website.currency_id}" />
</t>
<span t-esc="product.website_price" t-options="{'widget': 'monetary', 'display_currency': website.currency_id}"></span>
</strong>
</h5>
<div class="col-8 pl-2">
<h6>
<a t-attf-href="/shop/product/#{product.product_tmpl_id[0].id}"><t t-esc="product.display_name" /></a><br/>
<t t-if="(compute_currency(product.lst_price) - product.website_price ) &gt; 0.01 and website.get_current_pricelist().discount_policy=='without_discount'">
<del class="text-danger mr8" style="white-space: nowrap;" t-esc="compute_currency(product.website_public_price)" t-options="{'widget': 'monetary', 'display_currency': website.get_current_pricelist().currency_id, 'from_currency': website.currency_id}" />
</t>
<span t-esc="product.website_price" t-options="{'widget': 'monetary', 'display_currency': website.currency_id}"></span>
</h6>
</div>
<div class="col-md-1 col-1 mt32">
<div class="col-1 text-right">
<a href='#' class="o_remove" title="Remove" t-att-data-product_product_id="product.id">
<i class="fa fa-trash" role="img" aria-label="Remove"></i>
</a>