Skip to content

Instantly share code, notes, and snippets.

@ig0r74
Created November 8, 2018 13:25
Show Gist options
  • Save ig0r74/8d9ac49e288b3e278a287b25a8735c61 to your computer and use it in GitHub Desktop.
Save ig0r74/8d9ac49e288b3e278a287b25a8735c61 to your computer and use it in GitHub Desktop.
modInstagram Bootstrap 4 chunk
{if ($idx - 1) % 3 == 0}
<div class="row">
{/if}
<div class="col-12 col-md-4 in-item">
<div class="card">
{switch $type}
{case 'carousel'}
<div id="carouselInstagram" class="carousel slide" data-ride="carousel">
<div class="carousel-inner">
{foreach $carousel as $item}
<div class="carousel-item {$item@index == 0 ? 'active' : ''}">
<img class="d-block w-100" src="{$item.images.standard_resolution.url}" alt="">
</div>
{/foreach}
</div>
<a class="carousel-control-prev" href="#carouselInstagram" role="button" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Предыдущий</span>
</a>
<a class="carousel-control-next" href="#carouselInstagram" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Следующий</span>
</a>
</div>
{case 'video'}
<video class="card-img-top" width="100%" controls="controls">
<source src="{$video_standard_resolution}" type="video/mp4">
</video>
{case default}
<img class="card-img-top" src="{$image_standard_resolution}" alt="">
{/switch}
<div class="card-body">
<h5 class="card-title">{$location_name}</h5>
<h6 class="card-subtitle mb-2 text-muted">{$created_time | date : 'd.m.Y'}</h6>
<p class="card-text">{$caption_text | strip : true | truncate : 100}</p>
<a href="{$link}" class="btn btn-primary" target="_blank" rel="nofollow">Подробнее</a>
</div>
</div>
</div>
{if $idx % 3 == 0}
</div>
{/if}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment