templates/sites/microsite/templates/models/news-item.html.twig line 1

Open in your IDE?
  1. {% extends "sites/microsite/layouts/master.html.twig" %}
  3. {% block bodyClass %}tpl-news-item{% endblock %}
  5. {% block siteHeader %}
  6.     {% include 'sites/microsite/organisms/site-header.html.twig' %}
  7. {% endblock %}
  9. {% block pageHeader %}
  10.     {% include 'molecules/page-header.html.twig' with {
  11.         breadcrumb: [
  12.             { path: path('journal_frontpage'), title: 'Xornal' }
  13.         ]
  14.     } %}
  15. {% endblock %}
  17. {% block pageContent %}
  18.     <article class="news-item-wrapper">
  19.         {% include 'molecules/tags-list.html.twig' %}
  20.         <p class="at-title is-2 is-light is-pretitle">Dentro das xornadas de acción social</p>
  21.         <h1 class="at-title is-1 is-light">Un titular para unha nova ou entrevista de varias liñas de lonxitude</h1>
  23.         <div class="news-item-content-wrapper">
  24.             <div class="news-item-header">
  25.                 <figure class="at-image is-news-item-main-image">
  26.                     <img src="https://picsum.photos/900/507" alt="">
  27.                     <figcaption class="image-caption">
  28.                         Pé de foto descritivo &copy; Universiade de Santiago de Compostela
  29.                     </figcaption>
  30.                 </figure>
  32.                 <div class="news-item-intro">
  33.                     <div class="at-lead-text">
  34.                         <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec viverra eros quis ex malesuada pellentesque. Suspendisse mauris mauris, ultricies id egestas ac, consectetur a tortor. Vestibulum ac convallis lectus. Proin in nibh imperdiet, iaculis dui in, aliquet augue.</p>
  35.                     </div>
  37.                     {% include 'molecules/social-button-list.html.twig' %}
  38.                 </div>
  39.             </div>
  41.             <div class="news-item-content">
  42.                 <div class="news-item-body-wrapper">
  43.                     <div class="news-item-body">
  44.                         <p class="news-item-campus">Lugo, Santiago</p>
  45.                         <time datetime="2019-06-03" class="news-item-datetime">Luns 3 de xuño de 2019</time>
  47.                         <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec viverra eros quis ex malesuada pellentesque. Suspendisse mauris mauris, ultricies id egestas ac, consectetur a tortor. Vestibulum ac convallis lectus. Proin in nibh imperdiet, iaculis dui in, aliquet augue.</p>
  49.                         <figure class="at-image">
  50.                             <img src="https://picsum.photos/900/507" alt="">
  51.                         </figure>
  53.                         <h3 class="at-title is-subhead">Lorem ipsum dolor sit amet</h3>
  55.                         <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec viverra eros quis ex malesuada pellentesque. Suspendisse mauris mauris, ultricies id egestas ac, consectetur a tortor. Vestibulum ac convallis lectus. Proin in nibh imperdiet, iaculis dui in, aliquet augue.</p>
  57.                         <usc-carousel>
  58.                             <template slot-scope="carouselSlotProps">
  59.                                 <usc-carousel-item v-on:enlarge-carousel="carouselSlotProps.enlarge">
  60.                                     <template slot-scope="itemSlotProps">
  61.                                         <figure class="at-image">
  62.                                             <a href="https://picsum.photos/800/507" @click.prevent="itemSlotProps.enlargeCarousel">
  63.                                                 <img src="https://picsum.photos/800/507" alt="">
  64.                                             </a>
  65.                                             <figcaption class="image-caption">Descrición da imaxe</figcaption>
  66.                                         </figure>
  67.                                     </template>
  68.                                 </usc-carousel-item>
  69.                                 <usc-carousel-item v-on:enlarge-carousel="carouselSlotProps.enlarge">
  70.                                     <template slot-scope="itemSlotProps">
  71.                                         <figure class="at-image">
  72.                                             <a href="https://picsum.photos/800/507" @click.prevent="itemSlotProps.enlargeCarousel">
  73.                                                 <img src="https://picsum.photos/800/507" alt="">
  74.                                             </a>
  75.                                             <figcaption class="image-caption">Descrición da imaxe</figcaption>
  76.                                         </figure>
  77.                                     </template>
  78.                                 </usc-carousel-item>
  79.                                 <usc-carousel-item v-on:enlarge-carousel="carouselSlotProps.enlarge">
  80.                                     <template slot-scope="itemSlotProps">
  81.                                         <figure class="at-image">
  82.                                             <a href="https://picsum.photos/800/507" @click.prevent="itemSlotProps.enlargeCarousel">
  83.                                                 <img src="https://picsum.photos/800/507" alt="">
  84.                                             </a>
  85.                                             <figcaption class="image-caption">Descrición da imaxe</figcaption>
  86.                                         </figure>
  87.                                     </template>
  88.                                 </usc-carousel-item>
  89.                             </template>
  90.                         </usc-carousel>
  92.                         <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec viverra eros quis ex malesuada pellentesque. Suspendisse mauris mauris, ultricies id egestas ac, consectetur a tortor. Vestibulum ac convallis lectus. Proin in nibh imperdiet, iaculis dui in, aliquet augue.</p>
  93.                     </div>
  94.                     <div class="news-item-author">
  95.                         {% include 'molecules/authors/summary.html.twig' %}
  96.                     </div>
  97.                 </div>
  98.             </div>
  99.         </div>
  100.     </article>
  102.     <section class="org-tier">
  103.         <div class="tier-header">
  104.             <h2 class="tier-title">Novas relacionadas</h2>
  105.         </div>
  106.         <div class="tier-content">
  107.             <div class="org-modules-container">
  108.                 {% include 'molecules/news/l.html.twig' %}
  110.                 {% include 'molecules/news/m.html.twig' with { hasImage: true } %}
  112.                 {% include 'molecules/news/m.html.twig' with { hasImage: true } %}
  113.             </div>
  114.         </div>
  115.     </section>
  116. {% endblock %}
  118. {% block siteFooter %}
  119.     {% include 'sites/microsite/organisms/site-footer.html.twig' %}
  120. {% endblock %}