templates/content/frontpage.html.twig line 1

Open in your IDE?
  1. {% extends 'layouts/layout.html.twig' %}
  3. {% block content %}
  4.     <main>
  5.         <section id="intro-section" class="pullc">
  6.             <div id="frontintro">
  7.                 <div class="container-xl">
  8.                     <div class="row fronthero">
  9.                         <div class="col-lg-7 col-xl-8 leftpull py-5 py-lg-0" id="frontslider">
  11.                             <div class="front_slidertext d-flex flex-column text-center text-lg-start align-items-center justify-content-center">
  12.                                 <h1 class="front-intro">
  13.                                     {% if editmode %}
  14.                                         {{  pimcore_wysiwyg("front_intro", {"height": 200})
  15.     }}
  16.                                     {% else %}
  17.                                         {{  pimcore_wysiwyg("front_intro")|striptags('<strong><br>')|raw  }}
  18.                                     {% endif %}
  19.                                 </h1>
  20.                                 <!--<h2 class="mt-auto mb-0">
  21.                                                                                                                                                                                                                                                                                                                                     {% if not editmode %}
  22.                                                                                                                                                                                                                                                                                                                                         <a data-scroll href="#EOSC-section">
  23.                                                                                                                                                                                                                                                                                                                                         {% endif %}
  24.                                                                                                                                                                                                                                                                                                 
  25.                                                                                                                                                                                                                                                                                                                                         {{ pimcore_input("front_cta", {"placeholder":"CTA", "width": 600}) }}
  26.                                                                                                                                                                                                                                                                                                                                         {% if not editmode %}
  27.                                                                                                                                                                                                                                                                                                                                         </a>
  28.                                                                                                                                                                                                                                                                                                                                     {% endif %}
  29.                                                                                                                                                                                                                                                                                                                                 </h2>-->
  30.                             </div>
  32.                         </div>
  33.                         <div class="col-lg-5 col-xl-4">
  34.                             <div class="row bg-white h-100">
  35.                                 <div class="col-12 col-md-6 col-lg-12 p-4-5 bluegrad d-flex flex-column">
  36.                                     <h2>{{ pimcore_input("dc_title", {"placeholder":"Title", "width": 300}) }}</h2>
  37.                                     <p>
  38.                                         {% if editmode %}
  39.                                             {{  pimcore_wysiwyg("front_dc", {"height": 100})
  40.     }}
  41.                                         {% else %}
  42.                                             {{  pimcore_wysiwyg("front_dc")|striptags('<a>')|raw  }}
  43.                                         {% endif %}
  44.                                     </p>
  46.                                     {{ pimcore_link('dc-front', 
  47.         {
  48.             'class': 'mt-auto service-front',
  49.             'textPrefix': '<svg viewBox="0 0 287 287" xmlns="http://www.w3.org/2000/svg" xml:space="preserve" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="2">
  50.   <path d="M143.367 0c-15.877 0-31.755 6.022-43.8 18.067l-81.5 81.5c-24.09 24.09-24.09 63.51 0 87.6l81.5 81.5c12.045 12.045 27.923 18.068 43.8 18.068 15.877 0 31.755-6.023 43.8-18.068l81.5-81.5c24.09-24.09 24.09-63.51 0-87.6l-81.5-81.5C175.122 6.022 159.244 0 143.367 0m0 12c13.388 0 25.93 5.168 35.315 14.553l81.5 81.5c9.384 9.384 14.552 21.926 14.552 35.314 0 13.389-5.168 25.93-14.552 35.315l-81.5 81.5c-9.385 9.384-21.927 14.553-35.315 14.553-13.388 0-25.93-5.17-35.315-14.553l-81.5-81.5C17.168 169.297 12 156.756 12 143.367c0-13.388 5.168-25.93 14.552-35.314l81.5-81.5C117.437 17.168 129.978 12 143.367 12" fill="#fff" fill-rule="nonzero"/>
  51.   <path d="M193.897 96.326c.012-.198.07-.383.07-.584 0-13.048-25.154-19.874-50-19.874s-50 6.826-50 19.874v85.253c0 13.047 25.154 19.873 50 19.873s50-6.826 50-19.873a9.67 9.67 0 0 0-.07-1.142V96.326Zm-49.93-13.183c26.087 0 42.735 7.463 42.735 12.6h-.07v.362c-.744 5.118-17.176 12.237-42.665 12.237-26.087 0-42.735-7.463-42.735-12.6 0-5.136 16.648-12.6 42.735-12.6m0 109.476c-26.087 0-42.735-7.46-42.735-12.597v-7.867c9.208 5.493 26.78 8.07 43.487 8.07 2.008 0 3.632-2.603 3.632-4.612 0-2.01-1.624-4.612-3.632-4.612-27.758 0-43.047-8.383-43.487-8.986v-10.365c9.208 5.493 26.78 8.07 43.487 8.07 2.008 0 3.632-2.602 3.632-4.61 0-2.01-1.624-4.614-3.632-4.614-27.758 0-43.047-8.383-43.487-8.986v-10.647c9.208 5.493 26.78 8.072 43.487 8.072 2.008 0 3.632-2.604 3.632-4.612 0-2.01-1.624-4.613-3.632-4.613-27.758 0-43.047-8.385-43.487-8.987v-12.23c9.25 5.979 26.045 9.073 42.735 9.073 16.65 0 32.4-3.08 41.664-9.03v71.568l.071-.082c0 5.137-15.648 12.597-41.735 12.597" fill="#fff" fill-rule="nonzero"/>
  52. </svg>'
  53.             }
  54.             ) }}
  56.                                 </div>
  57.                                 <div class="col-12 col-md-6 col-lg-12 p-4-5 purplegrad d-flex flex-column flex-wrap">
  58.                                     <h2>{{ pimcore_input("dmeg_title", {"placeholder":"Title", "width": 300}) }}</h2>
  59.                                     <p>
  60.                                         {% if editmode %}
  61.                                             {{  pimcore_wysiwyg("front_dmeg", {"height": 100})
  62.     }}
  63.                                         {% else %}
  64.                                             {{  pimcore_wysiwyg("front_dmeg")|striptags('<a>')|raw  }}
  65.                                         {% endif %}
  66.                                     </p>
  67.                                     {{ pimcore_link('dmeg-front', 
  68.         {
  69.             'class': 'mt-auto service-front',
  70.             'textPrefix': '<svg viewBox="0 0 287 287" xmlns="http://www.w3.org/2000/svg" xml:space="preserve" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="2">
  71.   <path d="M152.144 175.129c-.91 0-1.82.343-2.508 1.045l-22.887 22.872h-19.826v-2.255a3.552 3.552 0 0 0-3.553-3.553 3.54 3.54 0 0 0-3.538 3.553v3.404a5.938 5.938 0 0 0 5.941 5.942h13.885l-3.464 3.479a3.542 3.542 0 0 0 0 5.016 3.552 3.552 0 0 0 2.508 1.045c.911 0 1.807-.358 2.508-1.045l33.442-33.442c1.39-1.388 1.39-3.642 0-5.016a3.488 3.488 0 0 0-2.508-1.045" fill="#FAFCFF" fill-rule="nonzero"/>
  72.   <path d="M105.775 82.018c-3.18 0-5.957 2.777-5.942 5.942v44.37l-10.39 10.39a3.542 3.542 0 0 0 0 5.017 3.481 3.481 0 0 0 2.492 1.045 3.55 3.55 0 0 0 2.524-1.045l20.065-20.065a3.569 3.569 0 0 0 0-5.016 3.613 3.613 0 0 0-2.523-1.045c-.896 0-1.807.358-2.494 1.045l-2.582 2.582v-36.13h56.597c2.806 0 5.553 1.15 7.524 3.137l17.676 17.66h-14.645v-9.822c0-1.956-1.583-3.554-3.538-3.554a3.563 3.563 0 0 0-3.554 3.554v11.002c0 1.583.612 3.076 1.732 4.196a5.937 5.937 0 0 0 4.18 1.716h19.916c.09.523.164 1.03.164 1.568v80.484H149.31a3.552 3.552 0 0 0-3.553 3.553 3.55 3.55 0 0 0 3.553 3.539h44.818a5.894 5.894 0 0 0 4.195-1.732 5.97 5.97 0 0 0 1.747-4.21v-81.634a17.64 17.64 0 0 0-5.196-12.541l-18.796-18.796a17.806 17.806 0 0 0-12.54-5.21h-57.762ZM81.907 151.716c-.91 0-1.82.343-2.508 1.045l-3.344 3.344c-1.389 1.374-1.389 3.628 0 5.017a3.537 3.537 0 0 0 2.508 1.03 3.54 3.54 0 0 0 2.508-1.03l3.344-3.345a3.54 3.54 0 0 0 0-5.016 3.488 3.488 0 0 0-2.508-1.045" fill="#FAFCFF" fill-rule="nonzero"/>
  73.   <path d="M142.111 138.34c-.91 0-1.82.343-2.508 1.045l-32.68 32.665v-20.841a3.536 3.536 0 0 0-3.539-3.538h-.015a3.536 3.536 0 0 0-3.538 3.538v27.948L87.753 191.22a3.569 3.569 0 0 0 0 5.016 3.605 3.605 0 0 0 2.508 1.045 3.61 3.61 0 0 0 2.523-1.045L144.62 144.4c1.39-1.388 1.39-3.642 0-5.016a3.488 3.488 0 0 0-2.508-1.045M108.665 218.61c-.91 0-1.82.343-2.508 1.045l-5.016 5.016c-1.389 1.374-1.389 3.628 0 5.017a3.537 3.537 0 0 0 2.508 1.03 3.54 3.54 0 0 0 2.508-1.03l5.016-5.017a3.54 3.54 0 0 0 0-5.016 3.488 3.488 0 0 0-2.508-1.045" fill="#FAFCFF" fill-rule="nonzero"/>
  74.   <path d="M143.367 0c-15.877 0-31.755 6.022-43.8 18.067l-81.5 81.5c-24.09 24.09-24.09 63.51 0 87.6l81.5 81.5c12.045 12.045 27.923 18.068 43.8 18.068 15.877 0 31.755-6.023 43.8-18.068l81.5-81.5c24.09-24.09 24.09-63.51 0-87.6l-81.5-81.5C175.122 6.022 159.244 0 143.367 0m0 12c13.388 0 25.93 5.168 35.315 14.553l81.5 81.5c9.384 9.384 14.552 21.926 14.552 35.314 0 13.389-5.168 25.93-14.552 35.315l-81.5 81.5c-9.385 9.384-21.927 14.553-35.315 14.553-13.388 0-25.93-5.17-35.315-14.553l-81.5-81.5C17.168 169.297 12 156.756 12 143.367c0-13.388 5.168-25.93 14.552-35.314l81.5-81.5C117.437 17.168 129.978 12 143.367 12" fill="#fff" fill-rule="nonzero"/>
  75. </svg>'
  76.             }
  77.             ) }}
  80.                                 </div>
  83.                             </div>
  84.                         </div>
  85.                     </div>
  86.                 </div>
  87.             </div>
  88.         </section>
  91.         <div class="container-xl news-events py-3 py-lg-5">
  92.             <div class="row">
  94.                 <div class="col-lg-8">
  95.                     <section id="news-section" class="d-flex flex-column h-100">
  96.                         <h1 class="purpleline">News</h1>
  97.                         <div class="row">
  98.                             {%  for news in news %}
  99.                                 {% set detailLink = app_news_detaillink(news) %}
  100.                                 <div class="col-sm-6 d-flex mb-4">
  102.                                     <article class="d-flex flex-column position-relative" aria-label="{{ news.title }}">
  103.                                         <span class="eventdate">{{ news.publish_date|date("D j M Y") }}</span>
  104.                                         {% if news.list_image %}
  105.                                             {{ news.list_image.thumbnail('newsfront').html({'imgAttributes': {
  106.                             'class': 'newsimg',
  107.                             'alt': news.title,
  108.                            },}) | raw }}
  109.                                         {% elseif news.image %}
  110.                                             {{ news.image.thumbnail('newsfront').html({'imgAttributes': {
  111.                             'class': 'newsimg',
  112.                             'alt': news.title,
  113.                            },}) | raw }}
  114.                                         {% else %}
  115.                                             {{ document.getProperty('fallback_newsimg').thumbnail('newsfront').html({'imgAttributes': {
  116.                             'class': 'newsimg',
  117.                             'alt': news.title,
  118.                            },}) | raw }}
  119.                                         {% endif %}
  120.                                         <h2>
  121.                                             <a href="{{ detailLink }}" class="stretched-link listlink purplelink">{{ news.title }}</a>
  122.                                         </h2>
  124.                                         {{ news.intro|length > 136 ? news.intro|slice(0, 133)|trim ~ '...' : news.intro  }}
  125.                                         
  126.                                     </article>
  127.                                 </div>
  128.                             {% endfor %}
  131.                         </div>
  133.                         {{ pimcore_link('news', 
  134.         {
  135.             'class': 'arrowlink purplelink mt-auto',
  136.             'textPrefix': '<svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewbox="0 0 16 16">
  137.                                         <path d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0zM4.5 7.5a.5.5 0 0 0 0 1h5.793l-2.147 2.146a.5.5 0 0 0 .708.708l3-3a.5.5 0 0 0 0-.708l-3-3a.5.5 0 1 0-.708.708L10.293 7.5H4.5z"/>
  138.                                     </svg>'
  139.             }
  140.             ) }}
  143.                     </section>
  144.                 </div>
  147.                 <div class="col-lg-4 d-flex flex-column py-3 py-lg-0">
  148.                     <section id="events-section" class="d-flex flex-column h-100">
  149.                         <h1 class="blueline">Events</h1>
  150.                         <ul class="list-unstyled eventlist">
  153.                             {%  for event in events %}
  154.                                 {% set detailLink = app_event_detaillink(event) %}
  155.                                 <li class="position-relative">
  157.                                     <span class="eventdate">{{ event.from_time|date("D j M Y") }}
  158.                                         {% if event.to_time and event.to_time|date("D j M Y") != event.from_time|date("D j M Y") %}
  159.                                             -
  160.                                             {{ event.to_time|date("D j M Y") }}
  161.                                         {% endif %}
  162.                                     </span>
  163.                                     <h2>
  164.                                         <a href="{{ detailLink }}" class="stretched-link listlink bluelink">{{ event.title }}</a>
  165.                                     </h2>
  166.                                     <p>{{ event.intro|length > 100 ? event.intro|slice(0, 97)|trim ~ '...' : event.intro  }}
  168.                                     </p>
  170.                                 </li>
  171.                             {% endfor %}
  172.                         </ul>
  174.                         {{ pimcore_link('events', 
  175.         {
  176.             'class': 'arrowlink mt-auto',
  177.             'textPrefix': '<svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewbox="0 0 16 16">
  178.                                         <path d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0zM4.5 7.5a.5.5 0 0 0 0 1h5.793l-2.147 2.146a.5.5 0 0 0 .708.708l3-3a.5.5 0 0 0 0-.708l-3-3a.5.5 0 1 0-.708.708L10.293 7.5H4.5z"/>
  179.                                     </svg>'
  180.             }
  181.             ) }}
  184.                     </section>
  185.                 </div>
  186.             </div>
  187.         </div>
  189.         <section id="newsletter-section" class="lightgrey py-4 py-lg-5">
  190.             <div class="container-xl">
  191.                 <div class="row">
  192.                     <div class="col-lg-4 d-flex flex-column">
  193.                         <h1 class="purpleline">Newsletter</h1>
  194.                         {{pimcore_wysiwyg("front_newsletter")}}
  195.                         <div class="d-flex mt-auto">
  196.                             <button onclick="ml_account('webforms', '5494673', 'r7a5s3', 'show')" class="subscribe-wt d-block mt-auto">Subscribe
  197.                                 <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="currentColor" viewbox="0 0 16 16">
  198.                                     <path d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0zM4.5 7.5a.5.5 0 0 0 0 1h5.793l-2.147 2.146a.5.5 0 0 0 .708.708l3-3a.5.5 0 0 0 0-.708l-3-3a.5.5 0 1 0-.708.708L10.293 7.5H4.5z"/>
  199.                                 </svg>
  200.                             </button>
  202.                         </div>
  203.                     </div>
  204.                     <div class="col-lg-8 d-flex flex-column mt-4 mt-lg-0">
  205.                         <h1 class="blueline">Feeds</h1>
  207.                         <div class="row">
  208.                             {%  for blog in blogs %}
  209.                                 <div class="col-lg-6 feeds">
  210.                                     <div class="blogitem position-relative d-flex h-100">
  212.                                         {% if blog.parent.getProperty('blog_icon') %}
  214.                                             {{ blog.parent.getProperty('blog_icon').thumbnail('blogicon').html({'imgAttributes': {
  215.                                             'class': 'blogimg',
  216.                                             'alt': blog.parent.properties.blog_title.data,
  217.                                            },}) | raw }}
  218.                                         {% endif %}
  221.                                         <div>
  222.                                             <span class="eventdate">{{ blog.pubDate|date("D j M Y") }}
  223.                                                 {% if blog.parent.getProperty('blog_title') %}
  224.                                                     -
  225.                                                     {{ blog.parent.getProperty('blog_title') }}
  226.                                                 {% endif %}
  227.                                             </span>
  228.                                             <h2>
  229.                                                 <a href="{{ blog.link }}" target="_blank" class="stretched-link bluelink">
  230.                                                     <strong>{{ blog.title|striptags|raw }}</strong>
  231.                                                 </a>
  232.                                                 </h2>
  233.                                             
  234.                                         </div>
  235.                                     </div>
  236.                                 </div>
  237.                             {% endfor %}
  240.                             <div class="col-12 d-flex text-center pt-3">
  241.                                 {{ pimcore_link('feeds', 
  242.                                     {
  243.                                     'class': 'arrowlink mt-auto mb-1',
  244.                                     'textPrefix': '<svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewbox="0 0 16 16">
  245.                                         <path d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0zM4.5 7.5a.5.5 0 0 0 0 1h5.793l-2.147 2.146a.5.5 0 0 0 .708.708l3-3a.5.5 0 0 0 0-.708l-3-3a.5.5 0 1 0-.708.708L10.293 7.5H4.5z"/>
  246.                                     </svg>'
  247.                                     }
  248.                             ) }}
  251.                             </div>
  252.                         </div>
  255.                     </div>
  258.                 </div>
  259.             </div>
  260.         </section>
  263.                 <section id="training-section" class="pullc bg-green-500 darkbg whitelinks">
  264.             <div class="container-xl">
  265.                 <div class="row">
  266.                     <div class="col-lg-6 py-4 py-lg-5 pe-lg-5 order-2 order-lg-1 text-center d-flex flex-column justify-content-center">
  268.             
  269.                         <h1 class="lgheading">CESSDA Training</h1>
  271.                         <p class="mb-5">
  272.                             Discover training resources and events for <br>researchers, trainers and data professionals.
  273.                         </p>
  274.                         <a href="/Training" class="arrowlink greenlink">
  275.                             <svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewbox="0 0 16 16">
  276.                                 <path d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0zM4.5 7.5a.5.5 0 0 0 0 1h5.793l-2.147 2.146a.5.5 0 0 0 .708.708l3-3a.5.5 0 0 0 0-.708l-3-3a.5.5 0 1 0-.708.708L10.293 7.5H4.5z"/>
  277.                             </svg>Go to CESSDA Training</a>
  280.                     </div>
  282.                     <div class="col-lg-6 py-3 py-lg-5 rightpull order-1 order-lg-2" id="training-img"></div>
  283.                 </div>
  284.             </div>
  285.         </section>
  288.         <section id="socials-section" class="py-4 py-lg-5">
  289.             <div class="container-xl">
  290.                 <div class="row">
  292.                     <div class="col-lg-4 d-flex flex-column">
  293.                         <h1 class="purpleheading text-center">Social media</h1>
  294.                         <p class="text-center pt-2">
  295.                             Ýou can find us on the following channels:
  296.                         </p>
  298.                         <div class="row some-row justify-content-center pt-4">
  299.                             <div class="col-3 text-end">
  300.                                 <a href="https://twitter.com/CESSDA_Data/" target="_blank">
  301.                                     <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 400 400" xml:space="preserve" class="some-icon tw" aria-label="Twitter">
  302.                                         <path class="some-path" d="M350 400H50c-27.6 0-50-22.4-50-50V50C0 22.4 22.4 0 50 0h300c27.6 0 50 22.4 50 50v300c0 27.6-22.4 50-50 50z"/>
  303.                                         <path d="M153.6 301.6c94.3 0 145.9-78.2 145.9-145.9 0-2.2 0-4.4-.1-6.6 10-7.2 18.7-16.3 25.6-26.6-9.2 4.1-19.1 6.8-29.5 8.1 10.6-6.3 18.7-16.4 22.6-28.4-9.9 5.9-20.9 10.1-32.6 12.4-9.4-10-22.7-16.2-37.4-16.2-28.3 0-51.3 23-51.3 51.3 0 4 .5 7.9 1.3 11.7-42.6-2.1-80.4-22.6-105.7-53.6-4.4 7.6-6.9 16.4-6.9 25.8 0 17.8 9.1 33.5 22.8 42.7-8.4-.3-16.3-2.6-23.2-6.4v.7c0 24.8 17.7 45.6 41.1 50.3-4.3 1.2-8.8 1.8-13.5 1.8-3.3 0-6.5-.3-9.6-.9 6.5 20.4 25.5 35.2 47.9 35.6-17.6 13.8-39.7 22-63.7 22-4.1 0-8.2-.2-12.2-.7 22.6 14.4 49.6 22.9 78.5 22.9" fill="#FFF"/>
  304.                                     </svg>
  305.                                 </a>
  307.                             </div>
  308.                             <div class="col-3 text-center">
  309.                                 <a href="https://www.linkedin.com/company/cessda/" target="_blank">
  310.                                     <svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 24 24" xml:space="preserve" class="some-icon li" aria-label="LinkedIn">
  311.                                         <path class="some-path" d="M19 0H5a5 5 0 0 0-5 5v14a5 5 0 0 0 5 5h14a5 5 0 0 0 5-5V5a5 5 0 0 0-5-5zM8 19H5V8h3v11zM6.5 6.732c-.966 0-1.75-.79-1.75-1.764s.784-1.764 1.75-1.764 1.75.79 1.75 1.764-.783 1.764-1.75 1.764zM20 19h-3v-5.604c0-3.368-4-3.113-4 0V19h-3V8h3v1.765c1.396-2.586 7-2.777 7 2.476V19z"/>
  312.                                     </svg>
  313.                                 </a>
  314.                             </div>
  315.                             <div class="col-3 text-start">
  316.                                 <a href="https://www.youtube.com/channel/UCqbZKb1Enh-WcFpg6t86wsA" target="_blank">
  317.                                     <svg xmlns="http://www.w3.org/2000/svg" xml:space="preserve" viewbox="0 0 32 32" class="some-icon yt" aria-label="YouTube">
  318.                                         <path class="some-path" d="M13.767 19.354h1.398v6.377l-1.123-.002.003-.823c-.301.646-1.507 1.168-2.136.714-.337-.241-.326-.666-.36-1.029-.018-.206-.003-.658-.004-1.27l-.004-3.967h1.39l.007 4.03c0 .55-.03.87.004.976.198.607.71.279.823-.031.038-.104.002-.393.002-.971v-4.004zm5.868 1.25.004 3.334c0 1.615-.922 2.535-2.391 1.188l-.104.533-1.149.017.007-8.55 1.396-.002-.006 2.478c1.292-1.026 2.242-.266 2.243 1.002zm-1.035-.166c0-.274-.274-.502-.611-.502-.336 0-.61.228-.61.502v3.74c0 .276.274.502.61.502.337 0 .611-.226.611-.502v-3.74zm-2.847-8.157c.341 0 .619-.306.619-.681V8.071c0-.375-.278-.682-.619-.682-.34 0-.619.307-.619.682V11.6c0 .376.279.681.619.681zm-3.938 5.955v-1.109l-4.471-.007v1.093l1.396.003v7.521h1.399l-.002-7.498h1.678v-.003zM32 0v32H0V0h32zM18.475 11.019c0 .567.01.948.027 1.141.02.191.062.375.135.554a.962.962 0 0 0 .336.425c.15.105.342.158.572.158.201 0 .38-.056.536-.168.155-.111.286-.277.394-.501l-.026.549h1.559V6.549H20.78v5.158a.51.51 0 0 1-1.024 0V6.549h-1.279v4.471l-.002-.001zm-4.403-3.541c-.105.357-.159.854-.159 1.49v1.754c0 .582.029 1.019.087 1.309.059.289.156.539.293.742.136.205.327.358.574.459.247.104.546.151.901.151.318 0 .6-.059.845-.178.242-.117.445-.304.601-.551.158-.25.261-.519.308-.806.047-.287.071-.74.071-1.354V8.819c0-.486-.024-.848-.079-1.086a2.1 2.1 0 0 0-.289-.69 1.54 1.54 0 0 0-.598-.543c-.258-.14-.566-.21-.927-.21-.429 0-.781.109-1.057.326a1.668 1.668 0 0 0-.571.862zM8.97 3.935l1.849 4.366.001 5.081h1.471l.001-5.083 1.738-4.354h-1.608l-.924 3.234-.937-3.244H8.97zm17.085 13.91c0-1.706-1.479-3.104-3.291-3.104H9.236c-1.81 0-3.29 1.396-3.29 3.104v7.116c0 1.707 1.479 3.104 3.29 3.104h13.528c1.812 0 3.291-1.396 3.291-3.104v-7.116zm-2.041 5.651c.479 2.841-3.531 3.309-3.531.005v-1.985c0-.597.059-1.064.179-1.408a1.55 1.55 0 0 1 .587-.789c.848-.612 2.521-.424 2.693.771.056.377.072 1.037.072 1.697v.901h-2.4v1.539c0 .313.259.568.572.568h.205a.573.573 0 0 0 .573-.568v-.584c0-.054.002-.101.003-.143l1.047-.004zm-2.384-1.91h1.325l.016-.771a.625.625 0 0 0-.627-.621h-.082a.624.624 0 0 0-.625.621l-.007.771z"/>
  319.                                     </svg>
  320.                                 </a>
  321.                             </div>
  324.                         </div>
  325.                     </div>
  327.                     <div class="col-lg-8 d-flex flex-column mt-4 mt-lg-0">
  328.                         <h1 class="blueheading text-center">Videos</h1>
  330.                         <div class="row">
  333.                             <div class="col-12 col-lg-6 pb-3">
  334.                                 {{ pimcore_video('campaignVideo', {
  335.              class: 'ratio ratio-16x9',
  336.              title: 'CESSDA Youtube video',
  337.             youtube: {
  338.                 autoplay: false,
  339.                 modestbranding: true
  340.                 
  341.             }
  342.        })
  343.     }}
  344.                             </div>
  345.                             <div class="col-12 col-lg-6 pb-3">
  346.                                 {{ pimcore_video('campaignVideo2', {
  347.                  class: 'ratio ratio-16x9',
  348.                  title: 'CESSDA Youtube video',
  349.               youtube: {
  350.                 autoplay: false,
  351.                 modestbranding: true
  352.                 
  353.             }
  354.        })
  355.     }}
  356.                             </div>
  357.                             <div class="col-12 d-flex text-center pt-3">
  358.                                 {{ pimcore_link('videos', 
  359.                                     {
  360.                                         'class': 'arrowlink mt-auto mb-1',
  361.                                         'textPrefix': '<svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewbox="0 0 16 16">
  362.                                         <path d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0zM4.5 7.5a.5.5 0 0 0 0 1h5.793l-2.147 2.146a.5.5 0 0 0 .708.708l3-3a.5.5 0 0 0 0-.708l-3-3a.5.5 0 1 0-.708.708L10.293 7.5H4.5z"/>
  363.                                     </svg>'
  364.                                     }
  365.                                 ) }}
  368.                             </div>
  369.                         </div>
  372.                     </div>
  375.                 </div>
  376.             </div>
  377.         </section>
  380.         <section id="covid-section" class="perugrad pullc">
  381.             <div class="container-xl whitelinks perulightlinkshover">
  382.                 <div class="row">
  383.                     <div id="covid" class="col-lg-4 py-3 py-lg-4 grad leftpull">
  384.                         <div class="px-lg-4">
  385.                             <h1 class="text-xl-end">COVID-19</h1>
  386.                         </div>
  387.                     </div>
  388.                     <div class="col-lg-8 py-3 py-lg-4">
  389.                         <div class="ps-lg-4">
  390.                             {{  pimcore_wysiwyg("front_covid") }}
  392.                             {{ pimcore_link('covid', 
  393.         {
  394.             'class': 'py-1 arrowlink',
  395.             'textPrefix': '<svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewbox="0 0 16 16">
  396.                                         <path d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0zM4.5 7.5a.5.5 0 0 0 0 1h5.793l-2.147 2.146a.5.5 0 0 0 .708.708l3-3a.5.5 0 0 0 0-.708l-3-3a.5.5 0 1 0-.708.708L10.293 7.5H4.5z"/>
  397.                                     </svg>'
  398.             }
  399.             ) }}
  402.                         </div>
  403.                     </div>
  404.                 </div>
  405.             </div>
  406.         </section>
  409.         <section id="consortium-section" class="py-4 py-lg-5 lightgrey">
  410.             <div class="container-xl">
  411.                 <div class="row">
  412.                     <h1 class="text-center purpleheading">The Consortium</h1>
  413.                     <div class="col-lg-4 py-3 d-flex flex-column justify-content-center text-center text-lg-start">
  415.                         {{  pimcore_wysiwyg("front_consortium") }}
  418.                         {{ pimcore_link('consortium', 
  419.         {
  420.             'class': 'arrowlink purplelink mt-auto mb-lg-4 d-block text-center text-lg-start',
  421.             'textPrefix': '<svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewbox="0 0 16 16">
  422.                                         <path d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0zM4.5 7.5a.5.5 0 0 0 0 1h5.793l-2.147 2.146a.5.5 0 0 0 .708.708l3-3a.5.5 0 0 0 0-.708l-3-3a.5.5 0 1 0-.708.708L10.293 7.5H4.5z"/>
  423.                                     </svg>'
  424.             }
  425.             ) }}
  428.                     </div>
  430.                     <div class="col-lg-4 py-3">
  431.                         {% set image = pimcore_asset(541) %}
  433.                         {{ image.thumbnail('frontpage_map').html({
  434.     'imgAttributes': {
  435.         'class': 'round purple cessdamap',
  436.         'alt': 'CESSDA Consortium'
  437.     }
  438. })|raw
  439.  }}
  442.                     </div>
  445.                     <div class="col-lg-4 py-3 d-flex flex-column justify-content-center text-center text-lg-start">
  447.                         {{  pimcore_wysiwyg("front_membership") }}
  449.                         {{ pimcore_link('membership', 
  450.         {
  451.             'class': 'arrowlink purplelink mt-auto mb-lg-4 text-center text-lg-start',
  452.             'textPrefix': '<svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewbox="0 0 16 16">
  453.                                         <path d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0zM4.5 7.5a.5.5 0 0 0 0 1h5.793l-2.147 2.146a.5.5 0 0 0 .708.708l3-3a.5.5 0 0 0 0-.708l-3-3a.5.5 0 1 0-.708.708L10.293 7.5H4.5z"/>
  454.                                     </svg>'
  455.             }
  456.             ) }}
  459.                     </div>
  460.                 </div>
  461.             </div>
  462.         </section>
  465.         <div class="container-xl ">
  466.             <div class="row">
  467.                 <div class="col-lg-6 bluegrad whitelinks leftpull py-4 py-lg-5">
  469.                     <section id="data-access-section" class="ps-lg-2 pe-lg-5">
  470.                         <h1 class="bluelightline">{{ pimcore_input("access_title", {"placeholder":"Title", "width": 600}) }}</h1>
  472.                         {{  pimcore_wysiwyg("front_access") }}
  475.                         <ul class="list-unstyled">
  476.                             {% for i in pimcore_block('link_access_block').iterator %}
  477.                                 <li>{{ pimcore_link('access', 
  478.         {
  479.             'class': 'py-1 arrowlink',
  480.             'textPrefix': '<svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewbox="0 0 16 16">
  481.                                         <path d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0zM4.5 7.5a.5.5 0 0 0 0 1h5.793l-2.147 2.146a.5.5 0 0 0 .708.708l3-3a.5.5 0 0 0 0-.708l-3-3a.5.5 0 1 0-.708.708L10.293 7.5H4.5z"/>
  482.                                     </svg>'
  483.             }
  484.         
  485.         ) }}</li>
  486.                             {% endfor %}
  487.                         </ul>
  490.                     </section>
  492.                 </div>
  494.                 <div class="col-lg-6 py-4 py-lg-5">
  495.                     <section id="building-services-section" class="ps-lg-5">
  497.                         <h1 class="blueline">{{ pimcore_input("building_title", {"placeholder":"Title", "width": 600}) }}</h1>
  499.                         {{  pimcore_wysiwyg("front_building") }}
  502.                         <div class="row">
  503.                             <div class="col">
  506.                                 <ul class="list-unstyled">
  507.                                     {% for i in pimcore_block('link_building_block').iterator %}
  508.                                         <li>{{ pimcore_link('access', 
  509.         {
  510.             'class': 'py-1 arrowlink',
  511.             'textPrefix': '<svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewbox="0 0 16 16">
  512.                                         <path d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0zM4.5 7.5a.5.5 0 0 0 0 1h5.793l-2.147 2.146a.5.5 0 0 0 .708.708l3-3a.5.5 0 0 0 0-.708l-3-3a.5.5 0 1 0-.708.708L10.293 7.5H4.5z"/>
  513.                                     </svg>'
  514.             }
  515.         
  516.         ) }}</li>
  517.                                     {% endfor %}
  518.                                 </ul>
  521.                             </div>
  524.                         </div>
  525.                     </section>
  526.                 </div>
  527.             </div>
  528.         </div>
  531.         <section id="deposit-section" class="lightgrey">
  532.             <div class="container-xl py-4 py-lg-5">
  533.                 <div class="row">
  535.                     <div class="col-lg-8 d-flex flex-column pe-lg-5 text-center mx-auto">
  536.                         <h1 class="purpleheading">{{ pimcore_input("deposit_title", {"placeholder":"Title", "width": 600}) }}</h1>
  538.                         {{  pimcore_wysiwyg("front_deposit") }}
  541.                         {{ pimcore_link('deposit', 
  542.         {
  543.             'class': 'arrowlink purplelink mt-3',
  544.             'textPrefix': '<svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" viewbox="0 0 16 16">
  545.                                         <path d="M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0zM4.5 7.5a.5.5 0 0 0 0 1h5.793l-2.147 2.146a.5.5 0 0 0 .708.708l3-3a.5.5 0 0 0 0-.708l-3-3a.5.5 0 1 0-.708.708L10.293 7.5H4.5z"/>
  546.                                     </svg>'
  547.             }
  548.             ) }}
  549.                     </div>
  551.                 </div>
  554.             </div>
  557.         </section>
  560.     </main>
  562. {% endblock %}