startbootstrap/_layouts/loop-themes.html

---
layout: default
---

{% include masthead/masthead-page.html %}

<div class="container">

    <!-- Show paginated posts for the specified collection -->
    <div class="row">

        {% assign sorted = site.themes | sort: "rank" %}
        {% for theme in sorted %}

        <div class="col-md-4">
            <div class="item-preview mb-5">
                {% if theme.update %}
                    <span class="badge badge-info position-absolute badge-pill" style="right: -.5rem; top: -.5rem; z-index: 999;">Updated!</span>
                {% endif %}
                <a class="item-preview-img box-shadow-lg d-block mb-3" href="{{ theme.src }}">
                    <img class="lazy img-fluid" data-src="{{ theme.img-thumbnail }}" alt="{{ theme.img-desc }}">
                </a>
                <div class="item-preview-title d-flex align-items-center">
                    {{ theme.title }}
                    {% if theme.pro %}
                    <span class='badge badge-warning ml-auto small badge-pill'>Pro</span>
                    {% else %}
                    <span class='badge badge-success ml-auto small badge-pill'>Free</span>
                    {% endif %}
                </div>
                <div class="item-preview-description">{{ theme.bump }}</div>
            </div>
        </div>

        {% endfor %}

        {% include survey.html %}

    </div>
    <!-- /.row -->

</div>
<!-- /.container -->

{{ content }}