website/layouts/tarifs/section.html

{{ define "main" }}
<main class="large-container">
	{{ .Content }}
    <div class="pricing-layout"> 
        <div>
            <div class="moves">
                <h2>Forfait déplacement</h2>
                <ul>
                    {{ range $.Site.Data.pricing.move }}
                        <li class="move-item">
                            De {{ .min }} à {{ .max }} km : <span class="move-price">{{ if eq .price 0 }}Gratuit{{ else }}{{ .price }} €{{ end }}</span>
                        </li>
                    {{ end }}
                </ul>
            </div>

            <div class="forfaits">
                {{ range $.Site.Data.pricing.forfait }}
                    <div class="forfait">
                    <h2>{{ .name }}</h2>
                    <div class="forfait-price">{{ .price }} €</div>
                    <ul>    
                    {{ range .components }}
                    <li>{{ .name }}</li>
                    {{ end }}
                    </ul>
                    </div>
                {{ end }}
            </div>
        </div>

        <div class="operations-container">
            <h2>Liste des opérations</h2>
            <div class="operations-mosaic">
                {{ range $.Site.Data.pricing.standalone }}
                    <div class="operations-category">
                        <h3>{{ .name }}</h3>
                        <table cellspacing="0" cellpadding="0" class="operations-table">
                            <tr>
                                <th>Opération</th>
                                <th class="operation-price">Prix</th>
                            </tr>
                            {{ range .components }}
                            <tr>
                                <td>{{ .name }}</td>
                                <td class="operation-price">{{ .price }} €</td>
                            </tr>
                            {{ end }}
                        </table>
                    </div>
                {{ end }}
            </div>
        </div>
    </div>
</main>
{{ end }}