Mirrors/tabler
1
0
Fork 0
mirror of https://github.com/tabler/tabler.git synced 2026-07-22 05:21:45 +04:00
Code Issues Projects Releases Wiki Activity
Files
886965375efa88ca5f51cf9dc8f2ca62182f65f7
tabler/pages/_includes/cards/feed-card.html
T
chomik ab3aec2eeb tabler v1
2019-03-12 22:09:23 +01:00

205 lines
7.5 KiB
HTML
Raw Blame History

{% assign person = site.data.people[0] %}
{% assign id = 0 | random_id %}
<div class="card">
<div class="card-header d-flex">
<a href="#">
{% include ui/avatar.html person=person size="md" %}
</a>
<div class="mx-3">
<a href="#">{{ person.full_name }}</a>
<div class="text-muted text-sm">11 days ago</div>
</div>
</div>
<div class="card-body">
{% if include.text %}
<div class="card-text mb-3">
<p>{{ include.text }}</p>
</div>
{% endif %}
{% if include.feed %}
<div class="row row-xs">
{% if include.feed == 1 %}
<div class="col-6 mb-2">
<div class="media media-2x1 rounded">
<a class="media-content" style="background-image: url({{ site.base }}/img/photos/{{ site.data.photos[0].file }})"></a>
</div>
</div>
<div class="col-6 mb-2">
<div class="media media-2x1 rounded">
<a class="media-content" style="background-image: url({{ site.base }}/img/photos/{{ site.data.photos[1].file }})"></a>
</div>
</div>
<div class="col-4">
<div class="media media-4x3 rounded">
<a class="media-content" style="background-image: url({{ site.base }}/img/photos/{{ site.data.photos[2].file }})"></a>
</div>
</div>
<div class="col-4">
<div class="media media-4x3 rounded">
<a class="media-content" style="background-image: url({{ site.base }}/img/photos/{{ site.data.photos[3].file }})"></a>
</div>
</div>
<div class="col-4">
<div class="media media-4x3 rounded">
<a class="media-content" style="background-image: url({{ site.base }}/img/photos/{{ site.data.photos[4].file }})"></a>
</div>
</div>
{% elsif include.feed == 2 %}
<div class="col-12">
<div class="media media-2x1 rounded">
<a class="media-content" style="background-image: url({{ site.base }}/img/photos/{{ site.data.photos[5].file }})"></a>
</div>
</div>
{% elsif include.feed == 3 %}
<div class="col-6 d-flex">
<div class="media flex-fill rounded">
<a class="media-content" style="background-image: url({{ site.base }}/img/photos/{{ site.data.photos[6].file }})"></a>
</div>
</div>
<div class="col-6">
<div class="media media-2x1 mb-2 rounded">
<a class="media-content" style="background-image: url({{ site.base }}/img/photos/{{ site.data.photos[7].file }})"></a>
</div>
<div class="row row-xs">
<div class="col-6">
<div class="media rounded">
<a class="media-content" style="background-image: url({{ site.base }}/img/photos/{{ site.data.photos[8].file }})"></a>
</div>
</div>
<div class="col-6">
<div class="media rounded">
<a class="media-content" style="background-image: url({{ site.base }}/img/photos/{{ site.data.photos[9].file }})"></a>
<a class="media-overlay active bg-dark-overlay"><small class="text-white mx-auto">9+</small></a>
</div>
</div>
</div>
</div>
{% elsif include.feed == 4 %}
<div class="col-6">
<div class="media media-2x1 rounded">
<a class="media-content" style="background-image: url({{ site.base }}/img/photos/{{ site.data.photos[10].file }})"></a>
</div>
</div>
<div class="col-6">
<div class="media media-2x1 rounded">
<a class="media-content" style="background-image: url({{ site.base }}/img/photos/{{ site.data.photos[11].file }})"></a>
</div>
</div>
{% elsif include.feed == 5 %}
<div class="col-4">
<div class="media media-4x3 rounded">
<a class="media-content" style="background-image: url({{ site.base }}/img/photos/{{ site.data.photos[12].file }})"></a>
</div>
</div>
<div class="col-4">
<div class="media media-4x3 rounded">
<a class="media-content" style="background-image: url({{ site.base }}/img/photos/{{ site.data.photos[13].file }})"></a>
</div>
</div>
<div class="col-4">
<div class="media media-4x3 rounded">
<a class="media-content" style="background-image: url({{ site.base }}/img/photos/{{ site.data.photos[14].file }})"></a>
</div>
</div>
{% elsif include.feed == 6 %}
<div class="col-6 d-flex">
<div class="media flex-fill rounded">
<a class="media-content" style="background-image: url({{ site.base }}/img/photos/{{ site.data.photos[15].file }});"></a>
</div>
</div>
<div class="col-6">
<div class="row row-xs">
<div class="col-6">
<div class="media mb-2 rounded">
<a class="media-content" style="background-image: url({{ site.base }}/img/photos/{{ site.data.photos[16].file }})"></a>
</div>
</div>
<div class="col-6">
<div class="media mb-2 rounded">
<a class="media-content" style="background-image: url({{ site.base }}/img/photos/{{ site.data.photos[17].file }})"></a>
</div>
</div>
<div class="col-6">
<div class="media rounded">
<a class="media-content" style="background-image: url({{ site.base }}/img/photos/{{ site.data.photos[18].file }})"></a>
</div>
</div>
<div class="col-6">
<div class="media rounded">
<a class="media-content" style="background-image: url({{ site.base }}/img/photos/{{ site.data.photos[19].file }})"></a>
</div>
</div>
</div>
</div>
{% elsif include.feed == 7 %}
<div class="col-3 d-flex">
<div class="media flex-fill rounded">
<a class="media-content" style="background-image: url({{ site.base }}/img/photos/{{ site.data.photos[20].file }})"></a>
</div>
</div>
<div class="col-6">
<div class="row row-xs">
<div class="col-6">
<div class="media mb-2 rounded">
<a class="media-content" style="background-image: url({{ site.base }}/img/photos/{{ site.data.photos[21].file }})"></a>
</div>
</div>
<div class="col-6">
<div class="media mb-2 rounded">
<a class="media-content" style="background-image: url({{ site.base }}/img/photos/{{ site.data.photos[22].file }})"></a>
</div>
</div>
<div class="col-6">
<div class="media rounded">
<a class="media-content" style="background-image: url({{ site.base }}/img/photos/{{ site.data.photos[23].file }})"></a>
</div>
</div>
<div class="col-6">
<div class="media rounded">
<a class="media-content" style="background-image: url({{ site.base }}/img/photos/{{ site.data.photos[24].file }})"></a>
</div>
</div>
</div>
</div>
<div class="col-3 d-flex">
<div class="media flex-fill rounded">
<a class="media-content" style="background-image: url({{ site.base }}/img/photos/{{ site.data.photos[25].file }})"></a>
</div>
</div>
{% endif %}
</div>
{% endif %}
</div>
<div class="card-footer">
<div class="toolbar toolbar-mx">
<a href="#" class="text-muted">
{% include ui/icon.html icon="thumbs-up" %} 321 Likes
</a>
<a href="#feed-form-{{ id }}" class="text-muted" data-toggle="collapse">
{% include ui/icon.html icon="message-square" %} 56 Comments
</a>
<a href="#" class="text-muted">
{% include ui/icon.html icon="share-2" %}
Share
</a>
</div>
</div>
<div class="card-footer pt-3 collapse" id="feed-form-{{ id }}">
<form>
<textarea class="form-control" rows="3"></textarea>
<div class="d-flex pt-2">
<div class="toolbar mt-1">
<a href="#" class="text-muted">{% include ui/icon.html icon="image" %}</a>
<a href="#" class="text-muted">{% include ui/icon.html icon="video" %}</a>
<a href="#" class="text-muted">{% include ui/icon.html icon="map-pin" %}</a>
<a href="#" class="text-muted">{% include ui/icon.html icon="paperclip" %}</a>
</div>
<button class="btn btn-sm btn-primary ml-auto">Post</button>
</div>
</form>
</div>
</div>
Reference in New Issue View Git Blame Copy Permalink