1 {% assign collection = collections["featured"] %}
2 <section class="storefront-grid">
3 {% for product in collection.products %}
4 <div class="product-card">
5 <h3>{{ product.title }}</h3>
6 <span class="price">{{ product.price | money }}</span>
7 {% if product.available == false %}
8 <span class="badge sold-out">Fora de estoque</span>
9 {% endif %}
10 <button class="add-to-cart">Adicionar ao carrinho</button>
11 </div>
12 {% endfor %}
13 </section>
14
15 <style>
16 .storefront-grid { display: grid; gap: 24px; }
17 .product-card { padding: 16px; background: #0f0f0f; }
18 .price { color: var(--accent-gold); }
19 .sold-out { opacity: 0.5; text-decoration: line-through; }
20 .add-to-cart { border: 1px solid currentColor; }
21 </style>
22
23 {% assign checkout_state = "simulated" %}
24 {{ checkout_state | upcase }}
25