{extends_parent}

{block "css-entry" append}
    {encore_entry_link_tags entry='articles'}
{/block}

{block "breadcrumbs-container"}
    <div class="row">
       <div class="col-xl-10 col-xxs-12 col-xl-offset-1">
           {include "components/breadcrumbs.tpl"}
       </div>
    </div>
{/block}

{block "content"}
   <div class="article-detail-header">
      <div class="container">
         <div class="row">
            <div class="col-xl-8 col-xl-offset-2 col-xxs-12">
               <div class="article-header-content">
                  <div class="col-left">
                     <h1>{$body.article.title}</h1>

                     <p class="article-data">
                        <span>{$body.article.date|date_format:"%d.%m.%y"}</span>
                         {foreach $body.article.authors as $author}
                            {if $author.active == "Y"}
                               <span>{$author.name} {$author.surname}</span>
                                {break}
                            {/if}
                         {/foreach}
                         {if $breadcrumbs[$breadcrumbs|count - 2].IDb}
                            <span>{$breadcrumbs[$breadcrumbs|count - 2].text}</span>
                         {/if}
                     </p>
                     <p class="article-annotation">
                         {$body.article.lead}
                     </p>
                  </div>

                  <div class="col-right article-share article-share-top">
                     <p>{t}Sdílet{/t}</p>
                      {share_btns}
                  </div>
               </div>
            </div>

            <div class="col-xl-10 col-xl-offset-1 col-xxs-12">
                {if $body.article.image}
                    {$photo_dimensions = $cfg.Photo.types['article_thumb_lg'].size}
                   <div class="article-main-photo">
                      <img src="{get_photo photo=$body.article.image size='article_thumb_lg'}" class="img-responsive" alt="{$body.article.title}"
                           width="{$photo_dimensions[0]}" height="{$photo_dimensions[1]}">
                   </div>
                {/if}
            </div>
         </div>
      </div>
   </div>

   <div class="article-detail">
      <div class="container">
         <div class="row flex-row">
            <div class="col-xl-5 col-lg-6 col-xxs-12 col-xl-offset-2 col-lg-offset-1">
               <div class="article-content">
                   {$body.article.body.body nofilter}
               </div>
            </div>

             {include 'articles/block.article-side.tpl'}

            <div class="col-xl-10 col-xxs-12 col-xl-offset-1">
               <div class="article-share article-share-bottom">
                  <p>{t}Líbil se vám tento příspěvek? Pošlete ho dál...{/t}</p>
                  <div>
                      {share_btns}
                  </div>
               </div>
            </div>

             {insert_articles related=$body.article.id assign="articles_related"}
             {if $articles_related.articles}
                <div class="col-xxl-10 col-xxl-offset-1 col-xxs-12">
                   <h2 class="text-center">{t}Kam dále?{/t}</h2>
                    {include "articles/block.articles.tpl" articles=$articles_related.articles|array_slice:0:2}
                </div>
             {else}
                 {get_articles assign="articles" section='all' count=2}
                 {if $articles.articles|count}
                    <div class="col-xxl-10 col-xxl-offset-1 col-xxs-12">
                       <h2 class="text-center">{t}Kam dále?{/t}</h2>
                        {include "articles/block.articles.tpl" articles=$articles.articles}
                    </div>
                 {/if}
             {/if}
         </div>
      </div>
   </div>
{/block}

{block "js-entry" append}
    {encore_entry_script_tags entry='articles'}
{/block}
