templates/frontend/media.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  2.     {% block meta_title %}
  3.         {% set metaTitle = "Huguenot Tunnel | A Sanral Project" %}
  4.         {{ metaTitle }}
  5.     {% endblock %}
  6.     {% block meta_decription %}
  7.         {% set metaTitle = "Huguenot Tunnel | A Sanral Project" %}
  8.         {% set metaDescription = "Huguenot Tunnel | A Sanral Project" %}
  9.         <meta name="twitter:card" content="summary" />
  10.         <meta name="twitter:site" content="Sanral" />
  11.         <meta name="twitter:title" content="{{ metaTitle }}" />
  12.         <meta name="twitter:description" content="{{ metaDescription }}" />
  13.         <meta name="twitter:image" content="https://ap-live.nerdw.com/images/banner/about-banner.jpg" />
  14.         <meta name="twitter:url" content="{{ app.request.uri }}" />
  16.         <meta name="og:image" content="https://ap-live.nerdw.com/images/banner/about-banner.jpg" />
  17.         <meta name="og:title" content="{{ metaTitle }}" />
  18.         <meta name="og:description" content="{{ metaDescription }}" />
  19.         <meta name="og:url" content="{{ app.request.uri }}" />
  20.         <meta name="description" content="{{ metaDescription }}">
  21.     {% endblock %}
  22.     {% block stylesheets %}
  23.         <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x" crossorigin="anonymous">
  24.         {{ parent() }}
  25.     {% endblock %}
  27.     {% block layout %}
  29.         <!-- Banner -->
  30.         <div class="fl-row fl-row-full-width fl-row-bg-photo fl-node-5df0cc2408fb2 fl-row-bg-overlay" data-node="5df0cc2408fb2">
  31.             <div class="fl-row-content-wrap">
  32.                 <div class="uabb-row-separator uabb-top-row-separator"></div>
  33.                 <div class="fl-row-content fl-row-fixed-width fl-node-content">
  34.                     <div class="fl-col-group fl-node-5df0cc241071e" data-node="5df0cc241071e">
  35.                         <div class="fl-col fl-node-5df0cc2410ab4" data-node="5df0cc2410ab4">
  36.                             <div class="fl-col-content fl-node-content">
  37.                                 <div class="fl-module fl-module-pp-heading fl-node-5df0cc2408273" data-node="5df0cc2408273">
  38.                                     <div class="fl-module-content fl-node-content">
  39.                                         <div class="pp-heading-content">
  40.                                             <div class="pp-heading pp-left">
  41.                                                 <h2 class="heading-title">
  42.                                                     <span class="title-text pp-primary-title">
  43.                                                         Media
  44.                                                     </span>
  45.                                                 </h2>
  46.                                             </div>
  47.                                             <div class="pp-heading-separator line_only pp-left">
  48.                                                 <span class="pp-separator-line"></span>
  49.                                             </div>
  50.                                         </div>
  51.                                     </div>
  52.                                 </div>
  53.                             </div>
  54.                         </div>
  55.                     </div>
  56.                 </div>
  57.             </div>
  58.         </div>
  60.         <div class="uabb-js-breakpoint" style="display: none;"></div>
  61.         <div class="fl-row-content fl-row-fixed-width fl-node-content">
  62.             <div class="fl-col-group fl-node-5df0bbe74b6cf" data-node="5df0bbe74b6cf">
  63.                 <div class="fl-module fl-module-pp-heading fl-node-5e2ea83168f95" data-node="5e2ea83168f95">
  64.                     <div class="fl-module-content fl-node-content">
  65.                         <div class="pp-heading-content">
  66.                             <div class="pp-heading  pp-left">
  67.                                 <h2 class="heading-title">
  68.                                     <span class="title-text pp-primary-title">
  69.                                         360° Virtual Reality Experience
  70.                                     </span>
  71.                                 </h2>
  72.                             </div>
  73.                             <div class="pp-heading-separator line_only pp-left">
  74.                                 <span class="pp-separator-line"></span>
  75.                             </div>
  76.                         </div>
  77.                     </div>
  78.                 </div>
  79.                 {% for key,value in media_3d %}
  80.                 <div class="fl-col fl-node-5df0bbe74bae9 fl-col-small"
  81.                      data-node="5df0bbe74bae9" style="width: 33%">
  82.                     <div class="fl-col-content fl-node-content">
  83.                         <div class="fl-module fl-module-pp-video fl-node-5df0be7651830"
  84.                              data-node="5df0be7651830">
  85.                             <div class="fl-module-content fl-node-content">
  86.                                 <div class="fl-module fl-module-pp-heading fl-node-5e2ea83168f95" data-node="5e2ea83168f95">
  87.                                     <div class="fl-node-content">
  88.                                         <div class="pp-heading-content">
  89.                                             <div class="pp-heading  pp-left">
  90.                                                 <h4 class="heading-title" style="font-size: 20px">
  91.                                                     <span class="title-text pp-primary-title">
  92.                                                         {{ key }}
  93.                                                     </span>
  94.                                                 </h4>
  95.                                             </div>
  96.                                             <div class="pp-heading-separator line_only pp-left">
  97.                                                 <span class="pp-separator-line"></span>
  98.                                             </div>
  99.                                         </div>
  100.                                     </div>
  101.                                 </div>
  102.                                 <br>
  103.                                 <div class="pp-video-wrapper pp-aspect-ratio-169">
  104.                                     <div class="pp-fit-aspect-ratio">
  105.                                         <div class="pp-video-image-overlay">
  106.                                             <img alt="" class="wp-image-39" height="600"
  107.                                                  loading="lazy" src="images/home/{{ home_data.videoLeftThumb }}" width="800"/>
  108.                                             <script class="pp-video-lightbox-content" type="text/html">
  109.                                                 <div class="pp-video-container">
  110.                                                     <div class="pp-fit-aspect-ratio">
  111.                                                         <iframe class="pp-video-iframe"
  112.                                                                 allowfullscreen
  113.                                                                 allow="autoplay"
  114.                                                                 src="{{ value }}?feature=oembed&amp;start&amp;end&amp;wmode=opaque&amp;loop=0&amp;controls=1&amp;mute=0&amp;rel=0&amp;modestbranding=1"></iframe>
  115.                                                     </div>
  116.                                                 </div>
  117.                                             </script>
  118.                                             <div class="pp-video-play-icon"
  119.                                                  role="button">
  120.                                                 <svg version="1.1"
  121.                                                      viewBox="0 0 415.346 415.346"
  122.                                                      x="0px"
  123.                                                      xml:space="preserve" xmlns="http://www.w3.org/2000/svg"
  124.                                                      xmlns:xlink="http://www.w3.org/1999/xlink"
  125.                                                      y="0px">
  126.                                                 <g>
  127.                                                     <g>
  128.                                                         <path d="M41.712,415.346c-11.763,0-21.3-9.537-21.3-21.3V21.299C20.412,9.536,29.949,0,41.712,0l346.122,191.697
  129.                                                             c0,0,15.975,15.975,0,31.951C371.859,239.622,41.712,415.346,41.712,415.346z"/>
  130.                                                     </g>
  131.                                                 </svg>
  132.                                                 <span class="pp-screen-only">Play Video</span>
  133.                                             </div>
  134.                                         </div>
  135.                                     </div>
  136.                                 </div>
  137.                             </div>
  138.                         </div>
  139.                     </div>
  140.                 </div>
  141.                 {% endfor %}
  142.             </div>
  143.         </div>
  144.         <div class="fl-row-content fl-row-fixed-width fl-node-content">
  145.             <div class="fl-col-group fl-node-5df0bbe74b6cf" data-node="5df0bbe74b6cf">
  146.                 <div class="fl-module fl-module-pp-heading fl-node-5e2ea83168f95" data-node="5e2ea83168f95">
  147.                     <div class="fl-module-content fl-node-content">
  148.                         <div class="pp-heading-content">
  149.                             <div class="pp-heading  pp-left">
  150.                                 <h2 class="heading-title">
  151.                                     <span class="title-text pp-primary-title">
  152.                                         2D Video Experience
  153.                                     </span>
  154.                                 </h2>
  155.                             </div>
  156.                             <div class="pp-heading-separator line_only pp-left">
  157.                                 <span class="pp-separator-line"></span>
  158.                             </div>
  159.                         </div>
  160.                     </div>
  161.                 </div>
  162.                 {% for key,value in media_2d %}
  163.                     <div class="fl-col fl-node-5df0bbe74bae9 fl-col-small"
  164.                          data-node="5df0bbe74bae9" style="width: 33%">
  165.                         <div class="fl-col-content fl-node-content">
  166.                             <div class="fl-module fl-module-pp-video fl-node-5df0be7651830"
  167.                                  data-node="5df0be7651830">
  168.                                 <div class="fl-module-content fl-node-content">
  169.                                     <div class="fl-module fl-module-pp-heading fl-node-5e2ea83168f95" data-node="5e2ea83168f95">
  170.                                         <div class="fl-node-content">
  171.                                             <div class="pp-heading-content">
  172.                                                 <div class="pp-heading  pp-left">
  173.                                                     <h4 class="heading-title" style="font-size: 20px">
  174.                                                     <span class="title-text pp-primary-title">
  175.                                                         {{ key }}
  176.                                                     </span>
  177.                                                     </h4>
  178.                                                 </div>
  179.                                                 <div class="pp-heading-separator line_only pp-left">
  180.                                                     <span class="pp-separator-line"></span>
  181.                                                 </div>
  182.                                             </div>
  183.                                         </div>
  184.                                     </div>
  185.                                     <br>
  186.                                     <div class="pp-video-wrapper pp-aspect-ratio-169">
  187.                                         <div class="pp-fit-aspect-ratio">
  188.                                             <div class="pp-video-image-overlay">
  189.                                                 <img alt="" class="wp-image-39" height="600"
  190.                                                      loading="lazy" src="images/home/{{ home_data.videoRightThumb }}" width="800"/>
  191.                                                 <script class="pp-video-lightbox-content" type="text/html">
  192.                                                     <div class="pp-video-container">
  193.                                                         <div class="pp-fit-aspect-ratio">
  194.                                                             <iframe class="pp-video-iframe"
  195.                                                                     allowfullscreen
  196.                                                                     allow="autoplay"
  197.                                                                     src="{{ value }}?feature=oembed&amp;start&amp;end&amp;wmode=opaque&amp;loop=0&amp;controls=1&amp;mute=0&amp;rel=0&amp;modestbranding=1"></iframe>
  198.                                                         </div>
  199.                                                     </div>
  200.                                                 </script>
  201.                                                 <div class="pp-video-play-icon"
  202.                                                      role="button">
  203.                                                     <svg version="1.1"
  204.                                                          viewBox="0 0 415.346 415.346"
  205.                                                          x="0px"
  206.                                                          xml:space="preserve" xmlns="http://www.w3.org/2000/svg"
  207.                                                          xmlns:xlink="http://www.w3.org/1999/xlink"
  208.                                                          y="0px">
  209.                                                 <g>
  210.                                                     <g>
  211.                                                         <path d="M41.712,415.346c-11.763,0-21.3-9.537-21.3-21.3V21.299C20.412,9.536,29.949,0,41.712,0l346.122,191.697
  212.                                                             c0,0,15.975,15.975,0,31.951C371.859,239.622,41.712,415.346,41.712,415.346z"/>
  213.                                                     </g>
  214.                                                 </svg>
  215.                                                     <span class="pp-screen-only">Play Video</span>
  216.                                                 </div>
  217.                                             </div>
  218.                                         </div>
  219.                                     </div>
  220.                                 </div>
  221.                             </div>
  222.                         </div>
  223.                     </div>
  224.                 {% endfor %}
  225.             </div>
  226.         </div>
  227.     {% endblock %}