modifie moi ce code met le en francais puis remplace le poduit par les miroirs que je vend de bonne qualite {% comment %} Reviews Section - Customer Reviews and Ratings Displays overall rating, rating breakdown, and individual customer reviews {% endcomment %} <div id="reviews-{{ section.id }}" class="reviews-section"> <h2 class="reviews-title">{{ section.settings.title | default: 'HEAR IT FROM OUR HAPPY CUSTOMERS' }}</h2> <div class="reviews-summary"> <div class="rating-overview"> <div class="rating-score">{{ section.settings.rating_score | default: '4,9/5' }}</div> <img src="{{ section.settings.stars_image | default: 'https://cdn.shopify.com/s/files/1/0945/7169/2379/files/stars-5.svg?v=1751375984' }}" alt="5 stars" class="stars-image" > <div class="total-reviews">{{ section.settings.total_reviews | default: '+10,500 reviews' }}</div> </div> {%- comment -%} ✅ BARRES CORRIGÉES (classes + scoping) {%- endcomment -%} <div class="reviews-rating-bars"> <div class="reviews-rating-bar"> <span class="reviews-star-count">5</span> <div class="reviews-bar-track"> <div class="reviews-bar-fill" style="width: {{ section.settings.five_star_percentage | default: 85 }}%;"></div> </div> </div> <div class="reviews-rating-bar"> <span class="reviews-star-count">4</span> <div class="reviews-bar-track"> <div class="reviews-bar-fill" style="width: {{ section.settings.four_star_percentage | default: 12 }}%;"></div> </div> </div> <div class="reviews-rating-bar"> <span class="reviews-star-count">3</span> <div class="reviews-bar-track"> <div class="reviews-bar-fill" style="width: {{ section.settings.three_star_percentage | default: 2 }}%;"></div> </div> </div> <div class="reviews-rating-bar"> <span class="reviews-star-count">2</span> <div class="reviews-bar-track"> <div class="reviews-bar-fill" style="width: {{ section.settings.two_star_percentage | default: 1 }}%;"></div> </div> </div> <div class="reviews-rating-bar"> <span class="reviews-star-count">1</span> <div class="reviews-bar-track"> <div class="reviews-bar-fill" style="width: {{ section.settings.one_star_percentage | default: 0 }}%;"></div> </div> </div> </div> <div class="write-review-section"> <h3 class="write-title">{{ section.settings.write_title | default: 'WRITE A REVIEW' }}</h3> <p class="write-subtitle">{{ section.settings.write_subtitle | default: 'Share your experience with other customers' }}</p> <button class="write-button" type="button">{{ section.settings.write_button_text | default: 'Write a review' }}</button> </div> </div> <div class="reviews-list"> <div class="review-item"> <div class="review-header"> <div class="reviewer-info"> <h4 class="reviewer-name">Jessica Parker</h4> <div class="verified-badge"><span class="verified-text">Verified purchase</span><span class="checkmark">✓</span></div> </div> <div class="review-meta"> <img src="https://cdn.trustpilot.net/brand-assets/4.1.0/stars/stars-5.svg" alt="5 stars" class="review-stars"> <span class="review-time">16 January 2026</span> </div> </div> <h5 class="review-title">Nike Mind 002 — Looks even better in person</h5> <p class="review-text">Clean design, very comfortable, and easy to style. I’m honestly obsessed with this pair.</p> </div> <div class="review-item"> <div class="review-header"> <div class="reviewer-info"> <h4 class="reviewer-name">Samantha Reed</h4> <div class="verified-badge"><span class="verified-text">Verified purchase</span><span class="checkmark">✓</span></div> </div> <div class="review-meta"> <img src="https://cdn.trustpilot.net/brand-assets/4.1.0/stars/stars-5.svg" alt="5 stars" class="review-stars"> <span class="review-time">15 January 2026</span> </div> </div> <h5 class="review-title">Nike Mind 001 — So comfy for everyday wear</h5> <p class="review-text">I wear them all day and my feet feel great. Really good cushioning and the fit is perfect.</p> </div> <div class="review-item"> <div class="review-header"> <div class="reviewer-info"> <h4 class="reviewer-name">Amanda Brooks</h4> <div class="verified-badge"><span class="verified-text">Verified purchase</span><span class="checkmark">✓</span></div> </div> <div class="review-meta"> <img src="https://cdn.trustpilot.net/brand-assets/4.1.0/stars/stars-4.svg" alt="4 stars" class="review-stars"> <span class="review-time">14 January 2026</span> </div> </div> <h5 class="review-title">Nike Mind 002 — Great comfort and solid quality</h5> <p class="review-text">Very comfortable and lightweight. The materials feel good and they look great with anything.</p> </div> <div class="review-item"> <div class="review-header"> <div class="reviewer-info"> <h4 class="reviewer-name">Nicole Bennett</h4> <div class="verified-badge"><span class="verified-text">Verified purchase</span><span class="checkmark">✓</span></div> </div> <div class="review-meta"> <img src="https://cdn.trustpilot.net/brand-assets/4.1.0/stars/stars-4.svg" alt="4 stars" class="review-stars"> <span class="review-time">13 January 2026</span> </div> </div> <h5 class="review-title">Nike Mind 001 — Comfortable and easy to match</h5> <p class="review-text">They go with everything and feel great for long walks. Really happy with the purchase.</p> </div> <div class="review-item"> <div class="review-header"> <div class="reviewer-info"> <h4 class="reviewer-name">Megan Foster</h4> <div class="verified-badge"><span class="verified-text">Verified purchase</span><span class="checkmark">✓</span></div> </div> <div class="review-meta"> <img src="https://cdn.trustpilot.net/brand-assets/4.1.0/stars/stars-3.svg" alt="3 stars" class="review-stars"> <span class="review-time">12 January 2026</span> </div> </div> <h5 class="review-title">Nike Mind 002 — Love them, small delivery delay</h5> <p class="review-text">The shoes are great and super comfortable. Delivery was just a bit late, but I’m still satisfied overall.</p> </div> <div class="review-item"> <div class="review-header"> <div class="reviewer-info"> <h4 class="reviewer-name">Rachel Coleman</h4> <div class="verified-badge"><span class="verified-text">Verified purchase</span><span class="checkmark">✓</span></div> </div> <div class="review-meta"> <img src="https://cdn.trustpilot.net/brand-assets/4.1.0/stars/stars-3.svg" alt="3 stars" class="review-stars"> <span class="review-time">10 January 2026</span> </div> </div> <h5 class="review-title">Nike Mind 001 — Great sneakers, shipping slightly late</h5> <p class="review-text">Really comfortable and the design is nice. Only downside was a small delay in shipping.</p> </div> <div class="review-item"> <div class="review-header"> <div class="reviewer-info"> <h4 class="reviewer-name">Daniel Moore</h4> <div class="verified-badge"><span class="verified-text">Verified purchase</span><span class="checkmark">✓</span></div> </div> <div class="review-meta"> <img src="https://cdn.trustpilot.net/brand-assets/4.1.0/stars/stars-5.svg" alt="5 stars" class="review-stars"> <span class="review-time">9 January 2026</span> </div> </div> <h5 class="review-title">Nike Mind 002 — Perfect everyday sneakers</h5> <p class="review-text">Super light, very comfortable and they look great with jeans or joggers. Really happy with my purchase.</p> </div> <div class="review-item"> <div class="review-header"> <div class="reviewer-info"> <h4 class="reviewer-name">Olivia Chen</h4> <div class="verified-badge"><span class="verified-text">Verified purchase</span><span class="checkmark">✓</span></div> </div> <div class="review-meta"> <img src="https://cdn.trustpilot.net/brand-assets/4.1.0/stars/stars-5.svg" alt="5 stars" class="review-stars"> <span class="review-time">8 January 2026</span> </div> </div> <h5 class="review-title">Nike Mind 001 — Stylish and comfy</h5> <p class="review-text">I get compliments every time I wear them. Fit is true to size and very comfortable for long walks.</p> </div> <div class="review-item"> <div class="review-header"> <div class="reviewer-info"> <h4 class="reviewer-name">Kevin Johnson</h4> <div class="verified-badge"><span class="verified-text">Verified purchase</span><span class="checkmark">✓</span></div> </div> <div class="review-meta"> <img src="https://cdn.trustpilot.net/brand-assets/4.1.0/stars/stars-4.svg" alt="4 stars" class="review-stars"> <span class="review-time">7 January 2026</span> </div> </div> <h5 class="review-title">Nike Mind 002 — Great value for money</h5> <p class="review-text">Quality is better than I expected for the price. Delivery was fast too. Would buy again.</p> </div> <div class="review-item"> <div class="review-header"> <div class="reviewer-info"> <h4 class="reviewer-name">Laura Martinez</h4> <div class="verified-badge"><span class="verified-text">Verified purchase</span><span class="checkmark">✓</span></div> </div> <div class="review-meta"> <img src="https://cdn.trustpilot.net/brand-assets/4.1.0/stars/stars-5.svg" alt="5 stars" class="review-stars"> <span class="review-time">6 January 2026</span> </div> </div> <h5 class="review-title">Nike Mind 001 — So comfortable!</h5> <p class="review-text">I work standing all day and these are a lifesaver. Super comfy and they still look brand new.</p> </div> <div class="review-item"> <div class="review-header"> <div class="reviewer-info"> <h4 class="reviewer-name">Thomas Nguyen</h4> <div class="verified-badge"><span class="verified-text">Verified purchase</span><span class="checkmark">✓</span></div> </div> <div class="review-meta"> <img src="https://cdn.trustpilot.net/brand-assets/4.1.0/stars/stars-4.svg" alt="4 stars" class="review-stars"> <span class="review-time">5 January 2026</span> </div> </div> <h5 class="review-title">Nike Mind 002 — Very good overall</h5> <p class="review-text">Comfortable, nice design and easy to match with outfits. Only wish there were more color options.</p> </div> <div class="review-item"> <div class="review-header"> <div class="reviewer-info"> <h4 class="reviewer-name">Emily Rogers</h4> <div class="verified-badge"><span class="verified-text">Verified purchase</span><span class="checkmark">✓</span></div> </div> <div class="review-meta"> <img src="https://cdn.trustpilot.net/brand-assets/4.1.0/stars/stars-5.svg" alt="5 stars" class="review-stars"> <span class="review-time">4 January 2026</span> </div> </div> <h5 class="review-title">Nike Mind 001 — My new favorite shoes</h5> <p class="review-text">Honestly obsessed. They are comfortable, stylish and feel premium. Already thinking about ordering another pair.</p> </div> <div class="review-item"> <div class="review-header"> <div class="reviewer-info"> <h4 class="reviewer-name">Jordan Williams</h4> <div class="verified-badge"><span class="verified-text">Verified purchase</span><span class="checkmark">✓</span></div> </div> <div class="review-meta"> <img src="https://cdn.trustpilot.net/brand-assets/4.1.0/stars/stars-4.svg" alt="4 stars" class="review-stars"> <span class="review-time">3 January 2026</span> </div> </div> <h5 class="review-title">Nike Mind 002 — Solid everyday pair</h5> <p class="review-text">Very comfortable for daily use. Shipping took one extra day but product quality is top.</p> </div> <div class="review-item"> <div class="review-header"> <div class="reviewer-info"> <h4 class="reviewer-name">Sophie Dubois</h4> <div class="verified-badge"><span class="verified-text">Verified purchase</span><span class="checkmark">✓</span></div> </div> <div class="review-meta"> <img src="https://cdn.trustpilot.net/brand-assets/4.1.0/stars/stars-5.svg" alt="5 stars" class="review-stars"> <span class="review-time">2 January 2026</span> </div> </div> <h5 class="review-title">Nike Mind 001 — Très belles et confortables</h5> <p class="review-text">Elles sont encore plus jolies en vrai. Très confortables pour marcher toute la journée.</p> </div> <div class="review-item"> <div class="review-header"> <div class="reviewer-info"> <h4 class="reviewer-name">Alex Turner</h4> <div class="verified-badge"><span class="verified-text">Verified purchase</span><span class="checkmark">✓</span></div> </div> <div class="review-meta"> <img src="https://cdn.trustpilot.net/brand-assets/4.1.0/stars/stars-5.svg" alt="5 stars" class="review-stars"> <span class="review-time">1 January 2026</span> </div> </div> <h5 class="review-title">Nike Mind 002 — Amazing comfort</h5> <p class="review-text">Super comfortable from the first wear. No break-in needed and the style is clean.</p> </div> <div class="review-item"> <div class="review-header"> <div class="reviewer-info"> <h4 class="reviewer-name">Chloe Bernard</h4> <div class="verified-badge"><span class="verified-text">Verified purchase</span><span class="checkmark">✓</span></div> </div> <div class="review-meta"> <img src="https://cdn.trustpilot.net/brand-assets/4.1.0/stars/stars-5.svg" alt="5 stars" class="review-stars"> <span class="review-time">31 December 2025</span> </div> </div> <h5 class="review-title">Nike Mind 001 — Parfaites pour tous les jours</h5> <p class="review-text">Je les porte tous les jours, elles vont avec tout et sont super confortables.</p> </div> <div class="review-item"> <div class="review-header"> <div class="reviewer-info"> <h4 class="reviewer-name">Brian Scott</h4> <div class="verified-badge"><span class="verified-text">Verified purchase</span><span class="checkmark">✓</span></div> </div> <div class="review-meta"> <img src="https://cdn.trustpilot.net/brand-assets/4.1.0/stars/stars-4.svg" alt="4 stars" class="review-stars"> <span class="review-time">30 December 2025</span> </div> </div> <h5 class="review-title">Nike Mind 002 — Really good overall</h5> <p class="review-text">Comfort and design are great. Would have given 5 stars if shipping was a bit faster.</p> </div> <div class="review-item"> <div class="review-header"> <div class="reviewer-info"> <h4 class="reviewer-name">Inès Morel</h4> <div class="verified-badge"><span class="verified-text">Verified purchase</span><span class="checkmark">✓</span></div> </div> <div class="review-meta"> <img src="https://cdn.trustpilot.net/brand-assets/4.1.0/stars/stars-5.svg" alt="5 stars" class="review-stars"> <span class="review-time">29 December 2025</span> </div> </div> <h5 class="review-title">Nike Mind 001 — Trop belles</h5> <p class="review-text">Très bonne qualité et hyper confort. Je recommande à 100%.</p> </div> <div class="review-item"> <div class="review-header"> <div class="reviewer-info"> <h4 class="reviewer-name">Mark Peterson</h4> <div class="verified-badge"><span class="verified-text">Verified purchase</span><span class="checkmark">✓</span></div> </div> <div class="review-meta"> <img src="https://cdn.trustpilot.net/brand-assets/4.1.0/stars/stars-5.svg" alt="5 stars" class="review-stars"> <span class="review-time">28 December 2025</span> </div> </div> <h5 class="review-title">Nike Mind 002 — Worth every penny</h5> <p class="review-text">They feel premium and are extremely comfortable. Definitely buying again.</p> </div> <div class="review-item"> <div class="review-header"> <div class="reviewer-info"> <h4 class="reviewer-name">Sarah Lopez</h4> <div class="verified-badge"><span class="verified-text">Verified purchase</span><span class="checkmark">✓</span></div> </div> <div class="review-meta"> <img src="https://cdn.trustpilot.net/brand-assets/4.1.0/stars/stars-4.svg" alt="4 stars" class="review-stars"> <span class="review-time">27 December 2025</span> </div> </div> <h5 class="review-title">Nike Mind 001 — Very happy with them</h5> <p class="review-text">Comfortable and stylish. Just wish they had more color options.</p> </div> <div class="review-item"> <div class="review-header"> <div class="reviewer-info"> <h4 class="reviewer-name">Yanis El Amrani</h4> <div class="verified-badge"><span class="verified-text">Verified purchase</span><span class="checkmark">✓</span></div> </div> <div class="review-meta"> <img src="https://cdn.trustpilot.net/brand-assets/4.1.0/stars/stars-5.svg" alt="5 stars" class="review-stars"> <span class="review-time">26 December 2025</span> </div> </div> <h5 class="review-title">Nike Mind 002 — Incroyables</h5> <p class="review-text">Franchement super confort, je peux marcher toute la journée sans problème.</p> </div> <div class="review-item"> <div class="review-header"> <div class="reviewer-info"> <h4 class="reviewer-name">David Kim</h4> <div class="verified-badge"><span class="verified-text">Verified purchase</span><span class="checkmark">✓</span></div> </div> <div class="review-meta"> <img src="https://cdn.trustpilot.net/brand-assets/4.1.0/stars/stars-5.svg" alt="5 stars" class="review-stars"> <span class="review-time">25 December 2025</span> </div> </div> <h5 class="review-title">Nike Mind 001 — Perfect fit</h5> <p class="review-text">True to size, super comfy and very light. Great for daily wear.</p> </div> <div class="review-item"> <div class="review-header"> <div class="reviewer-info"> <h4 class="reviewer-name">Camille Laurent</h4> <div class="verified-badge"><span class="verified-text">Verified purchase</span><span class="checkmark">✓</span></div> </div> <div class="review-meta"> <img src="https://cdn.trustpilot.net/brand-assets/4.1.0/stars/stars-5.svg" alt="5 stars" class="review-stars"> <span class="review-time">24 December 2025</span> </div> </div> <h5 class="review-title">Nike Mind 002 — Mon meilleur achat</h5> <p class="review-text">Elles sont magnifiques et vraiment agréables à porter au quotidien.</p> </div> <div class="review-item"> <div class="review-header"> <div class="reviewer-info"> <h4 class="reviewer-name">Jason Miller</h4> <div class="verified-badge"><span class="verified-text">Verified purchase</span><span class="checkmark">✓</span></div> </div> <div class="review-meta"> <img src="https://cdn.trustpilot.net/brand-assets/4.1.0/stars/stars-4.svg" alt="4 stars" class="review-stars"> <span class="review-time">23 December 2025</span> </div> </div> <h5 class="review-title">Nike Mind 001 — Very solid sneakers</h5> <p class="review-text">Good quality, comfortable and look clean. Delivery took a bit longer than expected.</p> </div> <div class="review-item"> <div class="review-header"> <div class="reviewer-info"> <h4 class="reviewer-name">Nora Ali</h4> <div class="verified-badge"><span class="verified-text">Verified purchase</span><span class="checkmark">✓</span></div> </div> <div class="review-meta"> <img src="https://cdn.trustpilot.net/brand-assets/4.1.0/stars/stars-5.svg" alt="5 stars" class="review-stars"> <span class="review-time">22 December 2025</span> </div> </div> <h5 class="review-title">Nike Mind 002 — Love them!</h5> <p class="review-text">They are even better than expected. Comfortable and very stylish.</p> </div> <div class="review-item"> <div class="review-header"> <div class="reviewer-info"> <h4 class="reviewer-name">Lucas Martin</h4> <div class="verified-badge"><span class="verified-text">Verified purchase</span><span class="checkmark">✓</span></div> </div> <div class="review-meta"> <img src="https://cdn.trustpilot.net/brand-assets/4.1.0/stars/stars-5.svg" alt="5 stars" class="review-stars"> <span class="review-time">21 December 2025</span> </div> </div> <h5 class="review-title">Nike Mind 001 — Très bonne surprise</h5> <p class="review-text">Je ne m’attendais pas à une telle qualité. Très satisfait de mon achat.</p> </div> <div class="review-item"> <div class="review-header"> <div class="reviewer-info"> <h4 class="reviewer-name">Emma Wilson</h4> <div class="verified-badge"><span class="verified-text">Verified purchase</span><span class="checkmark">✓</span></div> </div> <div class="review-meta"> <img src="https://cdn.trustpilot.net/brand-assets/4.1.0/stars/stars-5.svg" alt="5 stars" class="review-stars"> <span class="review-time">20 December 2025</span> </div> </div> <h5 class="review-title">Nike Mind 002 — So stylish</h5> <p class="review-text">They look amazing with every outfit and are super comfortable.</p> </div> <div class="review-item"> <div class="review-header"> <div class="reviewer-info"> <h4 class="reviewer-name">Hugo Pereira</h4> <div class="verified-badge"><span class="verified-text">Verified purchase</span><span class="checkmark">✓</span></div> </div> <div class="review-meta"> <img src="https://cdn.trustpilot.net/brand-assets/4.1.0/stars/stars-4.svg" alt="4 stars" class="review-stars"> <span class="review-time">19 December 2025</span> </div> </div> <h5 class="review-title">Nike Mind 001 — Très bon rapport qualité/prix</h5> <p class="review-text">Confort au top et design propre. Livraison légèrement lente mais produit nickel.</p> </div> </div> <style> /* ✅ Scoping total: évite les conflits CSS du thème/apps */ #reviews-{{ section.id }}.reviews-section { max-width: {{ section.settings.max_width | default: 1200 }}px; margin: 0 auto; padding: {{ section.settings.padding_vertical | default: 40 }}px {{ section.settings.padding_horizontal | default: 20 }}px; font-family: {{ section.settings.font_family | default: 'Arial, sans-serif' }}; } #reviews-{{ section.id }} .reviews-title { text-align: center; font-size: {{ section.settings.title_font_size | default: 24 }}px; font-weight: {{ section.settings.title_font_weight | default: 700 }}; margin-bottom: {{ section.settings.title_margin_bottom | default: 40 }}px; color: {{ section.settings.title_color | default: '#333' }}; letter-spacing: {{ section.settings.title_letter_spacing | default: 0.5 }}px; } #reviews-{{ section.id }} .reviews-summary { display: grid; grid-template-columns: auto 1fr auto; gap: {{ section.settings.summary_gap | default: 40 }}px; align-items: start; margin-bottom: {{ section.settings.summary_margin_bottom | default: 40 }}px; } #reviews-{{ section.id }} .rating-overview { text-align: center; display: flex; flex-direction: column; align-items: center; } #reviews-{{ section.id }} .rating-score { font-size: {{ section.settings.rating_font_size | default: 32 }}px; font-weight: {{ section.settings.rating_font_weight | default: 700 }}; color: {{ section.settings.rating_color | default: '#333' }}; margin-bottom: 8px; } #reviews-{{ section.id }} .stars-image { width: {{ section.settings.stars_width | default: 120 }}px; height: auto; margin-bottom: 8px; } #reviews-{{ section.id }} .total-reviews { font-size: {{ section.settings.total_reviews_font_size | default: 14 }}px; color: {{ section.settings.total_reviews_color | default: '#666' }}; text-decoration: underline; } /* ✅ BARRES CORRIGÉES */ #reviews-{{ section.id }} .reviews-rating-bars { min-width: {{ section.settings.rating_bars_min_width | default: 300 }}px; } #reviews-{{ section.id }} .reviews-rating-bar { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; } #reviews-{{ section.id }} .reviews-star-count { font-size: 14px; color: #333; width: 8px; } #reviews-{{ section.id }} .reviews-bar-track { flex: 1; height: 8px; background-color: #e0e0e0; border-radius: 4px; overflow: hidden; } #reviews-{{ section.id }} .reviews-bar-fill { display: block; /* très important: certains thèmes mettent inline/width:0 etc */ height: 100%; width: 0%; background-color: {{ section.settings.bar_fill_color | default: '#24bc8c' }}; transition: width 0.3s ease; } #reviews-{{ section.id }} .write-review-section { text-align: center; max-width: 200px; display: flex; flex-direction: column; align-items: center; } #reviews-{{ section.id }} .write-title { font-size: 16px; font-weight: 700; color: #333; margin-bottom: 8px; } #reviews-{{ section.id }} .write-subtitle { font-size: 12px; color: #666; margin-bottom: 16px; line-height: 1.4; } #reviews-{{ section.id }} .write-button { background-color: white; color: #333; border: 2px solid #333; padding: 8px 16px; border-radius: 20px; font-size: 12px; font-weight: 500; cursor: pointer; transition: all 0.3s ease; } #reviews-{{ section.id }} .write-button:hover { background-color: #333; color: white; } #reviews-{{ section.id }} .reviews-list { display: grid; gap: 24px; } #reviews-{{ section.id }} .review-item { border-bottom: 1px solid #eee; padding-bottom: 24px; } #reviews-{{ section.id }} .review-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 12px; } #reviews-{{ section.id }} .reviewer-info { display: flex; flex-direction: column; gap: 4px; } #reviews-{{ section.id }} .reviewer-name { font-size: 16px; font-weight: 600; color: #333; margin: 0; } #reviews-{{ section.id }} .verified-badge { display: flex; align-items: center; gap: 4px; } #reviews-{{ section.id }} .verified-text { font-size: 12px; color: #666; } #reviews-{{ section.id }} .checkmark { width: 16px; height: 16px; background-color: #24bc8c; color: white; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 10px; font-weight: bold; } #reviews-{{ section.id }} .review-meta { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; } #reviews-{{ section.id }} .review-stars { width: 80px; height: auto; } #reviews-{{ section.id }} .review-time { font-size: 12px; color: #999; font-style: italic; } #reviews-{{ section.id }} .review-title { font-size: 16px; font-weight: 600; color: #333; margin: 0 0 8px 0; } #reviews-{{ section.id }} .review-text { font-size: 14px; color: #666; line-height: 1.5; margin: 0; } @media (max-width: 768px) { #reviews-{{ section.id }} .reviews-summary { grid-template-columns: 1fr; gap: 24px; text-align: center; } #reviews-{{ section.id }} .reviews-rating-bars { min-width: 250px; max-width: 280px; margin: 0 auto; width: 100%; } #reviews-{{ section.id }} .reviews-bar-track { height: 6px; } #reviews-{{ section.id }} .reviews-rating-bar { margin-bottom: 8px; } #reviews-{{ section.id }} .reviews-star-count { font-size: 12px; width: 6px; } #reviews-{{ section.id }} .write-review-section { max-width: none; width: 100%; text-align: center; } #reviews-{{ section.id }} .reviews-title { font-size: 18px; margin-bottom: 24px; line-height: 1.3; } #reviews-{{ section.id }} .rating-score { font-size: 28px; } #reviews-{{ section.id }} .stars-image { width: 100px; } #reviews-{{ section.id }} .total-reviews { font-size: 12px; } #reviews-{{ section.id }} .write-title { font-size: 14px; } #reviews-{{ section.id }} .write-subtitle { font-size: 11px; } #reviews-{{ section.id }} .write-button { padding: 6px 12px; font-size: 11px; } #reviews-{{ section.id }} .review-header { flex-direction: column; gap: 8px; align-items: flex-start; } #reviews-{{ section.id }} .review-meta { align-items: flex-start; flex-direction: row; gap: 8px; } } </style> {% schema %} { "name": "Reviews Section", "tag": "section", "class": "section", "settings": [ { "type": "text", "id": "title", "label": "Titre principal", "default": "HEAR IT FROM OUR HAPPY CUSTOMERS" }, { "type": "range", "id": "title_font_size", "min": 16, "max": 48, "step": 2, "unit": "px", "label": "Taille de police du titre", "default": 24 }, { "type": "select", "id": "title_font_weight", "label": "Poids de police du titre", "options": [ { "value": "600", "label": "Semi-bold" }, { "value": "700", "label": "Bold" }, { "value": "800", "label": "Extra-bold" }, { "value": "900", "label": "Black" } ], "default": "700" }, { "type": "color", "id": "title_color", "label": "Couleur du titre", "default": "#333333" }, { "type": "range", "id": "title_margin_bottom", "min": 20, "max": 80, "step": 10, "unit": "px", "label": "Marge inférieure du titre", "default": 40 }, { "type": "range", "id": "title_letter_spacing", "min": 0, "max": 2, "step": 0.1, "unit": "px", "label": "Espacement des lettres du titre", "default": 0.5 }, { "type": "text", "id": "rating_score", "label": "Score de notation", "default": "4,9/5" }, { "type": "range", "id": "rating_font_size", "min": 20, "max": 60, "step": 2, "unit": "px", "label": "Taille de police du score", "default": 32 }, { "type": "select", "id": "rating_font_weight", "label": "Poids de police du score", "options": [ { "value": "600", "label": "Semi-bold" }, { "value": "700", "label": "Bold" }, { "value": "800", "label": "Extra-bold" }, { "value": "900", "label": "Black" } ], "default": "700" }, { "type": "color", "id": "rating_color", "label": "Couleur du score", "default": "#333333" }, { "type": "image_picker", "id": "stars_image", "label": "Image des étoiles" }, { "type": "range", "id": "stars_width", "min": 60, "max": 200, "step": 10, "unit": "px", "label": "Largeur de l'image des étoiles", "default": 120 }, { "type": "text", "id": "total_reviews", "label": "Total des avis", "default": "+10,500 reviews" }, { "type": "range", "id": "total_reviews_font_size", "min": 10, "max": 20, "step": 1, "unit": "px", "label": "Taille de police du total", "default": 14 }, { "type": "color", "id": "total_reviews_color", "label": "Couleur du total", "default": "#666666" }, { "type": "range", "id": "five_star_percentage", "min": 0, "max": 100, "step": 1, "unit": "%", "label": "Pourcentage 5 étoiles", "default": 85 }, { "type": "range", "id": "four_star_percentage", "min": 0, "max": 100, "step": 1, "unit": "%", "label": "Pourcentage 4 étoiles", "default": 12 }, { "type": "range", "id": "three_star_percentage", "min": 0, "max": 100, "step": 1, "unit": "%", "label": "Pourcentage 3 étoiles", "default": 2 }, { "type": "range", "id": "two_star_percentage", "min": 0, "max": 100, "step": 1, "unit": "%", "label": "Pourcentage 2 étoiles", "default": 1 }, { "type": "range", "id": "one_star_percentage", "min": 0, "max": 100, "step": 1, "unit": "%", "label": "Pourcentage 1 étoile", "default": 0 }, { "type": "color", "id": "bar_fill_color", "label": "Couleur de remplissage des barres", "default": "#24bc8c" }, { "type": "range", "id": "rating_bars_min_width", "min": 200, "max": 500, "step": 10, "unit": "px", "label": "Largeur minimum des barres", "default": 300 }, { "type": "text", "id": "write_title", "label": "Titre de la section d'écriture", "default": "WRITE A REVIEW" }, { "type": "text", "id": "write_subtitle", "label": "Sous-titre de la section d'écriture", "default": "Share your experience with other customers" }, { "type": "text", "id": "write_button_text", "label": "Texte du bouton d'écriture", "default": "Write a review" }, { "type": "range", "id": "max_width", "min": 800, "max": 1600, "step": 100, "unit": "px", "label": "Largeur maximum de la section", "default": 1200 }, { "type": "range", "id": "padding_vertical", "min": 20, "max": 100, "step": 10, "unit": "px", "label": "Padding vertical", "default": 40 }, { "type": "range", "id": "padding_horizontal", "min": 10, "max": 100, "step": 10, "unit": "px", "label": "Padding horizontal", "default": 20 }, { "type": "range", "id": "summary_gap", "min": 20, "max": 80, "step": 10, "unit": "px", "label": "Espacement du résumé", "default": 40 }, { "type": "range", "id": "summary_margin_bottom", "min": 20, "max": 80, "step": 10, "unit": "px", "label": "Marge inférieure du résumé", "default": 40 }, { "type": "select", "id": "font_family", "label": "Famille de police", "options": [ { "value": "Arial, sans-serif", "label": "Arial" }, { "value": "Helvetica, sans-serif", "label": "Helvetica" }, { "value": "Georgia, serif", "label": "Georgia" }, { "value": "Times New Roman, serif", "label": "Times New Roman" } ], "default": "Arial, sans-serif" } ], "blocks": [ { "type": "review", "name": "Review", "settings": [ { "type": "text", "id": "reviewer_name", "label": "Nom du client", "default": "Customer" }, { "type": "text", "id": "verified_text", "label": "Texte de vérification", "default": "Verified Buyer" }, { "type": "image_picker", "id": "stars_image", "label": "Image des étoiles" }, { "type": "text", "id": "review_time", "label": "Temps de l'avis", "default": "Recently" }, { "type": "text", "id": "review_title", "label": "Titre de l'avis", "default": "Great product!" }, { "type": "textarea", "id": "review_text", "label": "Texte de l'avis", "default": "Amazing quality and fast delivery. Highly recommend!" } ] } ], "presets": [ { "name": "Reviews Section", "blocks": [ { "type": "review" }, { "type": "review" }, { "type": "review" }, { "type": "review" } ] } ] } {% endschema %}

traduit en francais et pareil en parlant des miroirs <section class="faq-img-section" id="section-{{ section.id }}"> <div class="faq-img__container"> <div class="faq-img__left"> {% if section.settings.heading != blank %} <h2 class="faq__heading">{{ section.settings.heading }}</h2> {% endif %} <div class="faq__list" role="list"> {% for block in section.blocks %} {% assign q = block.settings.question %} {% assign a = block.settings.answer %} {% assign icon = block.settings.icon | default: "❓" %} {% capture btn_id %}faq-btn-{{ section.id }}-{{ forloop.index }}{% endcapture %} {% capture panel_id %}faq-panel-{{ section.id }}-{{ forloop.index }}{% endcapture %} <div class="faq__item" role="listitem" {{ block.shopify_attributes }}> <button id="{{ btn_id }}" class="faq__button" aria-expanded="false" aria-controls="{{ panel_id }}" > <span class="faq__icon" aria-hidden="true">{{ icon }}</span> <span class="faq__question">{{ q | escape }}</span> <span class="faq__close" aria-hidden="true">&times;</span> </button> <div id="{{ panel_id }}" class="faq__panel" role="region" aria-labelledby="{{ btn_id }}"> <div class="faq__answer rte"> {{ a }} </div> </div> </div> {% endfor %} </div> </div> <div class="faq-img__right"> {% if section.settings.image != blank %} <div class="faq__image-wrap"> <img class="faq__image" srcset="{{ section.settings.image | image_url: width: 560 }} 560w, {{ section.settings.image | image_url: width: 720 }} 720w, {{ section.settings.image | image_url: width: 960 }} 960w, {{ section.settings.image | image_url: width: 1200 }} 1200w, {{ section.settings.image | image_url: width: 1440 }} 1440w, {{ section.settings.image | image_url: width: 1680 }} 1680w, {{ section.settings.image | image_url: width: 1920 }} 1920w" sizes="(min-width: 1200px) 50vw, 100vw" src="{{ section.settings.image | image_url: width: 1200 }}" alt="{{ section.settings.image.alt | escape }}" loading="lazy" > </div> {% endif %} </div> </div> <style> #section-{{ section.id }} .faq-img__container{ display:grid; grid-template-columns: 1fr; gap: 24px; align-items: stretch; max-width: {{ section.settings.max_width }}px; margin: 0 auto; padding: clamp(16px, 3vw, 32px); } @media (min-width: 992px){ #section-{{ section.id }} .faq-img__container{ grid-template-columns: 1.1fr 1fr; gap: 32px; } } #section-{{ section.id }} .faq__heading{ margin: 0 0 12px 0; font-size: clamp(20px, 2.2vw, 26px); font-weight: 700; color: {{ section.settings.heading_color }}; } #section-{{ section.id }} .faq__list{ display:flex; flex-direction:column; gap: 14px; } #section-{{ section.id }} .faq__item{ border-radius: 10px; background: #fff; border: 1px solid rgba(0,0,0,0.08); box-shadow: 0 1px 0 rgba(0,0,0,0.03); overflow: hidden; } #section-{{ section.id }} .faq__button{ width:100%; display:grid; grid-template-columns: auto 1fr auto; align-items:center; gap:10px; padding: 14px 16px; text-align:left; cursor:pointer; background: #fff; border: 0; font: inherit; color: {{ section.settings.question_color }}; } #section-{{ section.id }} .faq__button:focus{ outline: 2px solid {{ section.settings.accent }}; outline-offset: 2px; border-radius: 8px; } #section-{{ section.id }} .faq__icon{ font-size: 20px; line-height: 1; } #section-{{ section.id }} .faq__question{ font-weight: 700; font-size: 16px; } #section-{{ section.id }} .faq__close{ font-size: 18px; opacity: .6; transform: rotate(45deg); transition: transform .25s ease, opacity .25s ease; } #section-{{ section.id }} .faq__button[aria-expanded="true"] .faq__close{ transform: rotate(0deg); opacity: 1; } #section-{{ section.id }} .faq__panel{ display: none; border-top: 1px solid rgba(0,0,0,0.06); background: #fff; } #section-{{ section.id }} .faq__panel.is-open{ display:block; } #section-{{ section.id }} .faq__answer{ padding: 12px 16px 16px 50px; color: {{ section.settings.answer_color }}; font-size: 15px; line-height: 1.55; } #section-{{ section.id }} .faq__image-wrap{ position: relative; width: 100%; height: 100%; min-height: 340px; border-radius: 12px; overflow: hidden; background: #f3f3f3; } #section-{{ section.id }} .faq__image{ width: 100%; height: 100%; object-fit: cover; display: block; } #section-{{ section.id }}{ background: {{ section.settings.bg }}; } </style> <script> (function(){ const root = document.getElementById('section-{{ section.id }}'); if(!root) return; const items = root.querySelectorAll('.faq__item'); items.forEach((item, i) => { const btn = item.querySelector('.faq__button'); const panel = item.querySelector('.faq__panel'); if(!btn || !panel) return; function toggle(open){ const expanded = open ?? (btn.getAttribute('aria-expanded') !== 'true'); {% if section.settings.single_open %} root.querySelectorAll('.faq__button[aria-expanded="true"]').forEach(b=>{ if(b !== btn){ b.setAttribute('aria-expanded','false'); const p = document.getElementById(b.getAttribute('aria-controls')); if(p) p.classList.remove('is-open'); } }); {% endif %} btn.setAttribute('aria-expanded', expanded ? 'true' : 'false'); panel.classList.toggle('is-open', expanded); } btn.addEventListener('click', () => toggle()); btn.addEventListener('keydown', (e) => { if(e.key === 'Enter' || e.key === ' '){ e.preventDefault(); toggle(); } }); {% if section.settings.open_first %} if (i === 0) { toggle(true); } {% endif %} }); })(); </script> </section> {% schema %} { "name": "FAQ + Image", "tag": "section", "class": "section", "settings": [ { "type": "text", "id": "heading", "label": "Heading (optional)", "default": "FAQ" }, { "type": "image_picker", "id": "image", "label": "Right-side image" }, { "type": "range", "id": "max_width", "label": "Max width (px)", "min": 900, "max": 1600, "step": 10, "default": 1400 }, { "type": "checkbox", "id": "single_open", "label": "Only one item open at a time", "default": true }, { "type": "checkbox", "id": "open_first", "label": "Open the first item by default", "default": false }, { "type": "header", "content": "Colors" }, { "type": "color", "id": "bg", "label": "Section background", "default": "#FAF7F2" }, { "type": "color", "id": "heading_color", "label": "Heading color", "default": "#111111" }, { "type": "color", "id": "question_color", "label": "Question color", "default": "#111111" }, { "type": "color", "id": "answer_color", "label": "Answer color", "default": "#333333" }, { "type": "color", "id": "accent", "label": "Accent color (focus)", "default": "#111111" } ], "blocks": [ { "type": "faq", "name": "Question / Answer", "settings": [ { "type": "text", "id": "icon", "label": "Emoji / Icon (e.g. 🚚, 📏, ✅, 🔁)", "default": "❓" }, { "type": "text", "id": "question", "label": "Question", "default": "Your question here" }, { "type": "richtext", "id": "answer", "label": "Answer", "default": "<p>Your detailed answer here.</p>" } ] } ], "presets": [ { "name": "FAQ + Image", "blocks": [ { "type": "faq", "settings": { "icon": "✅", "question": "Are Nike Mind 001 and Nike Mind 002 authentic?", "answer": "<p>Yes. We sell <strong>100% genuine</strong> Nike Mind 001 and Nike Mind 002. Each pair is carefully checked before shipping.</p>" } }, { "type": "faq", "settings": { "icon": "📦", "question": "What are the shipping times?", "answer": "<p>Orders are processed quickly and delivered in <strong>8–10 business days</strong> on average (depending on your location).</p>" } }, { "type": "faq", "settings": { "icon": "📏", "question": "How do I choose the right size?", "answer": "<p>We recommend choosing your usual Nike size. If you are between sizes, consider sizing up. If you need help, contact us before ordering.</p>" } }, { "type": "faq", "settings": { "icon": "🔁", "question": "Can I return or exchange my order?", "answer": "<p>Yes. You have <strong>30 days</strong> after delivery to request a return or exchange, as long as items are new and unused.</p>" } }, { "type": "faq", "settings": { "icon": "🧾", "question": "What’s included in the package?", "answer": "<p>You receive the Nike Mind 001 or Nike Mind 002 pair (as ordered) with its original accessories/packaging when provided by Nike.</p>" } } ] } ] } {% endschema %}

pareil pour lui {% comment %} Section: Why choose Pimz Addict? - Centered heading + subheading - Grid of 4 benefits (icon + title + text) - Fully customizable from the theme editor {% endcomment %} <section id="why-choose-{{ section.id }}" class="why-choose"> <div class="why-choose__inner"> {% if section.settings.heading != blank %} <h2 class="why-choose__heading">{{ section.settings.heading }}</h2> {% endif %} {% if section.settings.subheading != blank %} <p class="why-choose__subheading">{{ section.settings.subheading }}</p> {% endif %} <div class="why-choose__grid"> {% for block in section.blocks %} {% if block.type == 'feature' %} <div class="why-choose__card" {{ block.shopify_attributes }}> {% if block.settings.icon != blank %} <div class="why-choose__icon-wrap" style="--icon-size: {{ section.settings.icon_size }}px"> <img class="why-choose__icon" src="{{ block.settings.icon | image_url: width: 240 }}" alt="{{ block.settings.icon_alt | default: block.settings.title | escape }}" loading="lazy"> </div> {% endif %} {% if block.settings.title != blank %} <h3 class="why-choose__title">{{ block.settings.title }}</h3> {% endif %} {% if block.settings.text != blank %} <p class="why-choose__text">{{ block.settings.text }}</p> {% endif %} </div> {% endif %} {% endfor %} </div> </div> <style> #why-choose-{{ section.id }}{ --bg: {{ section.settings.bg }}; --fg: {{ section.settings.fg }}; --muted: {{ section.settings.muted }}; --maxw: {{ section.settings.max_width }}px; --gap: {{ section.settings.gap }}px; background: var(--bg); color: var(--fg); padding: clamp(32px, 6vw, 72px) 16px; } #why-choose-{{ section.id }} .why-choose__inner{ max-width: var(--maxw); margin: 0 auto; text-align: center; } #why-choose-{{ section.id }} .why-choose__heading{ font-size: clamp(28px, 3.2vw, 40px); line-height: 1.2; margin: 0 0 10px; font-weight: 800; letter-spacing: .2px; } #why-choose-{{ section.id }} .why-choose__subheading{ max-width: 1100px; margin: 0 auto clamp(28px, 4.2vw, 48px); font-size: clamp(15px, 1.35vw, 18px); line-height: 1.6; color: var(--muted); } #why-choose-{{ section.id }} .why-choose__grid{ display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: var(--gap); align-items: start; } #why-choose-{{ section.id }} .why-choose__card{ display: flex; flex-direction: column; align-items: center; gap: 12px; padding: clamp(8px, 1vw, 12px); } #why-choose-{{ section.id }} .why-choose__icon-wrap{ width: var(--icon-size); height: var(--icon-size); border-radius: 22px; background: rgba(0,0,0,.06); display: grid; place-items: center; margin-bottom: 8px; } #why-choose-{{ section.id }} .why-choose__icon{ width: calc(var(--icon-size) - 18px); height: calc(var(--icon-size) - 18px); object-fit: contain; display: block; } #why-choose-{{ section.id }} .why-choose__title{ font-size: clamp(14px, 1.15vw, 16px); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; margin: 0; } #why-choose-{{ section.id }} .why-choose__text{ font-size: clamp(14px, 1.05vw, 16px); line-height: 1.6; color: var(--muted); margin: 0; max-width: 340px; } @media (max-width: 1024px){ #why-choose-{{ section.id }} .why-choose__grid{ grid-template-columns: repeat(2, minmax(0,1fr)); } } @media (max-width: 640px){ #why-choose-{{ section.id }} .why-choose__grid{ grid-template-columns: 1fr; } #why-choose-{{ section.id }} .why-choose__icon-wrap{ margin-bottom: 6px; } } </style> </section> {% schema %} { "name": "Why choose Pimz Addict?", "tag": "section", "class": "section", "settings": [ { "type": "text", "id": "heading", "label": "Heading", "default": "Why choose Pimz Addict?" }, { "type": "textarea", "id": "subheading", "label": "Subheading", "default": "At Pimz Addict, our mission is simple: to offer you stylish Clogs and unique Pins at the best price. Comfort, fun and personalization… everything is designed so your shoes truly reflect your personality." }, { "type": "range", "id": "icon_size", "min": 56, "max": 104, "step": 4, "unit": "px", "label": "Icon size", "default": 80 }, { "type": "range", "id": "gap", "min": 12, "max": 40, "step": 2, "unit": "px", "label": "Grid spacing", "default": 28 }, { "type": "range", "id": "max_width", "min": 900, "max": 1600, "step": 50, "unit": "px", "label": "Max content width", "default": 1200 }, { "type": "color", "id": "bg", "label": "Background color", "default": "#F4EA83" }, { "type": "color", "id": "fg", "label": "Text color", "default": "#111111" }, { "type": "color", "id": "muted", "label": "Secondary text color", "default": "#3a3a3a" } ], "blocks": [ { "type": "feature", "name": "Benefit", "settings": [ { "type": "image_picker", "id": "icon", "label": "Icon" }, { "type": "text", "id": "icon_alt", "label": "Icon alt text" }, { "type": "text", "id": "title", "label": "Title", "default": "FAST DELIVERY" }, { "type": "textarea", "id": "text", "label": "Description", "default": "Delivery within 8 to 10 business days." } ] } ], "presets": [ { "name": "Why choose Pimz Addict?", "blocks": [ { "type": "feature", "settings": { "title": "FAST DELIVERY", "text": "Delivery guaranteed within 8 to 10 business days." } }, { "type": "feature", "settings": { "title": "BEST PRICES ON THE MARKET", "text": "The lowest prices, even on exclusive pins." } }, { "type": "feature", "settings": { "title": "24/7 CUSTOMER SUPPORT", "text": "A member of our team will be happy to answer your questions anytime." } }, { "type": "feature", "settings": { "title": "4.8 STAR OVERALL RATING", "text": "Our customers have given us an average rating of 4.8 stars." } } ] } ] } {% endschema %}

fait mes conditions generales de vents stp

miroirpropre delai de livraison 3-4 jours