filipriec/kompress_eshop
1
0
Fork 0
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

product page refresh fixed

Browse Source
This commit is contained in:
Priec
2026-06-27 22:19:55 +02:00
parent c549e2bc03
commit da2c487dc4
1 changed files with 15 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
assets/views/shop/show.html
View File

@@ -52,12 +52,26 @@
{% set fld = "w-full rounded-radius border border-outline bg-surface-alt px-3 py-2 text-sm text-on-surface focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-primary dark:border-outline-dark dark:bg-surface-dark-alt/50 dark:text-on-surface-dark dark:focus-visible:outline-primary-dark" %}
{% set btn = "inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-radius px-5 py-2 text-sm text-center font-medium tracking-wide transition hover:opacity-75 focus-visible:outline-2 focus-visible:outline-offset-2 active:opacity-100 active:outline-offset-0 disabled:cursor-not-allowed disabled:opacity-75 border border-cta bg-cta text-on-cta focus-visible:outline-cta dark:border-cta-dark dark:bg-cta-dark dark:text-on-cta-dark dark:focus-visible:outline-cta-dark" %}
<script id="variant-data" type="application/json">{{ variants | json_encode() | safe }}</script>
<div class="space-y-6" x-data="productBuy(JSON.parse(document.getElementById('variant-data').textContent))">
<div class="space-y-6"
x-data="{
variants: JSON.parse(document.getElementById('variant-data').textContent) || [],
sel: 0,
get current() { return this.variants[this.sel] || null },
init() {
const firstInStock = this.variants.findIndex(v => v.in_stock);
this.sel = Math.max(0, firstInStock);
},
}">
{% if category %}
<a href="/category/{{ category.slug }}" class="text-sm font-medium text-primary dark:text-primary-dark">{{ category.name }}</a>
{% endif %}
<h1 class="text-3xl font-bold text-on-surface-strong dark:text-on-surface-dark-strong">{{ product.name }}</h1>
{% if product.description %}
{# Authored as rich text (Quill) in the admin; render the stored HTML. #}
<div class="rich-content text-on-surface/80 dark:text-on-surface-dark/80">{{ product.description | safe }}</div>
{% endif %}
<template x-if="current">
<div class="space-y-6">
<!-- option picker (only when there's a real choice); first option is
@@ -82,11 +96,6 @@
</template>
</div>
{% if product.description %}
{# Authored as rich text (Quill) in the admin; render the stored HTML. #}
<div class="rich-content text-on-surface/80 dark:text-on-surface-dark/80">{{ product.description | safe }}</div>
{% endif %}
<template x-if="current.in_stock">
<div class="space-y-2">
<form method="post" action="/cart/add" hx-post="/cart/add" hx-swap="none" class="flex flex-wrap items-end gap-3"
@@ -119,16 +128,5 @@
<p class="inline-flex rounded-radius bg-danger/10 px-3 py-2 text-sm font-medium text-danger">{{ t(key="out-of-stock", lang=lang | default(value='sk')) }}</p>
</template>
</div>
<script>
function productBuy(variants) {
return {
variants: variants || [],
// Default to the first in-stock variant, else the first.
sel: Math.max(0, (variants || []).findIndex(v => v.in_stock)),
get current() { return this.variants[this.sel] || null; },
};
}
</script>
</div>
{% endblock content %}