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">
                <div>
                <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>
            </div>
        {{ end }}
        </div>
        </div>
    </div>
</main>
{{ end }}