Bootstrap 5 is missing card-columns, use masonry instead
This commit is contained in:
parent
1523b23ba3
commit
396dbec50d
|
@ -58,9 +58,10 @@
|
||||||
|
|
||||||
{{ render_pagination(pager) }}
|
{{ render_pagination(pager) }}
|
||||||
|
|
||||||
<div class="card-columns">
|
<div class="row" data-masonry='{"percentPosition": true }'>
|
||||||
{% for item in items %}
|
{% for item in items %}
|
||||||
{% set image = item.image %}
|
{% set image = item.image %}
|
||||||
|
<div class="col-sm-6 col-lg-4 mb-4">
|
||||||
<div class="card">
|
<div class="card">
|
||||||
<a href="{{ url_for('item_page', item_id=item.item_id) }}">
|
<a href="{{ url_for('item_page', item_id=item.item_id) }}">
|
||||||
{# <img src="{{ image.thumburl }}" height="{{ image.thumbheight }}" width="{{ image.thumbwidth }}" class="card-img-top"></a> #}
|
{# <img src="{{ image.thumburl }}" height="{{ image.thumbheight }}" width="{{ image.thumbwidth }}" class="card-img-top"></a> #}
|
||||||
|
@ -86,6 +87,7 @@
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
{% endfor %}
|
{% endfor %}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
@ -95,6 +97,8 @@
|
||||||
{% endblock %}
|
{% endblock %}
|
||||||
|
|
||||||
{% block script %}
|
{% block script %}
|
||||||
|
<script src="https://cdn.jsdelivr.net/npm/masonry-layout@4.2.2/dist/masonry.pkgd.min.js" integrity="sha384-GNFwBvfVxBkLMJpYMOABq3c+d3KnQxudP/mGPkzpZSTYykLBNsZEnG2D9G/X/+7D" crossorigin="anonymous" async></script>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
$('#filters').hide();
|
$('#filters').hide();
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue