fix: huge refactor
This commit is contained in:
@@ -4,9 +4,8 @@
|
||||
<input type="hidden" name="product" value="{{ product.pk }}">
|
||||
|
||||
<div class="flex">
|
||||
<input class="input-number"
|
||||
id="quantity" aria-label="quantity" type="number" min="1" max="10" name="quantity" value="1">
|
||||
<button class="button-primary"
|
||||
<input class="input" id="quantity" aria-label="quantity" type="number" min="1" max="10" name="quantity" value="1">
|
||||
<button class="btn btn-primary"
|
||||
>
|
||||
{% include 'components/icons/add_cart.svg' %}
|
||||
{% translate 'Añadir al carrito' %}
|
||||
|
||||
@@ -1,380 +1,345 @@
|
||||
{% load i18n %}
|
||||
<section class="bg-white py-2 antialiased dark:bg-gray-900 md:py-8">
|
||||
<form action="{% url 'web:cart_detail' %}" method="post">
|
||||
{% csrf_token %}
|
||||
<div class="mx-auto max-w-screen-xl px-4 2xl:px-0">
|
||||
<h2 class="text-xl font-semibold text-gray-900 dark:text-white sm:text-2xl">{% translate 'Carrito' %}</h2>
|
||||
<section class=" py-2 antialiased md:py-8">
|
||||
<form action="{% url 'web:cart_detail' %}" method="post">
|
||||
{% csrf_token %}
|
||||
<div class="mx-auto max-w-screen-xl px-4 2xl:px-0">
|
||||
<h2 class="text-xl font-semibold sm:text-2xl">{% translate 'Carrito' %}</h2>
|
||||
|
||||
<div class="mt-4 sm:mt-6 md:gap-6 lg:flex lg:items-start xl:gap-8">
|
||||
<div class="mx-auto w-full flex-none lg:max-w-2xl xl:max-w-4xl">
|
||||
<div class="space-y-6">
|
||||
<div class="mt-4 sm:mt-6 md:gap-6 lg:flex lg:items-start xl:gap-8">
|
||||
<div class="mx-auto w-full flex-none lg:max-w-2xl xl:max-w-4xl">
|
||||
<div class="space-y-6">
|
||||
|
||||
{% for item in items %}
|
||||
<div class="rounded-lg border border-gray-200 bg-white p-4 shadow-sm
|
||||
dark:border-gray-700 dark:bg-gray-800 md:p-6">
|
||||
<div class="space-y-4 flex items-center justify-between gap-6 space-y-0">
|
||||
<a href="{% url 'web:product_detail' pk=item.product.pk slug=item.product.slug %}"
|
||||
class="shrink-0 md:order-1">
|
||||
<img class="h-20 w-20 dark:hidden" src="{{ item.product.images.all.0.s.url }}"
|
||||
alt="{{ item.product.name }}"/>
|
||||
<img class="hidden h-20 w-20 dark:block" src="{{ item.product.images.all.0.s_dark.url }}"
|
||||
alt="{{ item.product.name }}"/>
|
||||
</a>
|
||||
{% for item in items %}
|
||||
<div class="rounded-lg p-4 shadow-sm md:p-6">
|
||||
<div class="space-y-4 flex items-center justify-between gap-6 space-y-0">
|
||||
<a href="{% url 'web:product_detail' pk=item.product.pk slug=item.product.slug %}"
|
||||
class="shrink-0 md:order-1">
|
||||
<img class="h-20 w-20" src="{{ item.product.images.all.0.s.url }}"
|
||||
alt="{{ item.product.name }}"/>
|
||||
<img class="hidden h-20 w-20" src="{{ item.product.images.all.0.s_dark.url }}"
|
||||
alt="{{ item.product.name }}"/>
|
||||
</a>
|
||||
|
||||
<div class="w-full min-w-0 flex-1 space-y-4 md:order-2 md:max-w-md">
|
||||
<a href="{% url 'web:product_detail' pk=item.product.pk slug=item.product.slug %}"
|
||||
class="text-base font-medium hover:underline "
|
||||
>
|
||||
{{ item.product.name }}
|
||||
</a>
|
||||
|
||||
<div class="w-full min-w-0 flex-1 space-y-4 md:order-2 md:max-w-md">
|
||||
<a href="{% url 'web:product_detail' pk=item.product.pk slug=item.product.slug %}"
|
||||
class="text-base font-medium text-gray-900 hover:underline dark:text-white"
|
||||
>
|
||||
{{ item.product.name }}
|
||||
</a>
|
||||
|
||||
<div class="flex items-center gap-4">
|
||||
<form class="flex" hx-post="{% url 'web:delete_cart_item' pk=item.pk %}"
|
||||
hx-swap="none">
|
||||
{% csrf_token %}
|
||||
<button
|
||||
type="submit"
|
||||
class="inline-flex items-center text-sm font-medium text-red-700 hover:underline dark:text-red-400 cursor-pointer"
|
||||
>
|
||||
{% include 'components/icons/x.svg' %}
|
||||
{% translate 'Quitar' %}
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<label for="counter-input" class="sr-only">{% translate 'Cantidad' %}</label>
|
||||
<div class="flex items-center justify-between md:order-3 md:justify-end">
|
||||
<div class="flex items-center">
|
||||
<span class="w-10 shrink-0 border-0 bg-transparent text-center text-sm font-medium
|
||||
text-gray-900 focus:outline-none focus:ring-0 dark:text-white"
|
||||
>
|
||||
{{ item.quantity }}x
|
||||
</span>
|
||||
</div>
|
||||
<div class="text-end md:order-4 md:w-32">
|
||||
<p class="text-base font-bold text-gray-900 dark:text-white">
|
||||
{{ item.product.price.price_with_tax }}€
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
{% endfor %}
|
||||
|
||||
{% if items.count == 0 %}
|
||||
<p class="text-base font-normal text-gray-500 dark:text-gray-400">
|
||||
{% translate 'No hay nada en el carrito...' %}
|
||||
</p>
|
||||
<p>
|
||||
<a href="{% url 'web:index' %}" title=""
|
||||
class="inline-flex items-center gap-2 text-sm font-medium text-primary-700 underline hover:no-underline dark:text-primary-500">
|
||||
{% translate 'Volver a inicio' %}
|
||||
</a>
|
||||
</p>
|
||||
{% endif %}
|
||||
|
||||
<h2 class="text-xl font-semibold text-gray-900 dark:text-white sm:text-2xl">
|
||||
{% translate 'Dirección de envío' %}
|
||||
</h2>
|
||||
|
||||
<section class="p-4 rounded-lg border border-gray-200 dark:border-gray-600">
|
||||
|
||||
<div class="grid gap-4 sm:grid-cols-2 sm:gap-6 my-2">
|
||||
{% if user.is_anonymous %}
|
||||
<div class="sm:col-span-2">
|
||||
<label for="email"
|
||||
class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">
|
||||
{% translate 'E-Mail' %}</label>
|
||||
<input type="text" name="email" id="email"
|
||||
class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600
|
||||
focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600
|
||||
dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500"
|
||||
placeholder="{% translate 'E-Mail' %}"
|
||||
value=""
|
||||
required=""
|
||||
>
|
||||
</div>
|
||||
{% else %}
|
||||
<input type="hidden" name="email" value="{{ user.email }}">
|
||||
{% endif %}
|
||||
<div class="sm:col-span-2">
|
||||
<label for="shipping_address_full_name"
|
||||
class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">
|
||||
{% translate 'Nombre completo' %}</label>
|
||||
<input type="text" name="shipping_address_full_name" id="shipping_address_full_name"
|
||||
class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600
|
||||
focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600
|
||||
dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500"
|
||||
placeholder="{% translate 'Nombre completo' %}"
|
||||
value="{% if shipping_address %}{{ shipping_address.full_name }}{% endif %}"
|
||||
required=""
|
||||
>
|
||||
<label for="shipping_address"
|
||||
class="block my-2 text-sm font-medium text-gray-900 dark:text-white">
|
||||
{% translate 'Dirección' %}</label>
|
||||
<input type="text" name="shipping_address" id="shipping_address"
|
||||
class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600
|
||||
focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600
|
||||
dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500"
|
||||
placeholder="{% translate 'Dirección' %}"
|
||||
value="{% if shipping_address %}{{ shipping_address.address }}{% endif %}"
|
||||
required=""
|
||||
>
|
||||
</div>
|
||||
<div class="w-full">
|
||||
<label for="shipping_address_town"
|
||||
class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">
|
||||
{% translate 'Localidad' %}
|
||||
</label>
|
||||
<input type="text" name="shipping_address_town" id="shipping_address_town"
|
||||
class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600
|
||||
focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600
|
||||
dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500"
|
||||
placeholder="{% translate 'Localidad' %}"
|
||||
value="{% if shipping_address %}{{ shipping_address.address_town }}{% endif %}"
|
||||
required=""
|
||||
>
|
||||
</div>
|
||||
<div class="w-full">
|
||||
<label for="shipping_address_zip"
|
||||
class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">
|
||||
{% translate 'Código postal' %}
|
||||
</label>
|
||||
<input type="text" name="shipping_address_zip" id="shipping_address_zip"
|
||||
class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600
|
||||
focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600
|
||||
dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500"
|
||||
placeholder="{% translate 'Código postal' %}"
|
||||
value="{% if shipping_address %}{{ shipping_address.address_zip }}{% endif %}"
|
||||
required=""
|
||||
>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label for="shipping_address_state"
|
||||
class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">
|
||||
{% translate 'Provincia' %}
|
||||
</label>
|
||||
<input type="text" name="shipping_address_state" id="shipping_address_state"
|
||||
class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600
|
||||
focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600
|
||||
dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500"
|
||||
placeholder="{% translate 'Provincia' %}"
|
||||
value="{% if shipping_address %}{{ shipping_address.address_state }}{% endif %}"
|
||||
required=""
|
||||
>
|
||||
|
||||
</div>
|
||||
<div>
|
||||
<label for="shipping_address_country"
|
||||
class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">
|
||||
{% translate 'País' %}
|
||||
</label>
|
||||
<input type="text" name="shipping_address_country" id="shipping_address_country"
|
||||
class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600
|
||||
focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600
|
||||
dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500"
|
||||
placeholder="{% translate 'País' %}"
|
||||
value="{% if shipping_address %}{{ shipping_address.address_country }}{% endif %}"
|
||||
required=""
|
||||
>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<h2 class="text-xl font-semibold text-gray-900 dark:text-white sm:text-2xl">
|
||||
{% translate 'Dirección de facturación' %}
|
||||
</h2>
|
||||
|
||||
<section class="p-4 rounded-lg border border-gray-200 dark:border-gray-600">
|
||||
|
||||
<div class="grid gap-4 sm:grid-cols-2 sm:gap-6 my-2">
|
||||
<div class="sm:col-span-2">
|
||||
<label for="billing_address_full_name"
|
||||
class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">
|
||||
{% translate 'Nombre completo' %}</label>
|
||||
<input type="text" name="billing_address_full_name" id="billing_address_full_name"
|
||||
class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600
|
||||
focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600
|
||||
dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500"
|
||||
placeholder="{% translate 'Nombre completo' %}"
|
||||
value="{% if billing_address %}{{ billing_address.full_name }}{% endif %}"
|
||||
required=""
|
||||
>
|
||||
<label for="billing_address"
|
||||
class="block my-2 text-sm font-medium text-gray-900 dark:text-white">
|
||||
{% translate 'Dirección' %}
|
||||
</label>
|
||||
<input type="text" name="billing_address" id="billing_address"
|
||||
class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600
|
||||
focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600
|
||||
dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500"
|
||||
placeholder="{% translate 'Dirección' %}"
|
||||
value="{% if billing_address %}{{ billing_address.address }}{% endif %}"
|
||||
required=""
|
||||
>
|
||||
</div>
|
||||
<div class="w-full">
|
||||
<label for="billing_address_town"
|
||||
class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">
|
||||
{% translate 'Localidad' %}
|
||||
</label>
|
||||
<input type="text" name="billing_address_town" id="billing_address_town"
|
||||
class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600
|
||||
focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600
|
||||
dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500"
|
||||
placeholder="{% translate 'Localidad' %}"
|
||||
value="{% if billing_address %}{{ billing_address.address_town }}{% endif %}"
|
||||
required=""
|
||||
>
|
||||
</div>
|
||||
<div class="w-full">
|
||||
<label for="billing_address_zip"
|
||||
class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">
|
||||
{% translate 'Código postal' %}
|
||||
</label>
|
||||
<input type="text" name="billing_address_zip" id="billing_address_zip"
|
||||
class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600
|
||||
focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600
|
||||
dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500"
|
||||
placeholder="{% translate 'Código postal' %}"
|
||||
value="{% if billing_address %}{{ billing_address.address_zip }}{% endif %}"
|
||||
required=""
|
||||
>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label for="billing_address_state"
|
||||
class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">
|
||||
{% translate 'Provincia' %}
|
||||
</label>
|
||||
<input type="text" name="billing_address_state" id="billing_address_state"
|
||||
class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600
|
||||
focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600
|
||||
dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500"
|
||||
placeholder="{% translate 'Provincia' %}"
|
||||
value="{% if billing_address %}{{ billing_address.address_state }}{% endif %}"
|
||||
required=""
|
||||
>
|
||||
|
||||
</div>
|
||||
<div>
|
||||
<label for="billing_address_country"
|
||||
class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">
|
||||
{% translate 'País' %}
|
||||
</label>
|
||||
<input type="text" name="billing_address_country" id="billing_address_country"
|
||||
class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-primary-600
|
||||
focus:border-primary-600 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600
|
||||
dark:placeholder-gray-400 dark:text-white dark:focus:ring-primary-500 dark:focus:border-primary-500"
|
||||
placeholder="{% translate 'País' %}"
|
||||
value="{% if billing_address %}{{ billing_address.address_country }}{% endif %}"
|
||||
required=""
|
||||
>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h2 class="text-xl mb-4 font-semibold text-gray-900 dark:text-white sm:text-2xl">
|
||||
{% translate 'Opciones de envío' %}
|
||||
</h2>
|
||||
<article class="rounded-lg border border-gray-200 dark:border-gray-600">
|
||||
|
||||
{% for shipping_method in shipping_methods %}
|
||||
<div class="p-4">
|
||||
<input type="radio" id="shipping_method_{{ shipping_method.pk }}"
|
||||
name="shipping_method"
|
||||
value="{{ shipping_method.pk }}" {% if forloop.first %}checked{% endif %}>
|
||||
<label for="shipping_method_{{ shipping_method.pk }}"
|
||||
class="text-gray-900 dark:text-white">
|
||||
{{ shipping_method.name }} - {{ shipping_method.shipping_product.price.price_with_tax }}€
|
||||
</label>
|
||||
{% if not forloop.last %}
|
||||
</div>
|
||||
<hr class="h-px mx-4 bg-gray-200 border-0 dark:bg-gray-700"/>
|
||||
{% endif %}
|
||||
|
||||
{% endfor %}
|
||||
</article>
|
||||
|
||||
</section>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- Resumen del pedido -->
|
||||
<div class="mx-auto mt-6 max-w-4xl flex-1 space-y-6 lg:mt-0 lg:w-full">
|
||||
<div
|
||||
class="space-y-4 rounded-lg border border-gray-200 bg-white p-4 shadow-sm dark:border-gray-700 dark:bg-gray-800 sm:p-6">
|
||||
<p class="text-xl font-semibold text-gray-900 dark:text-white">
|
||||
{% translate 'Resumen del pedido' %}
|
||||
</p>
|
||||
|
||||
<div class="space-y-4">
|
||||
<div class="space-y-2">
|
||||
<dl class="flex items-center justify-between gap-4">
|
||||
<dt
|
||||
class="text-base font-normal text-gray-500 dark:text-gray-400">
|
||||
{% translate 'Base imponible' %}
|
||||
</dt>
|
||||
<dd class="text-base font-medium text-gray-900 dark:text-white">{{ base_total }} €
|
||||
</dd>
|
||||
</dl>
|
||||
|
||||
<dl class="flex items-center justify-between gap-4">
|
||||
<dt class="text-base font-normal text-gray-500 dark:text-gray-400">
|
||||
{% translate 'Descuentos' %}
|
||||
</dt>
|
||||
<dd class="text-base font-medium text-green-600">-{{ savings }} €</dd>
|
||||
</dl>
|
||||
|
||||
<dl class="flex items-center justify-between gap-4">
|
||||
<dt
|
||||
class="text-base font-normal text-gray-500 dark:text-gray-400">
|
||||
{% translate 'Gastos de envío' %}
|
||||
</dt>
|
||||
<dd class="text-base font-medium text-gray-900 dark:text-white">
|
||||
{{ shipping_cost }} €
|
||||
</dd>
|
||||
</dl>
|
||||
|
||||
<dl class="flex items-center justify-between gap-4">
|
||||
<dt class="text-base font-normal text-gray-500 dark:text-gray-400">
|
||||
{% translate 'Impuestos' %}
|
||||
</dt>
|
||||
<dd class="text-base font-medium text-gray-900 dark:text-white">{{ tax_total }} €
|
||||
</dd>
|
||||
</dl>
|
||||
</div>
|
||||
|
||||
<dl class="flex items-center justify-between gap-4 border-t border-gray-200 pt-2 dark:border-gray-700">
|
||||
<dt class="text-base font-bold text-gray-900 dark:text-white">{% translate 'Total' %}
|
||||
</dt>
|
||||
<dd class="text-base font-bold text-gray-900 dark:text-white">{{ total }} €</dd>
|
||||
</dl>
|
||||
</div>
|
||||
|
||||
<button class="flex w-full items-center justify-center rounded-lg bg-primary-700 px-5 py-2.5 text-sm font-medium text-white hover:bg-primary-800 focus:outline-none focus:ring-4 focus:ring-primary-300 dark:bg-primary-600 dark:hover:bg-primary-700 dark:focus:ring-primary-800 cursor-pointer">
|
||||
{% translate 'Terminar pedido' %}
|
||||
<div class="flex items-center gap-4">
|
||||
<form class="flex" hx-post="{% url 'web:delete_cart_item' pk=item.pk %}"
|
||||
hx-swap="none">
|
||||
{% csrf_token %}
|
||||
<button
|
||||
type="submit"
|
||||
class="inline-flex items-center text-sm font-medium text-red-700 hover:underline cursor-pointer"
|
||||
>
|
||||
{% include 'components/icons/x.svg' %}
|
||||
{% translate 'Quitar' %}
|
||||
</button>
|
||||
|
||||
<div class="flex items-center justify-center gap-2">
|
||||
<span class="text-sm font-normal text-gray-500 dark:text-gray-400"> {% translate 'o' %} </span>
|
||||
<a href="{% url 'web:index' %}" title=""
|
||||
class="inline-flex items-center gap-2 text-sm font-medium text-primary-700 underline hover:no-underline dark:text-primary-400">
|
||||
{% translate 'Seguir comprando' %}
|
||||
</a>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
<label for="counter-input" class="sr-only">{% translate 'Cantidad' %}</label>
|
||||
<div class="flex items-center justify-between md:order-3 md:justify-end">
|
||||
<div class="flex items-center">
|
||||
<span class="w-10 shrink-0 text-center text-sm font-medium focus:outline-none focus:ring-0">
|
||||
{{ item.quantity }}x
|
||||
</span>
|
||||
</div>
|
||||
<div class="text-end md:order-4 md:w-32">
|
||||
<p class="text-base font-bold ">
|
||||
{{ item.product.price.price_with_tax }}€
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
|
||||
{% if items.count == 0 %}
|
||||
<p class="text-base font-normal ">
|
||||
{% translate 'No hay nada en el carrito...' %}
|
||||
</p>
|
||||
<p>
|
||||
<a href="{% url 'web:index' %}" title=""
|
||||
class="inline-flex items-center gap-2 text-sm font-medium text-primary-700 underline hover:no-underline ">
|
||||
{% translate 'Volver a inicio' %}
|
||||
</a>
|
||||
</p>
|
||||
{% endif %}
|
||||
|
||||
<h2 class="text-xl font-semibold sm:text-2xl">
|
||||
{% translate 'Dirección de envío' %}
|
||||
</h2>
|
||||
|
||||
<section class="p-4 rounded-lg">
|
||||
|
||||
<div class="grid gap-4 sm:grid-cols-2 sm:gap-6 my-2">
|
||||
{% if user.is_anonymous %}
|
||||
<div class="sm:col-span-2">
|
||||
<label for="email"
|
||||
class="block mb-2 text-sm font-medium ">
|
||||
{% translate 'E-Mail' %}</label>
|
||||
<input type="text" name="email" id="email"
|
||||
class="input"
|
||||
placeholder="{% translate 'E-Mail' %}"
|
||||
value=""
|
||||
required=""
|
||||
>
|
||||
</div>
|
||||
{% else %}
|
||||
<input type="hidden" name="email" value="{{ user.email }}">
|
||||
{% endif %}
|
||||
<div class="sm:col-span-2">
|
||||
<label for="shipping_address_full_name"
|
||||
class="block mb-2 text-sm font-medium ">
|
||||
{% translate 'Nombre completo' %}</label>
|
||||
<input type="text" name="shipping_address_full_name" id="shipping_address_full_name"
|
||||
class="input"
|
||||
placeholder="{% translate 'Nombre completo' %}"
|
||||
value="{% if shipping_address %}{{ shipping_address.full_name }}{% endif %}"
|
||||
required=""
|
||||
>
|
||||
<label for="shipping_address"
|
||||
class="block my-2 text-sm font-medium ">
|
||||
{% translate 'Dirección' %}</label>
|
||||
<input type="text" name="shipping_address" id="shipping_address"
|
||||
class="input"
|
||||
placeholder="{% translate 'Dirección' %}"
|
||||
value="{% if shipping_address %}{{ shipping_address.address }}{% endif %}"
|
||||
required=""
|
||||
>
|
||||
</div>
|
||||
<div class="w-full">
|
||||
<label for="shipping_address_town"
|
||||
class="block mb-2 text-sm font-medium ">
|
||||
{% translate 'Localidad' %}
|
||||
</label>
|
||||
<input type="text" name="shipping_address_town" id="shipping_address_town"
|
||||
class="input"
|
||||
placeholder="{% translate 'Localidad' %}"
|
||||
value="{% if shipping_address %}{{ shipping_address.address_town }}{% endif %}"
|
||||
required=""
|
||||
>
|
||||
</div>
|
||||
<div class="w-full">
|
||||
<label for="shipping_address_zip"
|
||||
class="block mb-2 text-sm font-medium ">
|
||||
{% translate 'Código postal' %}
|
||||
</label>
|
||||
<input type="text" name="shipping_address_zip" id="shipping_address_zip"
|
||||
class="input"
|
||||
placeholder="{% translate 'Código postal' %}"
|
||||
value="{% if shipping_address %}{{ shipping_address.address_zip }}{% endif %}"
|
||||
required=""
|
||||
>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label for="shipping_address_state"
|
||||
class="block mb-2 text-sm font-medium ">
|
||||
{% translate 'Provincia' %}
|
||||
</label>
|
||||
<input type="text" name="shipping_address_state" id="shipping_address_state"
|
||||
class="input"
|
||||
placeholder="{% translate 'Provincia' %}"
|
||||
value="{% if shipping_address %}{{ shipping_address.address_state }}{% endif %}"
|
||||
required=""
|
||||
>
|
||||
|
||||
</div>
|
||||
<div>
|
||||
<label for="shipping_address_country" class="block mb-2 text-sm font-medium ">
|
||||
{% translate 'País' %}
|
||||
</label>
|
||||
<input type="text" name="shipping_address_country" id="shipping_address_country"
|
||||
class="input"
|
||||
placeholder="{% translate 'País' %}"
|
||||
value="{% if shipping_address %}{{ shipping_address.address_country }}{% endif %}"
|
||||
required=""
|
||||
>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<h2 class="text-xl font-semibold sm:text-2xl">
|
||||
{% translate 'Dirección de facturación' %}
|
||||
</h2>
|
||||
|
||||
<section class="p-4 rounded-lg">
|
||||
|
||||
<div class="grid gap-4 sm:grid-cols-2 sm:gap-6 my-2">
|
||||
<div class="sm:col-span-2">
|
||||
<label for="billing_address_full_name"
|
||||
class="block mb-2 text-sm font-medium ">
|
||||
{% translate 'Nombre completo' %}</label>
|
||||
<input type="text" name="billing_address_full_name" id="billing_address_full_name"
|
||||
class="input"
|
||||
placeholder="{% translate 'Nombre completo' %}"
|
||||
value="{% if billing_address %}{{ billing_address.full_name }}{% endif %}"
|
||||
required=""
|
||||
>
|
||||
<label for="billing_address"
|
||||
class="block my-2 text-sm font-medium ">
|
||||
{% translate 'Dirección' %}
|
||||
</label>
|
||||
<input type="text" name="billing_address" id="billing_address"
|
||||
class="input"
|
||||
placeholder="{% translate 'Dirección' %}"
|
||||
value="{% if billing_address %}{{ billing_address.address }}{% endif %}"
|
||||
required=""
|
||||
>
|
||||
</div>
|
||||
<div class="w-full">
|
||||
<label for="billing_address_town"
|
||||
class="block mb-2 text-sm font-medium ">
|
||||
{% translate 'Localidad' %}
|
||||
</label>
|
||||
<input type="text" name="billing_address_town" id="billing_address_town"
|
||||
class="input"
|
||||
placeholder="{% translate 'Localidad' %}"
|
||||
value="{% if billing_address %}{{ billing_address.address_town }}{% endif %}"
|
||||
required=""
|
||||
>
|
||||
</div>
|
||||
<div class="w-full">
|
||||
<label for="billing_address_zip"
|
||||
class="block mb-2 text-sm font-medium ">
|
||||
{% translate 'Código postal' %}
|
||||
</label>
|
||||
<input type="text" name="billing_address_zip" id="billing_address_zip"
|
||||
class="input"
|
||||
placeholder="{% translate 'Código postal' %}"
|
||||
value="{% if billing_address %}{{ billing_address.address_zip }}{% endif %}"
|
||||
required=""
|
||||
>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label for="billing_address_state"
|
||||
class="block mb-2 text-sm font-medium ">
|
||||
{% translate 'Provincia' %}
|
||||
</label>
|
||||
<input type="text" name="billing_address_state" id="billing_address_state"
|
||||
class="input"
|
||||
placeholder="{% translate 'Provincia' %}"
|
||||
value="{% if billing_address %}{{ billing_address.address_state }}{% endif %}"
|
||||
required=""
|
||||
>
|
||||
|
||||
</div>
|
||||
<div>
|
||||
<label for="billing_address_country"
|
||||
class="block mb-2 text-sm font-medium ">
|
||||
{% translate 'País' %}
|
||||
</label>
|
||||
<input type="text" name="billing_address_country" id="billing_address_country"
|
||||
class="input"
|
||||
placeholder="{% translate 'País' %}"
|
||||
value="{% if billing_address %}{{ billing_address.address_country }}{% endif %}"
|
||||
required=""
|
||||
>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h2 class="text-xl mb-4 font-semibold sm:text-2xl">
|
||||
{% translate 'Opciones de envío' %}
|
||||
</h2>
|
||||
<article class="rounded-lg">
|
||||
|
||||
{% for shipping_method in shipping_methods %}
|
||||
<div class="p-4">
|
||||
<input type="radio" id="shipping_method_{{ shipping_method.pk }}"
|
||||
name="shipping_method"
|
||||
value="{{ shipping_method.pk }}" {% if forloop.first %}checked{% endif %}>
|
||||
<label for="shipping_method_{{ shipping_method.pk }}"
|
||||
class=" ">
|
||||
{{ shipping_method.name }} - {{ shipping_method.shipping_product.price.price_with_tax }}€
|
||||
</label>
|
||||
{% if not forloop.last %}
|
||||
</div>
|
||||
<hr class="h-px mx-4"/>
|
||||
{% endif %}
|
||||
|
||||
{% endfor %}
|
||||
</article>
|
||||
</section>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Resumen del pedido -->
|
||||
<div class="mx-auto mt-6 max-w-4xl flex-1 space-y-6 lg:mt-0 lg:w-full">
|
||||
<div
|
||||
class="space-y-4 rounded-lg p-4 shadow-sm sm:p-6">
|
||||
<p class="text-xl font-semibold ">
|
||||
{% translate 'Resumen del pedido' %}
|
||||
</p>
|
||||
|
||||
<div class="space-y-4">
|
||||
<div class="space-y-2">
|
||||
<dl class="flex items-center justify-between gap-4">
|
||||
<dt
|
||||
class="text-base font-normal ">
|
||||
{% translate 'Base imponible' %}
|
||||
</dt>
|
||||
<dd class="text-base font-medium ">{{ base_total }} €
|
||||
</dd>
|
||||
</dl>
|
||||
|
||||
<dl class="flex items-center justify-between gap-4">
|
||||
<dt class="text-base font-normal ">
|
||||
{% translate 'Descuentos' %}
|
||||
</dt>
|
||||
<dd class="text-base font-medium text-green-600">-{{ savings }} €</dd>
|
||||
</dl>
|
||||
|
||||
<dl class="flex items-center justify-between gap-4">
|
||||
<dt class="text-base font-normal">
|
||||
{% translate 'Gastos de envío' %}
|
||||
</dt>
|
||||
<dd class="text-base font-medium ">
|
||||
{{ shipping_cost }} €
|
||||
</dd>
|
||||
</dl>
|
||||
|
||||
<dl class="flex items-center justify-between gap-4">
|
||||
<dt class="text-base font-normal ">
|
||||
{% translate 'Impuestos' %}
|
||||
</dt>
|
||||
<dd class="text-base font-medium ">{{ tax_total }} €
|
||||
</dd>
|
||||
</dl>
|
||||
</div>
|
||||
|
||||
<dl class="flex items-center justify-between gap-4 pt-2 ">
|
||||
<dt class="text-base font-bold ">{% translate 'Total' %}
|
||||
</dt>
|
||||
<dd class="text-base font-bold ">{{ total }} €</dd>
|
||||
</dl>
|
||||
</div>
|
||||
|
||||
<button
|
||||
class="flex w-full items-center justify-center rounded-lg px-5 py-2.5 text-sm font-medium text-white hover: focus:outline-none focus:ring-4 focus:ring-primary-300 : :ring-primary-800 cursor-pointer">
|
||||
{% translate 'Terminar pedido' %}
|
||||
</button>
|
||||
|
||||
<div class="flex items-center justify-center gap-2">
|
||||
<span class="text-sm font-normal "> {% translate 'o' %} </span>
|
||||
<a href="{% url 'web:index' %}" title=""
|
||||
class="inline-flex items-center gap-2 text-sm font-medium text-primary-700 underline hover:no-underline ">
|
||||
{% translate 'Seguir comprando' %}
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</form>
|
||||
</section>
|
||||
@@ -16,30 +16,30 @@
|
||||
>
|
||||
<div>
|
||||
{% if cart.items.count == 0 %}
|
||||
<h2 class="text-sm font-medium text-gray-900 dark:text-white">No hay nada en el carrito</h2>
|
||||
<h2 class="text-sm font-medium ">No hay nada en el carrito</h2>
|
||||
{% endif %}
|
||||
|
||||
{% for cart_item in cart.items.all %}
|
||||
<div>
|
||||
<a href="{% url 'web:product_detail' pk=cart_item.product.pk slug=cart_item.product.slug %}"
|
||||
class="text-sm font-semibold leading-none text-gray-900 dark:text-white hover:underline">
|
||||
class="text-sm font-semibold leading-none hover:underline">
|
||||
{{ cart_item.product.name }}
|
||||
</a>
|
||||
|
||||
<div class="flex items-center justify-between gap-6">
|
||||
<p
|
||||
class="mt-0.5 truncate text-sm font-normal text-gray-500 dark:text-gray-400">
|
||||
class="mt-0.5 truncate text-sm font-normal ">
|
||||
{{ cart_item.product.price.price_with_tax }}€
|
||||
</p>
|
||||
|
||||
<form hx-post="{% url 'web:delete_cart_item' pk=cart_item.pk %}"
|
||||
hx-swap="none">
|
||||
<span class="mt-0.5 truncate text-sm font-normal text-gray-500 dark:text-gray-400 mr-2">
|
||||
<span class="mt-0.5 truncate text-sm font-normal mr-2">
|
||||
{% translate 'Cantidad' %}: {{ cart_item.quantity }}
|
||||
|
||||
</span>
|
||||
<button data-tooltip-target="tooltipRemoveItem1a" type="submit"
|
||||
class="text-red-600 hover:text-red-700 dark:text-red-500 dark:hover:text-red-600 cursor-pointer"
|
||||
class="text-red-600 hover:text-red-700 :text-red-600 cursor-pointer"
|
||||
>
|
||||
{% csrf_token %}
|
||||
<span class="sr-only">{% translate 'Quitar' %}</span>
|
||||
@@ -48,21 +48,21 @@
|
||||
</form>
|
||||
|
||||
<div id="tooltipRemoveItem1a" role="tooltip"
|
||||
class="tooltip invisible absolute z-10 inline-block rounded-lg bg-gray-900 px-3 py-2 text-sm font-medium
|
||||
text-white opacity-0 shadow-sm transition-opacity duration-300 dark:bg-gray-700"
|
||||
class="tooltip invisible absolute z-10 inline-block rounded-lg px-3 py-2 text-sm font-medium
|
||||
text-white opacity-0 shadow-sm transition-opacity duration-300 "
|
||||
>
|
||||
{% translate 'Quitar del carrito' %}
|
||||
<div class="tooltip-arrow" data-popper-arrow></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<hr class="h-px mx-4 my-2 bg-gray-200 border-0 dark:bg-gray-700" />
|
||||
<hr class="h-px mx-4 my-2 " />
|
||||
{% endfor %}
|
||||
</div>
|
||||
|
||||
{% if cart.items.count > 0 %}
|
||||
<a href="{% url 'web:cart_detail' %}"
|
||||
class="button-primary"
|
||||
class="btn btn-primary"
|
||||
role="button"> {% translate 'Ver carrito' %}
|
||||
</a>
|
||||
{% endif %}
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
{% for field in form %}
|
||||
<div class="mb-4">
|
||||
<label for="{{ field.id_for_label }}"
|
||||
class="inline-block text-sm font-medium text-gray-900 dark:text-white ml-2">
|
||||
class="inline-block text-sm font-medium ml-2">
|
||||
{{ field.label }}
|
||||
</label>
|
||||
{{ field }}
|
||||
@@ -13,17 +13,17 @@
|
||||
{% endfor %}
|
||||
|
||||
{% for k, error in form.errors.items %}
|
||||
<span class="flex justify-center mb-2 text-sm font-medium text-red-900 dark:text-red-400">{{ error }}</span>
|
||||
<span class="flex justify-center mb-2 text-sm font-medium text-red-900 ">{{ error }}</span>
|
||||
{% endfor %}
|
||||
|
||||
{% if success_message %}
|
||||
<span class="flex justify-center mb-2 text-sm font-medium text-red-900 dark:text-red-400">{{ success_message }}</span>
|
||||
<span class="flex justify-center mb-2 text-sm font-medium text-red-900 ">{{ success_message }}</span>
|
||||
{% endif %}
|
||||
|
||||
<footer class="flex justify-end">
|
||||
<button class="text-white bg-primary-600 hover:bg-primary-700 focus:ring-4 focus:outline-none
|
||||
focus:ring-primary-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-primary-600
|
||||
dark:hover:bg-primary-700 dark:focus:ring-primary-800 cursor-pointer"
|
||||
<button class="text-white hover: focus:ring-4 focus:outline-none
|
||||
focus:ring-primary-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center
|
||||
: :ring-primary-800 cursor-pointer"
|
||||
>
|
||||
{{ save_button_text }}
|
||||
</button>
|
||||
|
||||
@@ -1,102 +1,26 @@
|
||||
{% load i18n %}
|
||||
{% load static %}
|
||||
<nav class="navbar-bg">
|
||||
<!-- Left side -->
|
||||
<div class="navbar-content">
|
||||
<div class="navbar-align">
|
||||
<nav class="navbar bg-base-100 shadow-sm">
|
||||
<div class="flex-1">
|
||||
|
||||
<!-- Title -->
|
||||
<div class="navbar-title">
|
||||
<div class="shrink-0">
|
||||
<a class="flex flex-row items-center" href="{% url 'web:index' %}">
|
||||
<img class="w-8 h-8 mr-2" src="{{ logo }}" alt="{{ web_title }} logo">
|
||||
<h1 class="navbar-web-title">{{ web_title }}</h1>
|
||||
</a>
|
||||
</div>
|
||||
<a href="{% url 'web:index' %}" class="flex text-xl">
|
||||
<img class="mr-4" src="{{ logo }}" alt="{{ web_title }} logo">
|
||||
{{ web_title }}
|
||||
</a>
|
||||
|
||||
<!-- Categories -->
|
||||
<ul class="navbar-categories">
|
||||
<li>
|
||||
<a href="{% url 'web:index' %}" title=""
|
||||
class="navbar-category-link">
|
||||
{% translate 'Inicio' %}
|
||||
</a>
|
||||
</li>
|
||||
{% for category in navbar_categories %}
|
||||
<li class="shrink-0">
|
||||
<a href="{% url 'web:category_view' slug=category.slug %}" title=""
|
||||
class="navbar-category-link">
|
||||
{{ category.name }}
|
||||
</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Right side -->
|
||||
<div class="relative flex items-center lg:space-x-2">
|
||||
<div class="flex gap-2">
|
||||
<input type="text" placeholder="{% trans 'Buscar...' %}" class="input input-bordered w-24 md:w-auto"/>
|
||||
|
||||
{% include 'components/theme-switch.html' %}
|
||||
<!-- Show/Hide cart -->
|
||||
<div id="navbar-cart-dropdown" hx-get="{% url 'web:cart_dropdown' %}"
|
||||
hx-trigger="load, updated-cart from:body"></div>
|
||||
|
||||
{% if request.user.is_authenticated %}
|
||||
<!-- Show/Hide user account dropdown -->
|
||||
<button
|
||||
hx-on:click="htmx.toggleClass(htmx.find('#userDropdown1'), 'hidden'); htmx.addClass(htmx.find('#myCartDropdown1'), 'hidden')"
|
||||
id="userDropdownButton1"
|
||||
data-dropdown-toggle="userDropdown1" type="button"
|
||||
aria-label="show menu"
|
||||
class="icon-button">
|
||||
{% include 'components/icons/user.svg' %}
|
||||
<span class="hidden sm:flex">
|
||||
{% translate 'Mi cuenta' %}
|
||||
</span>
|
||||
{% include 'components/icons/dropdown.svg' %}
|
||||
</button>
|
||||
|
||||
<!-- User account dropdown -->
|
||||
<div id="userDropdown1"
|
||||
class="absolute top-12 hidden z-12 w-56 divide-y divide-gray-100 overflow-hidden overflow-y-auto rounded-lg bg-white antialiased shadow dark:divide-gray-600 dark:bg-gray-700 right-0">
|
||||
{% include 'components/users/user_dropdown.html' %}
|
||||
</div>
|
||||
{% else %}
|
||||
<a href="{% url 'web:login' %}"
|
||||
class="link-button">
|
||||
{% translate 'Inicia sesión' %}
|
||||
</a>
|
||||
{% endif %}
|
||||
|
||||
<!-- Show/Hide menu items -->
|
||||
<button hx-on:click="htmx.toggleClass(htmx.find('#ecommerce-navbar-menu-1'), 'hidden')" type="button"
|
||||
data-collapse-toggle="ecommerce-navbar-menu-1" aria-controls="ecommerce-navbar-menu-1"
|
||||
aria-expanded="false"
|
||||
aria-label="show menu"
|
||||
class="icon-button lg:hidden">
|
||||
<span class="sr-only">
|
||||
{% translate 'Abrir menú' %}
|
||||
</span>
|
||||
{% include 'components/icons/burger.svg' %}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="ecommerce-navbar-menu-1"
|
||||
class="navbar-dropdown-menu hidden">
|
||||
<ul class="navbar-dropdown-menu-list">
|
||||
<li>
|
||||
<a href="{% url 'web:index' %}"
|
||||
class="navbar-dropdown-menu-title">{% translate 'Inicio' %}</a>
|
||||
</li>
|
||||
|
||||
{% for category in navbar_categories %}
|
||||
<li>
|
||||
<a href="{% url 'web:category_view' slug=category.slug %}"
|
||||
class="navbar-dropdown-menu-title">{{ category.name }}</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
{% include 'components/generic/theme-switch.html' %}
|
||||
{% if user.is_authenticated %}
|
||||
{% include 'components/generic/user_dropdown.html' %}
|
||||
{% else %}
|
||||
<a href="{% url 'users:login' %}"
|
||||
class="link-button flex items-center">
|
||||
{% translate 'Inicia sesión' %}
|
||||
</a>
|
||||
{% endif %}
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
{% load i18n %}
|
||||
<div role="status">
|
||||
<svg aria-hidden="true" class="w-8 h-8 text-gray-200 animate-spin dark:text-gray-600 fill-primary-600"
|
||||
<svg aria-hidden="true" class="w-8 h-8 animate-spin fill-primary-600"
|
||||
viewBox="0 0 100 101" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="M100 50.5908C100 78.2051 77.6142 100.591 50 100.591C22.3858 100.591 0 78.2051 0 50.5908C0 22.9766 22.3858 0.59082 50 0.59082C77.6142 0.59082 100 22.9766 100 50.5908ZM9.08144 50.5908C9.08144 73.1895 27.4013 91.5094 50 91.5094C72.5987 91.5094 90.9186 73.1895 90.9186 50.5908C90.9186 27.9921 72.5987 9.67226 50 9.67226C27.4013 9.67226 9.08144 27.9921 9.08144 50.5908Z"
|
||||
|
||||
+1
-1
@@ -3,7 +3,7 @@
|
||||
id="theme-toggle"
|
||||
type="button"
|
||||
aria-label="switchtheme"
|
||||
class="icon-button">
|
||||
class="btn btn-circle">
|
||||
{% include 'components/icons/moon.svg' %}
|
||||
{% include 'components/icons/sun.svg' %}
|
||||
</button>
|
||||
@@ -1,8 +1,8 @@
|
||||
<div id="toast-default"
|
||||
class="flex items-center w-full max-w-xs p-4 text-gray-500 bg-white rounded-lg shadow dark:text-gray-400 dark:bg-gray-800"
|
||||
class="flex items-center w-full max-w-xs p-4 rounded-lg shadow "
|
||||
role="alert"
|
||||
>
|
||||
<div class="inline-flex items-center justify-center flex-shrink-0 w-8 h-8 text-blue-500 bg-blue-100 rounded-lg dark:bg-blue-800 dark:text-blue-200">
|
||||
<div class="inline-flex items-center justify-center flex-shrink-0 w-8 h-8 text-blue-500 rounded-lg ">
|
||||
{% block icon %}
|
||||
|
||||
{% endblock %}
|
||||
@@ -11,9 +11,9 @@
|
||||
{% block toast_text %}{% endblock %}
|
||||
</div>
|
||||
<button type="button"
|
||||
class="ms-auto -mx-1.5 -my-1.5 bg-white text-gray-400 hover:text-gray-900 rounded-lg focus:ring-2
|
||||
focus:ring-gray-300 p-1.5 hover:bg-gray-100 inline-flex items-center justify-center h-8 w-8
|
||||
dark:text-gray-500 dark:hover:text-white dark:bg-gray-800 dark:hover:bg-gray-700 cursor-pointer"
|
||||
class="ms-auto -mx-1.5 -my-1.5 hover: rounded-lg focus:ring-2
|
||||
focus:ring-gray-300 p-1.5 hover: inline-flex items-center justify-center h-8 w-8
|
||||
:text-white : cursor-pointer"
|
||||
data-dismiss-target="#toast-default" aria-label="Close"
|
||||
hx-on:click="htmx.toggleClass(htmx.find('#toast-default'), 'hidden')"
|
||||
>
|
||||
|
||||
@@ -0,0 +1,19 @@
|
||||
{% load i18n %}
|
||||
<div class="dropdown dropdown-end">
|
||||
<div tabindex="0" role="button" class="btn btn-circle avatar">
|
||||
<div class="w-10 flex rounded-full justify-center items-center">
|
||||
{{ request.user.first_name.0 | upper }}{{ request.user.last_name.0 | upper }}
|
||||
</div>
|
||||
</div>
|
||||
<ul
|
||||
tabindex="-1"
|
||||
class="menu menu-sm dropdown-content bg-base-100 rounded-box z-1 mt-3 w-52 p-2 shadow">
|
||||
<li>
|
||||
<a class="justify-between" href="{% url 'users:my_account' %}">
|
||||
{% trans 'Mi cuenta' %}
|
||||
</a>
|
||||
</li>
|
||||
<li><a>{% trans 'Ajustes' %}</a></li>
|
||||
<li><a href="{% url 'users:logout' %}">{% trans 'Cerrar sesión' %}</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
@@ -1,12 +1,12 @@
|
||||
{% load i18n %}
|
||||
<article>
|
||||
<div
|
||||
class="card">
|
||||
<div class="h-56 w-full bg-gray-200 dark:bg-gray-950">
|
||||
>
|
||||
<div class="h-56 w-full ">
|
||||
<a href="{% url 'web:product_detail' pk=product.pk slug=product.slug %}">
|
||||
<img class="mx-auto h-full dark:hidden" src="{{ product.images.all.0.m.url }}"
|
||||
<img class="mx-auto h-full " src="{{ product.images.all.0.m.url }}"
|
||||
alt="{{ product.name }}"/>
|
||||
<img class="mx-auto hidden h-full dark:block" src="{{ product.images.all.0.m_dark.url }}"
|
||||
<img class="mx-auto hidden h-full " src="{{ product.images.all.0.m_dark.url }}"
|
||||
alt="{{ product.name }}"/>
|
||||
</a>
|
||||
</div>
|
||||
@@ -24,8 +24,8 @@
|
||||
<!-- {% include 'components/icons/star.svg' %}-->
|
||||
<!-- </div>-->
|
||||
|
||||
<!-- <p class="text-sm font-medium text-gray-900 dark:text-white">5.0</p>-->
|
||||
<!-- <p class="text-sm font-medium text-gray-500 dark:text-gray-400">(455)</p>-->
|
||||
<!-- <p class="text-sm font-medium ">5.0</p>-->
|
||||
<!-- <p class="text-sm font-medium ">(455)</p>-->
|
||||
<!-- </div>-->
|
||||
<div class="mt-4 flex gap-4">
|
||||
<p class="txt-2xl">
|
||||
|
||||
@@ -1,7 +1,7 @@
|
||||
{% load i18n %}
|
||||
<section class="bg-gray-50 dark:bg-gray-900 flex items-center my-4">
|
||||
<section class=" flex items-center my-4">
|
||||
<div class="max-w-screen-xl px-4 mx-auto lg:px-12 w-full">
|
||||
<div class="relative bg-white shadow-md dark:bg-gray-800 sm:rounded-lg">
|
||||
<div class="relative shadow-md sm:rounded-lg">
|
||||
<div class="flex flex-col items-center justify-between p-4 space-y-3 md:flex-row md:space-y-0 md:space-x-4">
|
||||
<div class="w-full md:w-full">
|
||||
<form class="flex items-center"
|
||||
@@ -11,19 +11,27 @@
|
||||
hx-swap="innerHTML"
|
||||
hx-push="true"
|
||||
>
|
||||
<label for="simple-search" class="sr-only">{% translate 'Buscar' %}</label>
|
||||
<div class="relative w-full">
|
||||
<div class="absolute inset-y-0 left-0 flex items-center pl-3 pointer-events-none">
|
||||
{% include 'components/icons/search.svg' %}
|
||||
</div>
|
||||
<label for="simple-search" class="input w-full">
|
||||
<svg class="h-[1em] opacity-50" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
|
||||
<g
|
||||
stroke-linejoin="round"
|
||||
stroke-linecap="round"
|
||||
stroke-width="2.5"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
>
|
||||
<circle cx="11" cy="11" r="8"></circle>
|
||||
<path d="m21 21-4.3-4.3"></path>
|
||||
</g>
|
||||
</svg>
|
||||
<input
|
||||
type="text"
|
||||
type="search"
|
||||
name="name"
|
||||
id="simple-search"
|
||||
class="search-input"
|
||||
placeholder="{% translate 'Buscar' %}"
|
||||
autocomplete="off">
|
||||
</div>
|
||||
</label>
|
||||
|
||||
{% if filter_by_category %}
|
||||
<input type="hidden" name="category" value="{{ category.id }}">
|
||||
{% endif %}
|
||||
|
||||
@@ -5,7 +5,7 @@
|
||||
{% for field in form %}
|
||||
<div class="mb-4">
|
||||
<label for="{{ field.id_for_label }}"
|
||||
class="inline-block text-sm font-medium text-gray-900 dark:text-white ml-2">
|
||||
class="inline-block text-sm font-medium ml-2">
|
||||
{{ field.label }}
|
||||
</label>
|
||||
{{ field }}
|
||||
@@ -13,12 +13,12 @@
|
||||
{% endfor %}
|
||||
|
||||
{% for k, error in form.errors.items %}
|
||||
<span class="flex justify-center mb-2 text-sm font-medium text-red-900 dark:text-red-400">{{ error }}</span>
|
||||
<span class="flex justify-center mb-2 text-sm font-medium text-red-900 ">{{ error }}</span>
|
||||
{% endfor %}
|
||||
|
||||
<button class="text-white bg-primary-600 hover:bg-primary-700 focus:ring-4 focus:outline-none
|
||||
focus:ring-primary-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-primary-600
|
||||
dark:hover:bg-primary-700 dark:focus:ring-primary-800 cursor-pointer"
|
||||
<button class="text-white hover: focus:ring-4 focus:outline-none
|
||||
focus:ring-primary-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center
|
||||
: :ring-primary-800 cursor-pointer"
|
||||
>
|
||||
{% translate 'Guardar' %}
|
||||
</button>
|
||||
|
||||
@@ -12,71 +12,65 @@
|
||||
<div class="mb-4 grid gap-4 sm:grid-cols-2 sm:gap-8 lg:gap-16">
|
||||
<div class="space-y-4">
|
||||
<dl>
|
||||
<dt class="font-semibold text-gray-900 dark:text-white">
|
||||
<dt class="font-semibold ">
|
||||
<label for="address_full_name">
|
||||
{% translate 'Nombre completo' %}
|
||||
</label>
|
||||
</dt>
|
||||
<dd class="flex items-center gap-1 text-gray-500 dark:text-gray-400">
|
||||
<input class="input-text"
|
||||
id="address_full_name" name="full_name" type="text" value="{{ address.full_name }}">
|
||||
<dd class="flex items-center gap-1 ">
|
||||
<input class="input" id="address_full_name" name="full_name" type="text" value="{{ address.full_name }}">
|
||||
</dd>
|
||||
</dl>
|
||||
<dl>
|
||||
<dt class="font-semibold text-gray-900 dark:text-white">
|
||||
<dt class="font-semibold ">
|
||||
<label for="address">
|
||||
{% translate 'Dirección' %}
|
||||
</label>
|
||||
</dt>
|
||||
<dd class="flex items-center gap-1 text-gray-500 dark:text-gray-400">
|
||||
<input class="input-text"
|
||||
id="address" name="address" type="text" value="{{ address.address }}">
|
||||
<dd class="flex items-center gap-1 ">
|
||||
<input class="input" id="address" name="address" type="text" value="{{ address.address }}">
|
||||
</dd>
|
||||
</dl>
|
||||
<dl>
|
||||
<dt class="font-semibold text-gray-900 dark:text-white">
|
||||
<dt class="font-semibold ">
|
||||
<label for="address_zip">
|
||||
{% translate 'Código postal' %}
|
||||
</label>
|
||||
</dt>
|
||||
<dd class="text-gray-500 dark:text-gray-400">
|
||||
<input class="input-text"
|
||||
id="address_zip" name="address_zip" type="text" value="{{ address.address_zip }}">
|
||||
<dd class=" ">
|
||||
<input class="input" id="address_zip" name="address_zip" type="text" value="{{ address.address_zip }}">
|
||||
</dd>
|
||||
</dl>
|
||||
<dl>
|
||||
<dt class="font-semibold text-gray-900 dark:text-white">
|
||||
<dt class="font-semibold ">
|
||||
<label for="address_phone">
|
||||
{% translate 'Teléfono' %}
|
||||
</label>
|
||||
</dt>
|
||||
<dd class="text-gray-500 dark:text-gray-400">
|
||||
<input class="input-text"
|
||||
id="address_phone" name="address_phone" type="text" value="{{ address.address_phone }}">
|
||||
<dd class=" ">
|
||||
<input class="input" id="address_phone" name="address_phone" type="text" value="{{ address.address_phone }}">
|
||||
</dd>
|
||||
</dl>
|
||||
</div>
|
||||
<div class="space-y-4">
|
||||
<dl>
|
||||
<dt class="font-semibold text-gray-900 dark:text-white">
|
||||
<dt class="font-semibold ">
|
||||
<label for="address_town">
|
||||
{% translate 'Localidad' %}
|
||||
</label>
|
||||
</dt>
|
||||
<dd class="text-gray-500 dark:text-gray-400">
|
||||
<input class="input-text"
|
||||
id="address_town" name="address_town" type="text" value="{{ address.address_town }}">
|
||||
<dd class=" ">
|
||||
<input class="input" id="address_town" name="address_town" type="text" value="{{ address.address_town }}">
|
||||
</dd>
|
||||
</dl>
|
||||
<dl>
|
||||
<dt class="font-semibold text-gray-900 dark:text-white">
|
||||
<dt class="font-semibold ">
|
||||
<label for="address_state">
|
||||
{% translate 'Provincia' %}
|
||||
</label>
|
||||
</dt>
|
||||
<dd class="text-gray-500 dark:text-gray-400">
|
||||
<input class="input-text"
|
||||
id="address_state" name="address_state" type="text" value="{{ address.address_state }}">
|
||||
<dd class=" ">
|
||||
<input class="input" id="address_state" name="address_state" type="text" value="{{ address.address_state }}">
|
||||
</dd>
|
||||
</dl>
|
||||
</div>
|
||||
@@ -84,9 +78,9 @@
|
||||
|
||||
|
||||
<div class="flex justify-end">
|
||||
<button class="text-white bg-primary-600 hover:bg-primary-700 focus:ring-4 focus:outline-none
|
||||
focus:ring-primary-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-primary-600
|
||||
dark:hover:bg-primary-700 dark:focus:ring-primary-800 cursor-pointer"
|
||||
<button class="text-white hover: focus:ring-4 focus:outline-none
|
||||
focus:ring-primary-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center
|
||||
: :ring-primary-800 cursor-pointer"
|
||||
>
|
||||
{% translate 'Guardar' %}
|
||||
</button>
|
||||
@@ -98,34 +92,34 @@
|
||||
<div class="mb-4 grid gap-4 sm:grid-cols-2 sm:gap-8 lg:gap-16">
|
||||
<div class="space-y-4">
|
||||
<dl>
|
||||
<dt class="font-semibold text-gray-900 dark:text-white">{% translate 'Nombre completo' %}</dt>
|
||||
<dd class="flex items-center gap-1 text-gray-500 dark:text-gray-400">
|
||||
<dt class="font-semibold ">{% translate 'Nombre completo' %}</dt>
|
||||
<dd class="flex items-center gap-1 ">
|
||||
{{ address.full_name }}
|
||||
</dd>
|
||||
</dl>
|
||||
<dl>
|
||||
<dt class="font-semibold text-gray-900 dark:text-white">{% translate 'Dirección' %}</dt>
|
||||
<dd class="flex items-center gap-1 text-gray-500 dark:text-gray-400">
|
||||
<dt class="font-semibold ">{% translate 'Dirección' %}</dt>
|
||||
<dd class="flex items-center gap-1 ">
|
||||
{{ address.address }}
|
||||
</dd>
|
||||
</dl>
|
||||
<dl>
|
||||
<dt class="font-semibold text-gray-900 dark:text-white">{% translate 'Código postal' %}</dt>
|
||||
<dd class="text-gray-500 dark:text-gray-400">{{ address.address_zip }}</dd>
|
||||
<dt class="font-semibold ">{% translate 'Código postal' %}</dt>
|
||||
<dd class=" ">{{ address.address_zip }}</dd>
|
||||
</dl>
|
||||
<dl>
|
||||
<dt class="font-semibold text-gray-900 dark:text-white">{% translate 'Teléfono' %}</dt>
|
||||
<dd class="text-gray-500 dark:text-gray-400">{{ address.address_phone }}</dd>
|
||||
<dt class="font-semibold ">{% translate 'Teléfono' %}</dt>
|
||||
<dd class=" ">{{ address.address_phone }}</dd>
|
||||
</dl>
|
||||
</div>
|
||||
<div class="space-y-4">
|
||||
<dl>
|
||||
<dt class="font-semibold text-gray-900 dark:text-white">{% translate 'Localidad' %}</dt>
|
||||
<dd class="text-gray-500 dark:text-gray-400">{{ address.address_town }}</dd>
|
||||
<dt class="font-semibold ">{% translate 'Localidad' %}</dt>
|
||||
<dd class=" ">{{ address.address_town }}</dd>
|
||||
</dl>
|
||||
<dl>
|
||||
<dt class="font-semibold text-gray-900 dark:text-white">{% translate 'Provincia' %}</dt>
|
||||
<dd class="text-gray-500 dark:text-gray-400">{{ address.address_state }}</dd>
|
||||
<dt class="font-semibold ">{% translate 'Provincia' %}</dt>
|
||||
<dd class=" ">{{ address.address_state }}</dd>
|
||||
</dl>
|
||||
</div>
|
||||
</div>
|
||||
@@ -133,9 +127,9 @@
|
||||
<button hx-on:click="htmx.toggleClass(htmx.find('#edit_address_{{ address.pk }}'), 'hidden'); htmx.toggleClass(htmx.find('#details_address_{{ address.pk }}'), 'hidden')"
|
||||
type="button"
|
||||
data-modal-target="accountInformationModal2" data-modal-toggle="accountInformationModal2"
|
||||
class="inline-flex w-full items-center justify-center rounded-lg bg-primary-700 px-5 py-2.5 text-sm
|
||||
font-medium text-white hover:bg-primary-800 focus:outline-none focus:ring-4 focus:ring-primary-300
|
||||
dark:bg-primary-600 dark:hover:bg-primary-700 dark:focus:ring-primary-800 sm:w-auto cursor-pointer"
|
||||
class="inline-flex w-full items-center justify-center rounded-lg px-5 py-2.5 text-sm
|
||||
font-medium text-white hover: focus:outline-none focus:ring-4 focus:ring-primary-300
|
||||
: :ring-primary-800 sm:w-auto cursor-pointer"
|
||||
>
|
||||
{% include 'components/icons/edit.svg' %}
|
||||
{% translate 'Editar datos' %}
|
||||
@@ -143,6 +137,6 @@
|
||||
</div>
|
||||
</div>
|
||||
{% if not forloop.last %}
|
||||
<hr class="h-px my-2 bg-gray-200 border-0 dark:bg-gray-700">
|
||||
<hr class="h-px my-2 ">
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
|
||||
@@ -1,28 +1,28 @@
|
||||
{% load i18n %}
|
||||
<ul class="p-2 text-start text-sm font-medium text-gray-900 dark:text-white">
|
||||
<ul class="p-2 text-start text-sm font-medium ">
|
||||
<li>
|
||||
<a href="{% url 'web:my_account' %}" title=""
|
||||
class="inline-flex w-full items-center gap-2 rounded-md px-3 py-2 text-sm hover:bg-gray-100 dark:hover:bg-gray-600">
|
||||
<a href="{% url 'users:my_account' %}" title=""
|
||||
class="inline-flex w-full items-center gap-2 rounded-md px-3 py-2 text-sm hover: :">
|
||||
{% translate 'Mi cuenta' %}
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="{% url 'web:orders' %}" title=""
|
||||
class="inline-flex w-full items-center gap-2 rounded-md px-3 py-2 text-sm hover:bg-gray-100 dark:hover:bg-gray-600">
|
||||
class="inline-flex w-full items-center gap-2 rounded-md px-3 py-2 text-sm hover: :">
|
||||
{% translate 'Mis pedidos' %}
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a href="{% url 'web:wishlist' %}" title=""
|
||||
class="inline-flex w-full items-center gap-2 rounded-md px-3 py-2 text-sm hover:bg-gray-100 dark:hover:bg-gray-600">
|
||||
class="inline-flex w-full items-center gap-2 rounded-md px-3 py-2 text-sm hover: :">
|
||||
{% translate 'Lista de deseados' %}
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<div class="p-2 text-sm font-medium text-gray-900 dark:text-white">
|
||||
<a href="{% url 'web:logout' %}" title=""
|
||||
class="inline-flex w-full items-center gap-2 rounded-md px-3 py-2 text-sm hover:bg-gray-100 dark:hover:bg-gray-600">
|
||||
<div class="p-2 text-sm font-medium ">
|
||||
<a href="{% url 'users:logout' %}" title=""
|
||||
class="inline-flex w-full items-center gap-2 rounded-md px-3 py-2 text-sm hover: :">
|
||||
{% translate 'Cerrar sesión' %}
|
||||
</a>
|
||||
</div>
|
||||
|
||||
@@ -12,27 +12,15 @@
|
||||
<link rel="shortcut icon" type="image/png" href="{% static 'favicon.ico' %}"/>
|
||||
<script src="https://unpkg.com/htmx.org@2.0.3"></script>
|
||||
|
||||
<!-- Shoelace -->
|
||||
<link
|
||||
rel="stylesheet"
|
||||
media="(prefers-color-scheme:light)"
|
||||
href="https://cdn.jsdelivr.net/npm/@shoelace-style/shoelace@2.19.1/cdn/themes/light.css"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
media="(prefers-color-scheme:dark)"
|
||||
href="https://cdn.jsdelivr.net/npm/@shoelace-style/shoelace@2.19.1/cdn/themes/dark.css"
|
||||
onload="document.documentElement.classList.add('sl-theme-dark');"
|
||||
/>
|
||||
<script type="module"
|
||||
src="https://cdn.jsdelivr.net/npm/@shoelace-style/shoelace@2.19.1/cdn/shoelace-autoloader.js"></script>
|
||||
|
||||
<link href="https://cdn.jsdelivr.net/npm/daisyui@5" rel="stylesheet" type="text/css" />
|
||||
<script src="https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4"></script>
|
||||
<link href="https://cdn.jsdelivr.net/npm/daisyui@5/themes.css" rel="stylesheet" type="text/css" />
|
||||
|
||||
<link rel="stylesheet" href="{% static 'css/styles.css' %}">
|
||||
{% block extra_js %}
|
||||
{% endblock %}
|
||||
</head>
|
||||
<body class="bg-gray-50 dark:bg-gray-900">
|
||||
<body>
|
||||
<main>
|
||||
{% block main %}
|
||||
|
||||
|
||||
@@ -1,71 +0,0 @@
|
||||
{% extends 'theme/base.html' %}
|
||||
{% load i18n %}
|
||||
|
||||
{% block main %}
|
||||
<section class="bg-gray-50 dark:bg-gray-900">
|
||||
<div class="flex flex-col items-center justify-center px-6 py-8 mx-auto md:h-screen lg:py-0">
|
||||
|
||||
<a href="{% url 'web:index' %}"
|
||||
class="flex items-center mb-6 text-2xl font-semibold text-gray-900 dark:text-white">
|
||||
<img class="w-8 h-8 mr-2" src="{{ logo }}" alt="logo">
|
||||
{{ web_title }}
|
||||
</a>
|
||||
|
||||
<div
|
||||
class="w-full bg-white rounded-lg shadow dark:border md:mt-0 sm:max-w-md xl:p-0 dark:bg-gray-800 dark:border-gray-700">
|
||||
<div class="p-6 space-y-4 md:space-y-6 sm:p-8">
|
||||
<h1 class="text-xl font-bold leading-tight tracking-tight text-gray-900 md:text-2xl dark:text-white">
|
||||
{% translate 'Inicia sesión en tu cuenta' %}
|
||||
</h1>
|
||||
<form action="{% url 'web:login' %}{% querystring %}" method="post">
|
||||
{% csrf_token %}
|
||||
{% for field in form %}
|
||||
{% if field.id_for_label != 'id_remember_me' %}
|
||||
<label for="{{ field.id_for_label }}"
|
||||
class="block mb-2 text-sm font-medium text-gray-900 dark:text-white">
|
||||
{{ field.label }}
|
||||
</label>
|
||||
{{ field }}
|
||||
{% else %}
|
||||
<div class="my-2 flex items-center">
|
||||
{{ field }}
|
||||
<label for="{{ field.id_for_label }}"
|
||||
class="inline-block text-sm font-medium text-gray-900 dark:text-white ml-2">
|
||||
{{ field.label }}
|
||||
</label>
|
||||
</div>
|
||||
{% endif %}
|
||||
{% endfor %}
|
||||
|
||||
<div class="flex justify-center">
|
||||
<p class="text-sm font-light text-gray-500 my-4 dark:text-gray-400">
|
||||
{% translate '¿Aún no tienes cuenta?' %}
|
||||
<a href="{% url 'web:register' %}"
|
||||
class="font-medium text-primary-700 hover:underline dark:text-primary-400">{% translate 'Regístrate aquí' %}</a>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
|
||||
{% for k, error in form.errors.items %}
|
||||
<span class="flex justify-center mb-2 text-sm font-medium text-red-900 dark:text-red-400">{{ error }}</span>
|
||||
{% endfor %}
|
||||
|
||||
<button
|
||||
class="w-full text-white bg-primary-600 hover:bg-primary-700 focus:ring-4 focus:outline-none focus:ring-primary-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-primary-600 dark:hover:bg-primary-700 dark:focus:ring-primary-800 cursor-pointer">
|
||||
{% translate 'Iniciar sesión' %}
|
||||
</button>
|
||||
|
||||
<div class="flex justify-center">
|
||||
<p class="text-sm font-light text-gray-500 mt-4 dark:text-gray-400">
|
||||
<a href="{% url 'web:reset_password' %}"
|
||||
class="font-medium text-primary-700 hover:underline dark:text-primary-400">{% translate '¿Has olvidado tu contraseña?' %}</a>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{% endblock %}
|
||||
@@ -1,54 +0,0 @@
|
||||
{% extends 'theme/base.html' %}
|
||||
{% load i18n %}
|
||||
|
||||
{% block main %}
|
||||
<section class="bg-gray-50 dark:bg-gray-900">
|
||||
<div class="flex flex-col items-center justify-center px-6 py-8 mx-auto md:h-screen lg:py-0">
|
||||
|
||||
<a href="{% url 'web:index' %}" class="flex items-center mb-6 text-2xl font-semibold text-gray-900 dark:text-white">
|
||||
<img class="w-8 h-8 mr-2" src="{{ logo }}" alt="logo">
|
||||
{{ web_title }}
|
||||
</a>
|
||||
|
||||
<div
|
||||
class="w-full bg-white rounded-lg shadow dark:border md:mt-0 sm:max-w-md xl:p-0 dark:bg-gray-800 dark:border-gray-700">
|
||||
<div class="p-6 space-y-4 md:space-y-6 sm:p-8">
|
||||
<h1 class="text-xl font-bold leading-tight tracking-tight text-gray-900 md:text-2xl dark:text-white">
|
||||
{% translate 'Crea tu cuenta' %}
|
||||
</h1>
|
||||
<form action="{% url 'web:register' %}" method="post">
|
||||
{% csrf_token %}
|
||||
{% for field in form %}
|
||||
<div class="my-2">
|
||||
<label for="{{ field.id_for_label }}"
|
||||
class="inline-block text-sm font-medium text-gray-900 dark:text-white mr-2">
|
||||
{{ field.label }}
|
||||
</label>
|
||||
|
||||
{{ field }}
|
||||
</div>
|
||||
|
||||
{% endfor %}
|
||||
|
||||
{% if errors %}
|
||||
{% for error in errors %}
|
||||
<span class="inline-block text-sm font-medium text-red-900 dark:text-red-400 mr-2">{{ error }}</span>
|
||||
{% endfor %}
|
||||
{% endif %}
|
||||
|
||||
<button class="w-full text-white bg-primary-600 hover:bg-primary-700 focus:ring-4 focus:outline-none
|
||||
focus:ring-primary-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center
|
||||
dark:bg-primary-600 dark:hover:bg-primary-700 dark:focus:ring-primary-800 mt-4 cursor-pointer">
|
||||
{% translate 'Crear cuenta' %}
|
||||
</button>
|
||||
<p class="text-sm font-light text-gray-500 mt-4 dark:text-gray-400">
|
||||
{% translate '¿Ya tienes cuenta?' %}
|
||||
<a href="{% url 'web:login' %}" class="font-medium text-primary-600 hover:underline dark:text-primary-500">{% translate 'Inicia sesión aquí' %}</a>
|
||||
</p>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{% endblock %}
|
||||
@@ -1,46 +0,0 @@
|
||||
{% extends 'theme/base.html' %}
|
||||
{% load i18n %}
|
||||
|
||||
{% block main %}
|
||||
<section class="bg-gray-50 dark:bg-gray-900">
|
||||
<div class="flex flex-col items-center justify-center px-6 py-8 mx-auto md:h-screen lg:py-0">
|
||||
|
||||
<a href="{% url 'web:index' %}" class="flex items-center mb-6 text-2xl font-semibold text-gray-900 dark:text-white">
|
||||
<img class="w-8 h-8 mr-2" src="{{ logo }}" alt="logo">
|
||||
{{ web_title }}
|
||||
</a>
|
||||
|
||||
<div
|
||||
class="w-full bg-white rounded-lg shadow dark:border md:mt-0 sm:max-w-md xl:p-0 dark:bg-gray-800 dark:border-gray-700">
|
||||
<div class="p-6 space-y-4 md:space-y-6 sm:p-8">
|
||||
<h1 class="text-xl font-bold leading-tight tracking-tight text-gray-900 md:text-2xl dark:text-white">
|
||||
{% translate 'Restablecer contraseña' %}
|
||||
</h1>
|
||||
<form action="{% url 'web:reset_password' %}" method="post">
|
||||
{% csrf_token %}
|
||||
{% for field in form %}
|
||||
|
||||
<div class="my-2">
|
||||
<label for="{{ field.id_for_label }}"
|
||||
class="inline-block text-sm font-medium text-gray-900 dark:text-white mr-2">
|
||||
{{ field.label }}
|
||||
</label>
|
||||
{{ field }}
|
||||
</div>
|
||||
|
||||
{% endfor %}
|
||||
<button
|
||||
class="w-full text-white bg-primary-600 hover:bg-primary-700 focus:ring-4 focus:outline-none focus:ring-primary-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-primary-600 dark:hover:bg-primary-700 dark:focus:ring-primary-800 cursor-pointer">
|
||||
{% translate 'Restablecer contraseña' %}
|
||||
</button>
|
||||
<p class="text-sm font-light text-gray-500 mt-4 dark:text-gray-400">
|
||||
{% translate '¿Aún no tienes cuenta?' %}
|
||||
<a href="{% url 'web:register' %}" class="font-medium text-primary-600 hover:underline dark:text-primary-500">{% translate 'Regístrate aquí' %}</a>
|
||||
</p>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{% endblock %}
|
||||
@@ -1,50 +0,0 @@
|
||||
{% extends 'theme/base.html' %}
|
||||
{% load i18n %}
|
||||
|
||||
{% block main %}
|
||||
<section class="bg-gray-50 dark:bg-gray-900">
|
||||
<div class="flex flex-col items-center justify-center px-6 py-8 mx-auto md:h-screen lg:py-0">
|
||||
|
||||
<a href="{% url 'web:index' %}" class="flex items-center mb-6 text-2xl font-semibold text-gray-900 dark:text-white">
|
||||
<img class="w-8 h-8 mr-2" src="{{ logo }}" alt="logo">
|
||||
{{ web_title }}
|
||||
</a>
|
||||
|
||||
<div
|
||||
class="w-full bg-white rounded-lg shadow dark:border md:mt-0 sm:max-w-md xl:p-0 dark:bg-gray-800 dark:border-gray-700">
|
||||
<div class="p-6 space-y-4 md:space-y-6 sm:p-8">
|
||||
<h1 class="text-xl font-bold leading-tight tracking-tight text-gray-900 md:text-2xl dark:text-white">
|
||||
{% translate 'Restablecer contraseña' %}
|
||||
</h1>
|
||||
{% if valid_token %}
|
||||
<form method="post">
|
||||
{% csrf_token %}
|
||||
{% for field in form %}
|
||||
|
||||
<div class="my-2">
|
||||
<label for="{{ field.id_for_label }}"
|
||||
class="inline-block text-sm font-medium text-gray-900 dark:text-white mr-2">
|
||||
{{ field.label }}
|
||||
</label>
|
||||
{{ field }}
|
||||
</div>
|
||||
|
||||
{% endfor %}
|
||||
<button
|
||||
class="w-full text-white bg-primary-600 hover:bg-primary-700 focus:ring-4 focus:outline-none focus:ring-primary-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center dark:bg-primary-600 dark:hover:bg-primary-700 dark:focus:ring-primary-800 cursor-pointer">
|
||||
{% translate 'Restablecer contraseña' %}
|
||||
</button>
|
||||
<p class="text-sm font-light text-gray-500 mt-4 dark:text-gray-400">
|
||||
{% translate '¿Aún no tienes cuenta?' %}
|
||||
<a href="{% url 'web:register' %}" class="font-medium text-primary-600 hover:underline dark:text-primary-500">{% translate 'Regístrate aquí' %}</a>
|
||||
</p>
|
||||
</form>
|
||||
{% else %}
|
||||
<span>El enlace no es válido o ha expirado</span>
|
||||
{% endif %}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{% endblock %}
|
||||
@@ -1,31 +0,0 @@
|
||||
{% extends 'theme/base.html' %}
|
||||
{% load i18n %}
|
||||
|
||||
{% block main %}
|
||||
<section class="bg-gray-50 dark:bg-gray-900">
|
||||
<div class="flex flex-col items-center justify-center px-6 py-8 mx-auto md:h-screen lg:py-0">
|
||||
|
||||
<a href="{% url 'web:index' %}"
|
||||
class="flex items-center mb-6 text-2xl font-semibold text-gray-900 dark:text-white">
|
||||
<img class="w-8 h-8 mr-2" src="{{ logo }}" alt="logo">
|
||||
{{ web_title }}
|
||||
</a>
|
||||
|
||||
<div
|
||||
class="w-full bg-white rounded-lg shadow dark:border md:mt-0 sm:max-w-md xl:p-0 dark:bg-gray-800 dark:border-gray-700">
|
||||
<div class="p-6 space-y-4 md:space-y-6 sm:p-8">
|
||||
<h1 class="text-xl font-bold leading-tight tracking-tight text-gray-900 md:text-2xl dark:text-white">
|
||||
{% translate 'Se te ha enviado un correo electrónico para restablecer tu contraseña' %}
|
||||
</h1>
|
||||
|
||||
<p class="text-sm font-light text-gray-500 mt-4 dark:text-gray-400">
|
||||
{% translate '¿Aún no tienes cuenta?' %}
|
||||
<a href="{% url 'web:register' %}"
|
||||
class="font-medium text-primary-600 hover:underline dark:text-primary-500">{% translate 'Regístrate aquí' %}</a>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{% endblock %}
|
||||
@@ -1,63 +0,0 @@
|
||||
{% extends 'theme/base.html' %}
|
||||
{% load i18n %}
|
||||
{% block main %}
|
||||
{% include 'components/generic/navbar.html' %}
|
||||
<section class="bg-white py-8 antialiased dark:bg-gray-900 md:py-8">
|
||||
<div class="mx-auto max-w-screen-lg px-4 2xl:px-0">
|
||||
<h2
|
||||
class="mb-4 text-xl font-semibold text-gray-900 dark:text-white sm:text-2xl md:mb-6"
|
||||
>
|
||||
{% translate 'Mi cuenta' %}
|
||||
</h2>
|
||||
<div class="md:grid md:grid-cols-2 md:gap-4">
|
||||
<section
|
||||
class="p-6 border border-gray-100 rounded-md dark:border-gray-600"
|
||||
|
||||
>
|
||||
<h2 class="mb-4 text-xl font-semibold text-gray-900 dark:text-white sm:text-2xl md:mb-6">
|
||||
{% translate 'Datos de usuario' %}
|
||||
</h2>
|
||||
<div hx-get="{% url 'web:user_info_component' %}" hx-trigger="load, updated_user_info">
|
||||
<div class="flex justify-center items-center">
|
||||
{% include 'components/generic/spinner.html' %}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section
|
||||
class="p-6 border border-gray-100 rounded-md dark:border-gray-600 mt-4 md:mt-0"
|
||||
>
|
||||
<h2 class="mb-4 text-xl font-semibold text-gray-900 dark:text-white sm:text-2xl md:mb-6">
|
||||
{% translate 'Contraseña' %}
|
||||
</h2>
|
||||
<div hx-get="{% url 'web:change_password_component' %}" hx-trigger="load, changed_password">
|
||||
<div class="flex justify-center items-center">
|
||||
{% include 'components/generic/spinner.html' %}
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<div class="mt-4 p-6 border border-gray-100 rounded-md dark:border-gray-600">
|
||||
<div class="flex space-x-4">
|
||||
<div>
|
||||
<h3 class="flex items-center text-xl font-bold leading-none text-gray-900 dark:text-white sm:text-2xl">
|
||||
{% translate 'Mis direcciones' %}
|
||||
</h3>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<hr class="h-px my-2 bg-gray-200 border-0 dark:bg-gray-700">
|
||||
|
||||
{% if customer_addresses.count == 0 %}
|
||||
<span class="text-gray-500 dark:text-gray-400">{% translate 'No hay ninguna dirección' %}</span>
|
||||
{% endif %}
|
||||
|
||||
<div hx-get="{% url 'web:list_customer_addresses_component' %}" hx-trigger="load, updated_addresses">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</section>
|
||||
{% endblock %}
|
||||
@@ -12,7 +12,7 @@
|
||||
<div class="flex justify-center items-center">
|
||||
{% if has_previous_page %}
|
||||
<button type="button"
|
||||
class="button-gray"
|
||||
|
||||
hx-get="{% url 'web:list_products' %}{% querystring page=page.previous_page_number %}"
|
||||
hx-trigger="click"
|
||||
hx-target="#products"
|
||||
@@ -23,7 +23,7 @@
|
||||
{% endif %}
|
||||
{% if has_next_page %}
|
||||
<button type="button"
|
||||
class="button-gray"
|
||||
|
||||
hx-get="{% url 'web:list_products' %}{% querystring page=page.next_page_number %}"
|
||||
hx-trigger="click"
|
||||
hx-target="#products"
|
||||
|
||||
@@ -4,13 +4,13 @@
|
||||
{% block main %}
|
||||
{% include 'components/generic/navbar.html' %}
|
||||
{% load i18n %}
|
||||
<section class="bg-white py-2 antialiased dark:bg-gray-900 md:py-8">
|
||||
<section class=" py-2 antialiased md:py-8">
|
||||
<div class="mx-auto max-w-screen-xl px-4 2xl:px-0">
|
||||
<h2 class="text-xl font-semibold text-gray-900 dark:text-white sm:text-2xl">
|
||||
<h2 class="text-xl font-semibold sm:text-2xl">
|
||||
{% translate 'Resumen del pedido' %}
|
||||
|
||||
{% if order.status == 'PAI' %}
|
||||
<span class="bg-green-100 text-green-800 text-sm font-medium me-2 px-2.5 py-0.5 rounded dark:bg-green-900 dark:text-green-300 ml-3">{% trans 'Pagado' %}</span>
|
||||
<span class=" text-green-800 text-sm font-medium me-2 px-2.5 py-0.5 rounded ml-3">{% trans 'Pagado' %}</span>
|
||||
{% endif %}
|
||||
</h2>
|
||||
|
||||
@@ -20,25 +20,25 @@
|
||||
|
||||
{% for item in items %}
|
||||
<div
|
||||
class="rounded-lg border border-gray-200 bg-white p-4 shadow-sm dark:border-gray-700 dark:bg-gray-800 md:p-6">
|
||||
class="rounded-lg p-4 shadow-sm md:p-6">
|
||||
<div class="space-y-4 md:flex md:items-center md:justify-between md:gap-6 md:space-y-0">
|
||||
<a href="#" class="shrink-0 md:order-1">
|
||||
<img class="h-20 w-20 dark:hidden" src="{{ item.product.images.all.0.s.url }}"
|
||||
<img class="h-20 w-20 " src="{{ item.product.images.all.0.s.url }}"
|
||||
alt="{{ item.product.name }}"/>
|
||||
<img class="hidden h-20 w-20 dark:block" src="{{ item.product.images.all.0.s_dark.url }}"
|
||||
<img class="hidden h-20 w-20 " src="{{ item.product.images.all.0.s_dark.url }}"
|
||||
alt="{{ item.product.name }}"/>
|
||||
</a>
|
||||
|
||||
<div class="flex items-center justify-between md:order-3 md:justify-end">
|
||||
<div class="flex items-center">
|
||||
<span
|
||||
class="w-10 shrink-0 border-0 bg-transparent text-center text-sm font-medium text-gray-900 focus:outline-none focus:ring-0 dark:text-white">
|
||||
class="w-10 shrink-0 text-center text-sm font-medium focus:outline-none focus:ring-0 ">
|
||||
{{ item.quantity|floatformat }}x
|
||||
</span>
|
||||
</div>
|
||||
<div class="text-end md:order-4 md:w-32">
|
||||
<p
|
||||
class="text-base font-bold text-gray-900 dark:text-white">
|
||||
class="text-base font-bold ">
|
||||
{{ item.product.price.price_with_tax }}€
|
||||
</p>
|
||||
</div>
|
||||
@@ -46,7 +46,7 @@
|
||||
|
||||
<div class="w-full min-w-0 flex-1 space-y-4 md:order-2 md:max-w-md">
|
||||
<a href="{% url 'web:product_detail' pk=item.product.pk slug=item.product.slug %}"
|
||||
class="text-base font-medium text-gray-900 hover:underline dark:text-white"
|
||||
class="text-base font-medium hover:underline "
|
||||
>
|
||||
{{ item.product.name }}
|
||||
</a>
|
||||
@@ -58,53 +58,53 @@
|
||||
{% endfor %}
|
||||
|
||||
{% if items.count == 0 %}
|
||||
<p class="text-base font-normal text-gray-500 dark:text-gray-400">
|
||||
<p class="text-base font-normal ">
|
||||
{% translate 'No hay nada en el carrito...' %}
|
||||
</p>
|
||||
<p>
|
||||
<a href="{% url 'web:index' %}" title=""
|
||||
class="inline-flex items-center gap-2 text-sm font-medium text-primary-700 underline hover:no-underline dark:text-primary-500">
|
||||
class="inline-flex items-center gap-2 text-sm font-medium text-primary-700 underline hover:no-underline ">
|
||||
{% translate 'Volver a inicio' %}
|
||||
</a>
|
||||
</p>
|
||||
{% endif %}
|
||||
|
||||
<section>
|
||||
<h2 class="text-xl font-semibold text-gray-900 dark:text-white sm:text-2xl">
|
||||
<h2 class="text-xl font-semibold sm:text-2xl">
|
||||
{% translate 'Dirección de envío' %}
|
||||
</h2>
|
||||
|
||||
<div>
|
||||
<p class="text-m text-gray-900 dark:text-white">{{ order.email }}</p>
|
||||
<p class="text-m text-gray-900 dark:text-white">{{ order.shipping_address }}</p>
|
||||
<p class="text-m text-gray-900 dark:text-white">{{ order.shipping_city }}</p>
|
||||
<p class="text-m text-gray-900 dark:text-white">{{ order.shipping_state }}</p>
|
||||
<p class="text-m text-gray-900 dark:text-white">{{ order.shipping_country }}</p>
|
||||
<p class="text-m text-gray-900 dark:text-white">{{ order.shipping_zip }}</p>
|
||||
<p class="text-m ">{{ order.email }}</p>
|
||||
<p class="text-m ">{{ order.shipping_address }}</p>
|
||||
<p class="text-m ">{{ order.shipping_city }}</p>
|
||||
<p class="text-m ">{{ order.shipping_state }}</p>
|
||||
<p class="text-m ">{{ order.shipping_country }}</p>
|
||||
<p class="text-m ">{{ order.shipping_zip }}</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h2 class="text-xl font-semibold text-gray-900 dark:text-white sm:text-2xl">
|
||||
<h2 class="text-xl font-semibold sm:text-2xl">
|
||||
{% translate 'Dirección de facturación' %}
|
||||
</h2>
|
||||
|
||||
<div>
|
||||
<p class="text-m text-gray-900 dark:text-white">{{ order.billing_address }}</p>
|
||||
<p class="text-m text-gray-900 dark:text-white">{{ order.billing_city }}</p>
|
||||
<p class="text-m text-gray-900 dark:text-white">{{ order.billing_state }}</p>
|
||||
<p class="text-m text-gray-900 dark:text-white">{{ order.billing_country }}</p>
|
||||
<p class="text-m text-gray-900 dark:text-white">{{ order.billing_zip }}</p>
|
||||
<p class="text-m ">{{ order.billing_address }}</p>
|
||||
<p class="text-m ">{{ order.billing_city }}</p>
|
||||
<p class="text-m ">{{ order.billing_state }}</p>
|
||||
<p class="text-m ">{{ order.billing_country }}</p>
|
||||
<p class="text-m ">{{ order.billing_zip }}</p>
|
||||
</div>
|
||||
|
||||
</section>
|
||||
|
||||
<section>
|
||||
<h2 class="text-xl font-semibold text-gray-900 dark:text-white sm:text-2xl">
|
||||
<h2 class="text-xl font-semibold sm:text-2xl">
|
||||
{% translate 'Método de envío' %}
|
||||
</h2>
|
||||
|
||||
<p class="text-m text-gray-900 dark:text-white">{{ order.shipping_method.name }}</p>
|
||||
<p class="text-m ">{{ order.shipping_method.name }}</p>
|
||||
|
||||
</section>
|
||||
</div>
|
||||
@@ -114,23 +114,23 @@
|
||||
<!-- Resumen del pedido -->
|
||||
<div class="mx-auto mt-6 max-w-4xl flex-1 space-y-6 lg:mt-0 lg:w-full">
|
||||
<div
|
||||
class="space-y-4 rounded-lg border border-gray-200 bg-white p-4 shadow-sm dark:border-gray-700 dark:bg-gray-800 sm:p-6">
|
||||
<p class="text-xl font-semibold text-gray-900 dark:text-white">
|
||||
class="space-y-4 rounded-lg p-4 shadow-sm sm:p-6">
|
||||
<p class="text-xl font-semibold ">
|
||||
{% translate 'Resumen del pedido' %}</p>
|
||||
|
||||
<div class="space-y-4">
|
||||
<div class="space-y-2">
|
||||
<dl class="flex items-center justify-between gap-4">
|
||||
<dt
|
||||
class="text-base font-normal text-gray-500 dark:text-gray-400">
|
||||
class="text-base font-normal ">
|
||||
{% translate 'Base imponible' %}
|
||||
</dt>
|
||||
<dd class="text-base font-medium text-gray-900 dark:text-white">{{ base_total }} €
|
||||
<dd class="text-base font-medium ">{{ base_total }} €
|
||||
</dd>
|
||||
</dl>
|
||||
|
||||
<dl class="flex items-center justify-between gap-4">
|
||||
<dt class="text-base font-normal text-gray-500 dark:text-gray-400">
|
||||
<dt class="text-base font-normal ">
|
||||
{% translate 'Descuentos' %}
|
||||
</dt>
|
||||
<dd class="text-base font-medium text-green-600">-{{ savings }} €</dd>
|
||||
@@ -138,27 +138,27 @@
|
||||
|
||||
<dl class="flex items-center justify-between gap-4">
|
||||
<dt
|
||||
class="text-base font-normal text-gray-500 dark:text-gray-400">
|
||||
class="text-base font-normal ">
|
||||
{% translate 'Gastos de envío' %}
|
||||
</dt>
|
||||
<dd class="text-base font-medium text-gray-900 dark:text-white">{{ shipping_cost }}
|
||||
<dd class="text-base font-medium ">{{ shipping_cost }}
|
||||
€
|
||||
</dd>
|
||||
</dl>
|
||||
|
||||
<dl class="flex items-center justify-between gap-4">
|
||||
<dt class="text-base font-normal text-gray-500 dark:text-gray-400">
|
||||
<dt class="text-base font-normal ">
|
||||
{% translate 'Impuestos' %}
|
||||
</dt>
|
||||
<dd class="text-base font-medium text-gray-900 dark:text-white">{{ tax_total }} €
|
||||
<dd class="text-base font-medium ">{{ tax_total }} €
|
||||
</dd>
|
||||
</dl>
|
||||
</div>
|
||||
|
||||
<dl class="flex items-center justify-between gap-4 border-t border-gray-200 pt-2 dark:border-gray-700">
|
||||
<dt class="text-base font-bold text-gray-900 dark:text-white">{% translate 'Total' %}
|
||||
<dl class="flex items-center justify-between gap-4 pt-2 ">
|
||||
<dt class="text-base font-bold ">{% translate 'Total' %}
|
||||
</dt>
|
||||
<dd class="text-base font-bold text-gray-900 dark:text-white">{{ total }} €</dd>
|
||||
<dd class="text-base font-bold ">{{ total }} €</dd>
|
||||
</dl>
|
||||
</div>
|
||||
|
||||
@@ -169,14 +169,14 @@
|
||||
<input type="hidden" name="Ds_MerchantParameters" value="{{ merchant_parameters }}"/>
|
||||
<input type="hidden" name="Ds_Signature" value="{{ signature }}"/>
|
||||
|
||||
<button class="flex w-full items-center justify-center rounded-lg bg-primary-700 px-5 py-2.5 text-sm font-medium text-white hover:bg-primary-800 focus:outline-none focus:ring-4 focus:ring-primary-300 dark:bg-primary-600 dark:hover:bg-primary-700 dark:focus:ring-primary-800 cursor-pointer">
|
||||
<button class="flex w-full items-center justify-center rounded-lg px-5 py-2.5 text-sm font-medium text-white hover: focus:outline-none focus:ring-4 focus:ring-primary-300 : :ring-primary-800 cursor-pointer">
|
||||
{% translate 'Pagar' %}
|
||||
</button>
|
||||
</form>
|
||||
<div class="flex items-center justify-center gap-2">
|
||||
<span class="text-sm font-normal text-gray-500 dark:text-gray-400"> {% translate 'o' %} </span>
|
||||
<span class="text-sm font-normal "> {% translate 'o' %} </span>
|
||||
<a href="{% url 'web:index' %}" title=""
|
||||
class="inline-flex items-center gap-2 text-sm font-medium text-primary-700 underline hover:no-underline dark:text-primary-400">
|
||||
class="inline-flex items-center gap-2 text-sm font-medium text-primary-700 underline hover:no-underline ">
|
||||
{% translate 'Seguir comprando' %}
|
||||
</a>
|
||||
</div>
|
||||
|
||||
@@ -6,20 +6,20 @@
|
||||
<div class="mx-auto max-w-screen-xl px-4 2xl:px-0">
|
||||
<div class="mx-auto max-w-5xl">
|
||||
<div class="gap-4">
|
||||
<h1 class="text-xl font-semibold text-gray-900 dark:text-white sm:text-2xl my-4">
|
||||
<h1 class="text-xl font-semibold sm:text-2xl my-4">
|
||||
{% translate 'Mis pedidos' %}
|
||||
</h1>
|
||||
|
||||
<div class="mt-6 flow-root sm:mt-8">
|
||||
<div class="divide-y divide-gray-200 dark:divide-gray-700">
|
||||
<div class="divide-y divide-gray-200 ">
|
||||
{% for order in page %}
|
||||
|
||||
<article class="flex flex-wrap items-center gap-y-4 py-6">
|
||||
<dl class="w-1/2 sm:w-1/4 lg:w-auto lg:flex-1 px-4">
|
||||
<dt class="text-base font-medium text-gray-500 dark:text-gray-400">
|
||||
<dt class="text-base font-medium ">
|
||||
{% translate 'Número de pedido' %}
|
||||
</dt>
|
||||
<dd class="mt-1.5 text-base font-semibold text-gray-900 dark:text-white">
|
||||
<dd class="mt-1.5 text-base font-semibold ">
|
||||
<a href="{% url 'web:order' uuid=order.uuid %}" class="hover:underline">
|
||||
#{{ order.code }}
|
||||
</a>
|
||||
@@ -27,19 +27,19 @@
|
||||
</dl>
|
||||
|
||||
<dl class="w-1/2 sm:w-1/4 lg:w-auto lg:flex-1 px-4">
|
||||
<dt class="text-base font-medium text-gray-500 dark:text-gray-400">
|
||||
<dt class="text-base font-medium ">
|
||||
{% translate 'Fecha' %}
|
||||
</dt>
|
||||
<dd class="mt-1.5 text-base font-semibold text-gray-900 dark:text-white">
|
||||
<dd class="mt-1.5 text-base font-semibold ">
|
||||
{{ order.creation_date }}
|
||||
</dd>
|
||||
</dl>
|
||||
|
||||
<dl class="w-1/2 sm:w-1/4 lg:w-auto lg:flex-1 px-4">
|
||||
<dt class="text-base font-medium text-gray-500 dark:text-gray-400">
|
||||
<dt class="text-base font-medium ">
|
||||
{% translate 'Total' %}
|
||||
</dt>
|
||||
<dd class="mt-1.5 text-base font-semibold text-gray-900 dark:text-white">
|
||||
<dd class="mt-1.5 text-base font-semibold ">
|
||||
{{ order.total }}€
|
||||
</dd>
|
||||
</dl>
|
||||
@@ -47,45 +47,45 @@
|
||||
<dl class="w-1/2 sm:w-1/4 lg:w-auto lg:flex-1 px-4">
|
||||
|
||||
{% if order.status == 'PAI' %}
|
||||
<dd class="inline-flex bg-green-100 text-green-800 text-xs font-medium me-2 px-2.5 py-0.5 rounded dark:bg-green-900 dark:text-green-300">
|
||||
<dd class="inline-flex text-green-800 text-xs font-medium me-2 px-2.5 py-0.5 rounded ">
|
||||
{% translate 'Pagado' %}
|
||||
</dd>
|
||||
|
||||
{% if order.shipping_status == 'NOT' %}
|
||||
<dd class="inline-flex bg-yellow-100 text-yellow-800 text-xs font-medium me-2 px-2.5 py-0.5 rounded dark:bg-yellow-900 dark:text-yellow-300">
|
||||
<dd class="inline-flex text-yellow-800 text-xs font-medium me-2 px-2.5 py-0.5 rounded ">
|
||||
{% translate 'Tramitado' %}
|
||||
</dd>
|
||||
{% elif order.shipping_status == 'RDY' %}
|
||||
<dd class="inline-flex bg-yellow-100 text-yellow-800 text-xs font-medium me-2 px-2.5 py-0.5 rounded dark:bg-yellow-900 dark:text-yellow-300">
|
||||
<dd class="inline-flex text-yellow-800 text-xs font-medium me-2 px-2.5 py-0.5 rounded ">
|
||||
{% translate 'Preparado' %}
|
||||
</dd>
|
||||
{% elif order.shipping_status == 'TBS' %}
|
||||
<dd class="inline-flex bg-yellow-100 text-yellow-800 text-xs font-medium me-2 px-2.5 py-0.5 rounded dark:bg-yellow-900 dark:text-yellow-300">
|
||||
<dd class="inline-flex text-yellow-800 text-xs font-medium me-2 px-2.5 py-0.5 rounded ">
|
||||
{% translate 'Listo' %}
|
||||
</dd>
|
||||
{% elif order.shipping_status == 'SNT' %}
|
||||
<dd class="inline-flex bg-blue-100 text-blue-800 text-xs font-medium me-2 px-2.5 py-0.5 rounded dark:bg-blue-900 dark:text-blue-300">
|
||||
<dd class="inline-flex text-blue-800 text-xs font-medium me-2 px-2.5 py-0.5 rounded ">
|
||||
{% translate 'Enviado' %}
|
||||
</dd>
|
||||
{% elif order.shipping_status == 'DLV' %}
|
||||
<dd class="inline-flex bg-green-100 text-green-800 text-xs font-medium me-2 px-2.5 py-0.5 rounded dark:bg-green-900 dark:text-green-300">
|
||||
<dd class="inline-flex text-green-800 text-xs font-medium me-2 px-2.5 py-0.5 rounded ">
|
||||
{% translate 'Entregado' %}
|
||||
</dd>
|
||||
{% endif %}
|
||||
|
||||
{% elif order.status == 'ERR' %}
|
||||
<dd class="inline-flex bg-red-100 text-red-800 text-xs font-medium me-2 px-2.5 py-0.5 rounded dark:bg-red-900 dark:text-red-300">
|
||||
<dd class="inline-flex text-red-800 text-xs font-medium me-2 px-2.5 py-0.5 rounded ">
|
||||
{% translate 'Error' %}
|
||||
</dd>
|
||||
{% elif order.status == 'RTN' %}
|
||||
<dd class="inline-flex bg-yellow-100 text-yellow-800 text-xs font-medium me-2 px-2.5 py-0.5 rounded dark:bg-yellow-900 dark:text-yellow-300">
|
||||
<dd class="inline-flex text-yellow-800 text-xs font-medium me-2 px-2.5 py-0.5 rounded ">
|
||||
{% translate 'Devuelto' %}
|
||||
</dd>
|
||||
{% endif %}
|
||||
</dl>
|
||||
|
||||
<a href="{% url 'web:order' uuid=order.uuid %}"
|
||||
class="w-full inline-flex justify-center rounded-lg border border-gray-200 bg-white px-3 py-2 text-sm font-medium text-gray-900 hover:bg-gray-100 hover:text-primary-700 focus:z-10 focus:outline-none focus:ring-4 focus:ring-gray-100 dark:border-gray-600 dark:bg-gray-800 dark:text-gray-400 dark:hover:bg-gray-700 dark:hover:text-white dark:focus:ring-gray-700 lg:w-auto">
|
||||
class="w-full inline-flex justify-center rounded-lg px-3 py-2 text-sm font-medium hover: hover:text-primary-700 focus:z-10 focus:outline-none focus:ring-4 focus:ring-gray-100 : :text-white :ring-gray-700 lg:w-auto">
|
||||
{% translate 'Ver pedido' %}
|
||||
</a>
|
||||
</article>
|
||||
|
||||
@@ -6,7 +6,7 @@
|
||||
{% block main %}
|
||||
{% include 'components/generic/navbar.html' %}
|
||||
|
||||
<section class="min-w-full py-8 bg-white md:py-16 antialiased">
|
||||
<section class="min-w-full py-8 md:py-16 antialiased">
|
||||
<div class="max-w-screen-xl px-4 mx-auto 2xl:px-0">
|
||||
<div class="lg:grid lg:grid-cols-2 lg:gap-8 xl:gap-16">
|
||||
<div class="shrink-0 max-w-md lg:max-w-lg mx-auto">
|
||||
@@ -31,13 +31,13 @@
|
||||
|
||||
<div class="my-4 sm:m-8 lg:m-0">
|
||||
|
||||
<h1 class="text-xl font-semibold text-gray-900 sm:text-2xl ">
|
||||
<h1 class="text-xl font-semibold sm:text-2xl ">
|
||||
{{ product.name }}
|
||||
</h1>
|
||||
|
||||
<div class="my-4 sm:items-center sm:gap-4 sm:flex">
|
||||
<p
|
||||
class="text-2xl font-extrabold text-gray-900 sm:text-3xl "
|
||||
class="text-2xl font-extrabold sm:text-3xl "
|
||||
>
|
||||
{{ product.price.price_with_tax }} €
|
||||
</p>
|
||||
@@ -53,10 +53,10 @@
|
||||
|
||||
{% include 'components/cart/add_to_cart.html' %}
|
||||
|
||||
<hr class="my-6 md:my-8 border-gray-200 dark:border-gray-800"/>
|
||||
<hr class="my-6 md:my-8 "/>
|
||||
|
||||
</div>
|
||||
<p class="mb-6 text-gray-500 dark:text-gray-400">
|
||||
<p class="mb-6 ">
|
||||
{{ product.description }}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
@@ -12,7 +12,7 @@
|
||||
hx-swap="innerHTML"
|
||||
>
|
||||
<h1
|
||||
class="text-xl font-semibold text-gray-900 dark:text-white sm:text-2xl my-4"
|
||||
class="text-xl font-semibold sm:text-2xl my-4"
|
||||
>
|
||||
{% translate 'Lista de deseados' %}
|
||||
</h1>
|
||||
|
||||
Reference in New Issue
Block a user