layout de producto

This commit is contained in:
f 2021-10-28 09:36:49 -03:00
parent c227fbe722
commit 57413d263e
4 changed files with 153 additions and 7 deletions

View file

@ -156,6 +156,30 @@ remove:
default:
es: 'Quitar del carrito'
en: 'Remove product'
length_unit:
type: 'string'
required: true
label:
es: 'Unidad de medida de los productos'
en: 'Measurement unit for products'
help:
es: ''
en: ''
default:
es: 'mm'
en: 'mm'
weight_unit:
type: 'string'
required: true
label:
es: 'Unidad de medida para el peso de los productos'
en: 'Measurement unit for products weight'
help:
es: ''
en: ''
default:
es: 'gr'
en: 'gr'
back:
type: 'string'
required: true

View file

@ -94,8 +94,8 @@ width:
es: 'Ancho'
en: 'Width'
help:
es: 'En milímetros'
en: 'In millimeters'
es: 'En la unidad de medida que configuraste en el carrito'
en: 'In measurement units configured in cart'
height:
type: 'number'
writable: 'once'
@ -103,17 +103,17 @@ height:
es: 'Alto'
en: 'Height'
help:
es: 'En milímetros'
en: 'In millimeters'
es: 'En la unidad de medida que configuraste en el carrito'
en: 'In measurement units configured in cart'
depth:
type: 'number'
writable: 'once'
label:
es: 'Profundidad (Lomo)'
es: 'Profundidad'
en: 'Depth'
help:
es: 'En milímetros'
en: 'In millimeters'
es: 'En la unidad de medida que configuraste en el carrito'
en: 'In measurement units configured in cart'
weight:
type: 'number'
required: true

110
_layouts/product.html Normal file
View file

@ -0,0 +1,110 @@
---
layout: default
---
<article
itemscope itemtype="http://schema.org/Product"
class="w-100 pb-5 h-entry">
<div class="m-auto row no-gutters justify-content-center">
<div class="col-10 col-lg-6">
<picture>
<img
itemprop="image"
class="img-fluid"
src="{{ page.image.path | thumbnail: 316 }}"
alt="{{ page.image.description | default: page.title }}" />
</picture>
<div class="w-lg-50">
<h4 class="sr-only">{{ site.i18n.libro.ficha }}</h4>
<ul class="border-bottom border-tl list-unstyled pt-5 gray-600">
<li>
<time
class="dt-published"
itemprop="datePublished"
datetime="{{ page.date | date_to_xmlschema }}">{{ page.date | date_local: '%B %Y' }}</time>
</li>
{% if page.width > 0 %}
<li itemprop="width" itemscope="https://schema.org/QuantitativeValue">
<span class="font-weight-bold">{{ site.data.layouts.product.width.label[site.lang }}</span>
<span itemprop="value">{{ page.width }}</span>
<span itemprop="unitText">{{ site.cart.length_unit | default: site.data.layouts.cart.length_unit.default[site.lang] }}</span>
</li>
{% endif %}
{% if page.height > 0 %}
<li itemprop="height" itemscope="https://schema.org/QuantitativeValue">
<span class="font-weight-bold">{{ site.data.layouts.product.height.label[site.lang }}</span>
<span itemprop="value">{{ page.height }}</span>
<span itemprop="unitText">{{ site.cart.length_unit | default: site.data.layouts.cart.length_unit.default[site.lang] }}</span>
</li>
{% endif %}
{% if page.depth > 0 %}
<li itemprop="depth" itemscope="https://schema.org/QuantitativeValue">
<span class="font-weight-bold">{{ site.data.layouts.product.depth.label[site.lang }}</span>
<span itemprop="value">{{ page.depth }}</span>
<span itemprop="unitText">{{ site.cart.length_unit | default: site.data.layouts.cart.length_unit.default[site.lang] }}</span>
</li>
{% endif %}
{% if page.weight > 0 %}
<li itemprop="weight" itemscope="https://schema.org/QuantitativeValue">
<span class="font-weight-bold">{{ site.data.layouts.product.weight.label[site.lang }}</span>
<span itemprop="value">{{ page.weight }}</span>
<span itemprop="unitText">{{ site.cart.weight_unit | default: site.data.layouts.cart.weight_unit.default[site.lang] }}</span>
</li>
{% endif %}
</ul>
<div itemprop="offers">
<div
class="d-flex align-items-center justify-content-between mb-3 ml-1"
{% include_cached cart_controller.html product=page %}
itemscope itemtype="https://schema.org/Offer">
<meta itemprop="sku" content="{{ page.sku }}" />
<meta itemprop="acceptedPaymentMethod" content="http://purl.org/goodrelations/v1#PayPal" />
<meta itemprop="availableDeliveryMethod" content="http://purl.org/goodrelations/v1#Mail" />
{% if page.in_stock %}
<meta itemprop="availability" content="https://schema.org/InStock" />
{% else %}
<meta itemprop="availability" content="https://schema.org/OutOfStock" />
{% endif %}
<p>
<span itemprop="price" data-stock-price>{{ page.price | floor }}</span>
<span itemprop="priceCurrency" data-stock-currency>{{ site.cart.currency }}</span>
</p>
<button
data-action="cart#add"
{{ page.in_stock | value_if: 'disabled' }}
class="btn btn-primary btn-block">
<span class="hide-when-disabled">{{ site.cart.add }}</span>
<span class="show-when-disabled">{{ site.cart.out_of_stock | default: site.data.layouts.cart.out_of_stock.default[site.locale] }}</span>
</button>
</div>
</div>
</div>
</div>
<div class="col-10 col-lg-6 black mt-5 mt-lg-0">
<header>
<h1 class="p-name" itemprop="name headline">{{ page.title }}</h1>
<p class="lead p-summary" itemprop="description">{{ page.description }}</p>
</header>
<div class="font-weight-light gray-600 lead text-md-justify hyphens-md e-content" itemprop="abstract">
{{ content }}
</div>
</div>
</div>
<span hidden itemprop="identifier">{{ page.uuid }}</span>
<a hidden class="u-url" itemprop="url" href="{{ page.url | absolute_url }}">{{ page.url | absolute_url }}</a>
<meta itemprop="keywords" content="{{ page.categories | join: ',' }}{% unless page.categories == empty %},{% endunless %}{{ page.tags | join: ',' }}"/>
</article>

View file

@ -37,6 +37,18 @@ $directions: (top, right, bottom, left);
&::-webkit-scrollbar { display: none; }
}
:enabled {
.show-when-disabled#{$infix} {
display: none !important;
}
}
:disabled {
.hide-when-disabled#{$infix} {
display: none !important;
}
}
/// Un elemento cuadrado
///
/// @example html