templates/website/pages/portfolio_detail.html.twig line 1

Open in your IDE?
  1. {% extends 'website/base.html.twig' %}
  3. {% block title %}{{ portfolio.getName }}{% endblock %}
  6. {% block body %}
  7.     <section class="position-relative bg-fit overlay-black-50" style="padding: 2em 0 200px;">
  8.         <div class="position-absolute" style="right: 0;
  9.   bottom: 0;
  10.   z-index: -1;
  11.   min-width: 100%;
  12.   background-color: white;
  13.   min-height: 100%;">
  14.             <video autoplay muted loop playsinline>
  15.                 <source src="{{ asset('assets/images/background/hero-section.webm') }}" type="video/webm">
  16.                 Your browser does not support the video tag.
  17.             </video>
  18.         </div>
  19.         <div class="container">
  20.             <div class="row text-center justify-content-center">
  21.                 <div class="col-lg-8">
  22.                     <h2 class="scroll-down"></h2>
  23.                 </div>
  24.             </div>
  25.         </div>
  26.     </section>
  27.     <section class="py-5 py-lg-7 d-flex">
  28.         <div class="container">
  29.             <div class="row">
  30.                 <div class="col-md-6 col-xl-5">
  31.                     <h1 class="display-1 text-pink-gradient">
  32.                         {{ portfolio.getName }}
  33.                     </h1>
  34.                     {% if portfolioVideo %}
  35.                         <video class="mt-4" controls width="100%" height="auto" poster="{{ asset(portfolio.getImage) }}">
  36.                             <source src="{{ asset(portfolioVideo) }}" type="video/webm">
  37.                         </video>
  38.                     {% endif %}
  39.                 </div>
  40.                 <div class="col-md-6 col-xl-4 offset-xl-3">
  41.                     <div class="row">
  42.                         <div class="col-lg-6">
  43.                             <div class="mt-4">
  44.                                 <h6>Produced For</h6>
  45.                                 <p class="mb-0">{{ portfolio.getClient }}</p>
  46.                             </div>
  47.                         </div>
  48.                         <div class="col-lg-6">
  49.                             <div class="mt-4">
  50.                                 <h6>Category</h6>
  51.                                 <p class="mb-0">{{ portfolio.getCategory.getName }}</p>
  52.                             </div>
  53.                         </div>
  54.                     </div>
  55.                     <div class="mt-4">
  56.                         {{ portfolio.getDescription|raw }}
  57.                     </div>
  58.                 </div>
  59.             </div>
  60.         </div>
  61.     </section>
  62.     <section class="py-5 py-lg-10 bg-dark">
  63.         <div class="container-fluid">
  64.             <div class="row">
  65.                 <div class="col-12">
  66.                     <div class="grid portfolio-column-1 popup-container">
  67.                         <div class="grid-item html">
  68.                     <div class="swiper-container swiper-container-auto" data-slidesPerView="4"
  69.                          data-mobile-slidesPerView="1" data-tablet-slidesPerView="2" data-spaceBetween="20"
  70.                          data-loop="true" data-autoplay="true" data-auto-speed="1800" data-disable-on-touch="false"
  71.                          data-dots="true" data-auto-height="false" data-pagination="true" data-navigation="true">
  72.                         <div class="swiper-wrapper">
  74.                             {% for media in portfolioImages %}
  75.                                 <div class="swiper-slide">
  76.                                             <div class="portfolio-item-01">
  77.                                                 <div class="portfolio-item-image">
  78.                                                     <img class="img-fluid" src="{{ asset(media.address) }}"
  79.                                                          alt="Shima Amini - {{ portfolio.getName }}">
  80.                                                     <div class="portfolio-item-hover">
  81.                                                         <a class="portfolio-popup" href="{{ asset(media.address) }}"><i
  82.                                                                     class="fas fa-search"></i></a>
  83.                                                     </div>
  84.                                                 </div>
  85.                                     </div>
  86.                                 </div>
  87.                             {% endfor %}
  88.                         </div>
  89.                     </div>
  90.                         </div>
  91.                     </div>
  92.                 </div>
  93.             </div>
  94.         </div>
  95.     </section>
  96. {% endblock %}