templates/pages/homepage.html.twig line 1

Open in your IDE?
  1. {% extends "base.html.twig" %}
  3. {% block content %}
  4.     {{ include('@components/hero-header.html.twig', {
  5.         image: content.image.url,
  6.         text: content.heroImageText
  7.     }) }}
  8.     {{ include('@components/image-text-section.html.twig', {
  9.         image: content.teaserImage.url,
  10.         text: content.teaserText|raw,
  11.         order: {
  12.             text: '1',
  13.             image: '2'
  14.         },
  15.         button: {
  16.             withIcon: true,
  17.             text: content.teaserUrlTitle,
  18.             link: content.teaserUrl
  19.         }
  20.     }) }}
  21.     <div class="bg-grey py-5">
  22.         <div class="container">
  23.             <div class="row">
  24.                 <div class="col-12">
  25.                     <h2>{{ content.bigButtonsTitle|raw }}</h2>
  26.                     {{ content.bigButtonsText|raw }}
  27.                 </div>
  28.             </div>
  29.             <div class="row mt-4">
  30.             {% for bigButtonsDetail in content.bigButtonsDetails %}
  31.                 <div class="col-12 col-lg-4">
  32.                     <a href="{{ bigButtonsDetail.bigButtonsUrl }}">
  33.                         <span class="d-flex align-items-center justify-content-center my-2 my-lg-0 py-3 text-white" style="background-color: {{ bigButtonsDetail.bigButtonsColor }}">
  34.                             <span class="fs-2 fw-bold">{{ bigButtonsDetail.bigButtonsTitle }}</span>
  35.                         </span>
  36.                     </a>
  37.                 </div>
  38.             {% endfor %}
  39.             </div>
  40.         </div>
  41.     </div>
  42.     {% if content.video is not null %}
  43.         {{ include('@components/video-section.html.twig', {
  44.             title: content.videoTitle,
  45.             url: content.video.url,
  46.             background: 'grey',
  47.             order: {
  48.                 video: '1'
  49.             }
  50.         }) }}
  51.     {% endif %}
  52.     <div class="container pt-5">
  53.         <div class="row mb-5">
  54.             <div class="col-12">
  55.                 <h2 class="point light">{{ content.overviewTitle|raw }}</h2>
  56.                 {{ content.overviewText|raw }}
  57.             </div>
  58.         </div>
  59.         <div class="row match-height-card-small g-3" data-match-height-group="card-small-group">
  60.             {% for overviewDetail in content.overviewDetails %}
  61.                 <div class="col-12 col-md-6 col-lg-4 col-xl-3">
  62.                     {{ include('@components/card-small.html.twig', {
  63.                         title: overviewDetail.overviewBlockTitle,
  64.                         text: overviewDetail.overviewBlockText,
  65.                         image: overviewDetail.overviewBlockImage.formats['440x200'],
  66.                         link: overviewDetail.overviewBlockUrl,
  67.                         customLink: overviewDetail.customLink,
  68.                         customAnchor: overviewDetail.customAnchor
  69.                     }) }}
  70.                 </div>
  71.             {% endfor %}
  72.         </div>
  73.     </div>
  74.     {{ include('@components/we-in-numbers.html.twig', {
  75.         title: content.numbersTitle,
  76.         items: content.numbersDetails
  77.     }) }}
  78.     <div class="container my-5">
  79.         <div class="row">
  80.             <div class="col-12">
  81.                 <h2 class="point light mb-4">{{ content.carouselMainTitle|raw }}</h2>
  82.             </div>
  83.             <div class="col-12">
  84.                 <div class="swiper-testimonials-wrapper">
  85.                     <div class="swiper-testimonials">
  86.                         <div class="swiper-wrapper">
  87.                             {% for carouselItem in content.carouselDetails %}
  88.                                 <div class="swiper-slide">
  89.                                     <div class="fw-bold">{{ carouselItem.carouselTitle }}</div>
  90.                                     <div class="position-relative mt-4">
  91.                                         <div class="swiper-text">{{ carouselItem.carouselText }}</div>
  92.                                     </div>
  93.                                 </div>
  94.                             {% endfor %}
  95.                         </div>
  96.                     </div>
  97.                     <div class="swiper-button-next button-next"></div>
  98.                     <div class="swiper-button-prev button-prev"></div>
  99.                 </div>
  100.             </div>
  101.         </div>
  102.     </div>
  103. {% endblock %}