templates/pages/article.html.twig line 1

Open in your IDE?
  1. {# @var pageinfo \App\Controller\PageInfo #}
  2. {# @var page \App\Controller\Objects\Page #}
  3. {# @var article \App\Controller\Objects\News #}
  4. {% extends 'base.html.twig' %}
  6. {% block og %}
  7. <meta property="og:url"         content="{{ og_link }}" />
  8.     <meta property="og:type"        content="article" />
  9.     <meta property="og:title"       content="{{ article.name }}" />
  10.     <meta property="og:description" content="{{ article.perex }}" />
  11.     <meta property="og:image"       content="{% if article.isPicture %}{{ article.picture.small }}{% else %}{{ app_url }}/assets/custom/img/og.png{% endif %}" />
  12. {% endblock %}
  14. {% block body %}
  16.     <div class=" ms-hero-page ms-hero-bg-info mb-6" style="background: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)), url('{{ page.picture.small }}'); background-position-x: right ">
  18.         {% if pageinfo.info != '' %}
  19.             <div class="container" style="position: relative; top: -80px">
  20.                 <div id="id-header-news">
  21.                     <i class="fa fa-info-circle"></i>
  22.                     <div class="marquee">
  23.                         <div class="marquee-content">{{ pageinfo.info|raw }}</div>
  24.                     </div>
  25.                 </div>
  26.             </div>
  27.         {% endif %}
  29.         <div class="text-center color-white mt-6 mb-6 index-1">
  30.             <h1>{{ page.title }}</h1>
  31.             <p class="lead lead-lg mb-4">Informační kanál aktuálních událostí kultury a sportu</p>
  32.         </div>
  33.     </div>
  35.     <div class="container" style="margin-top: -110px">
  36.     <div class="row">
  37.         <div class="col-lg-9">
  38.             <article class="card card-default wow zoomInRight animation-delay-1 mb-4" style="visibility: visible; animation-name: zoomInRight; min-height: 1460px;">
  39.                     <div class="mt-4">
  40.                         <div class="row">
  41.                             <div class="col-sm-0 col-md-1"> </div>
  42.                             <div class="col-sm-12 col-md-10">
  45.                                 <div class="card-body card-body-big">
  47.                                     <div class="mb-2">
  48.                                         <nav aria-label="breadcrumb">
  49.                                             <ol class="breadcrumb breadcrumb-slash">
  50.                                                 <li class="breadcrumb-item"><a href="/">Hlavní stránka</a></li>
  51.                                                 <li class="breadcrumb-item"><a href="/news">News</a></li>
  52.                                             </ol>
  53.                                         </nav>
  54.                                     </div>
  56.                                     <h1 class="no-mt">{{ article.name }}</h1>
  57.                                     <div class="mb-1">
  58.                                         <span class="ml-1 d-sm-inline"><i class="fa fa-user mr-05 color-info"></i> <span class="color-medium-dark">{{ article.autor }}</span></span>
  59.                                         <span class="ml-1 d-sm-inline"><i class="zmdi zmdi-time mr-05 color-info"></i> <span class="color-medium-dark">{{ article.day }} {{ article.date.format('d.m.Y') }}</span></span>
  60.                                     </div>
  62.                                     <div class="mb-1">
  63.                                     <p>{{ article.perex }}</p>
  64.                                     </div>
  66.                                     {% if article.isPicture %}
  67.                                     <div class="mb-2">
  68.                                         <img src="{{ article.picture.small }}" alt="" class="img-fluid w-100p">
  69.                                         {% if article.sourceImg != '' %}
  70.                                         <div class="img-src">Zdroj: {{ article.sourceImg }}</div>
  71.                                         {% endif %}
  72.                                     </div>
  73.                                     {% endif %}
  75.                                    {{ article.htmlText|raw }}
  79.                                     {% if article.gallery|length > 0 %}
  80.                                         <div class="row mt-2">
  81.                                             {% for picture in article.gallery %}
  82.                                                 {# @var picture \App\Controller\Objects\Picture #}
  83.                                                 <div class="col-lg-4 col-md-4 col-sm-6">
  84.                                                     <div class="card wow zoomIn" style="visibility: visible; animation-name: zoomIn; box-shadow: none; border: solid 1px #dadada">
  85.                                                         <div class="ms-thumbnail card-body p-05 ">
  86.                                                             <div class="withripple zoom-img">
  87.                                                                 <a href="{{ picture.small|replace({'thumbs/':''}) }}" data-lightbox="gallery" data-title="{{ article.name }}">
  88.                                                                     <img src="{{ picture.small }}" alt="" class="img-fluid">
  89.                                                                 </a>
  90.                                                                 <div class="ripple-container"></div></div>
  91.                                                         </div>
  92.                                                     </div>
  93.                                                 </div>
  94.                                             {% endfor %}
  96.                                             {% if article.sourceGal != '' %}
  97.                                                 <div class="img-src mt-0">Zdroj: {{ article.sourceGal }}</div>
  98.                                             {% endif %}
  100.                                         </div>
  101.                                     {% endif %}
  103.                                 </div>
  107.                             </div>
  108.                         </div>
  109.                     </div>
  110.             </article>
  111.         </div>
  112.         {% include 'partials/sidecol.html.twig' %}
  113.     </div>
  114. </div>
  116. {% endblock %}
  119. {% block javascripts %}
  120.     {{ parent() }}
  121.     <script src="/assets/js/component-carousels-1.js"></script>
  123.     <script>
  124.         $(document).ready(function(){
  125.             pagination();
  126.         });
  128.         function pagination() {
  129.             $('.page-link').on('click', function(e) {
  130.                 let page = $(this).data('page');
  131.                 $('#id-news').load( '/news/'+page+'/ajax', function() {
  132.                     window.history.pushState('news'+page, '', '/news/'+page);
  133.                     pagination();
  134.                 });
  135.                 return false;
  136.             });
  137.         }
  138.     </script>
  139. {% endblock %}