proxitok/templates/components/themes/default.latte

<div class="container">
	{foreach $feed->items as $item}
	<article class="media">
  	<figure class="media-left">
    	<p class="image is-64x64">
      	<img class="is-rounded" src="{url_stream($item->author->avatarThumb)}" />
    	</p>
  	</figure>
  	<div class="media-content">
      <p>
      	<strong>{$item->author->nickname}</strong>
				<small>
					<a href="{url_user($item->author->uniqueId)}">@{$item->author->uniqueId}</a>
				</small>
				<small title="{date('M d, Y H:i:s e', $item->createTime)}">{date('M d, Y', $item->createTime)}</small>
      </p>
			{if !empty($item->challenges)}
			<p>{include './common/tags.latte', challenges: $item->challenges}</p>
			{/if}
			<p n:ifcontent>{$item->desc}</p>
			{include './common/stats.latte', playCount: $item->stats->playCount, diggCount: $item->stats->diggCount, commentCount: $item->stats->commentCount, shareCount: $item->stats->shareCount}
			<div class="has-text-centered">
				<video width="{$item->video->width}" height="{$item->video->height}" controls preload="none" poster="{url_stream($item->video->originCover)}">
					<source src="{url_stream($item->video->playAddr)}" type="video/mp4" />
				</video>
			</div>
			<p class="has-text-centered"><b>Download video</b></p>
			{include './common/download.latte', playAddr: $item->video->playAddr, id: $item->id, uniqueId: $item->author->uniqueId}
			<p class="has-text-centered"><b>Share link</b></p>
			{include './common/share.latte', uniqueId: $item->author->uniqueId, id: $item->id}
  	</div>
	</article>
	{/foreach}
	{if empty($feed->items)}
		<p class="title">No items sent by TikTok!</p>
	{/if}
</div>
{include './common/controls.latte'}