first time posting here so apologies if this isn't the place to post this question.
maybe i've been on the computer too long today but i'm having trouble with a theme i'm developing as i'm trying to figure out the appropriate control flow. i'm working on getting product sizing options and the respective quantities available to display on the front end, and i want it to show as follows:
Size (qty) Size (qty) Size (qty) etc...
currently this is what i have in my template file for the page where this data is being rendered
<div class="flex flex-row gap-1">
<p>Size (qty)</p>
{% for value in product.options_by_name['Size'].values %}
<p>{{ value }}</p>
{% endfor %}
{% for variant in product.variants %}
<p>({{ variant.inventory_quantity }})</p>
{% endfor %}
</div>
this results in an ouput of this:
Size (qty) S M L XL (0) (0) (0) (0)
but ideally it'd be:
Size (qty) S (0) M (0) L (0) XL (0)
perhaps this is the wrong approach, but i feel like i should have the logic for the variant inventory quantity nested inside of the product options values loop. however, when i've tried this the parent for loop just results appends a bunch of duplicate data next to the size options on the front end.
i'm sure the answer to this is probably very obvious but for some reason i'm just not seeing it. any help or advisement would be appreciated.