index-bulma.html

---
layout: bulma
loop_list: [1,2,3,4,5,6,7,8,9,10,11,12]
---
<section class="section">
    <div class="container">
        <h1 class="title">Bulma Example</h1>
    <div class="columns is-multiline">
        {% for idx in page.loop_list %}
        <div class="column is-one-third-tablet is-one-quarter-desktop">
            <div class="card">
                <div class="card-image">
                    <figure class="image is-4by3">
                      <img src="https://placeimg.com/640/480/any/{{idx}}" alt="Placeholder image">
                    </figure>
                </div>
                <div class="card-content">
                    <div class="content">
                       <p class="title">Card title</p>
                       Lorem ipsum dolor sit amet, consectetur adipiscing elit.
                       Phasellus nec iaculis mauris.
                    </div>
                </div>
            </div>
        </div>
        {% endfor %}
    </div>
</div>
</section>