templates/gallery/index.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  3. {% block body %}
  5.                             <!-- PAGE-HEADER -->
  6.                             <div class="page-header">
  7.                                 <div>
  8.                                     <h1 class="page-title">Gallery</h1>
  9.                                 </div>
  10.                                 <div class="ms-auto pageheader-btn">
  11.                                     <ol class="breadcrumb">
  12.                                         <li class="breadcrumb-item"><a href="javascript:void(0);">UI Elements</a></li>
  13.                                         <li class="breadcrumb-item active" aria-current="page">Gallery</li>
  14.                                     </ol>
  15.                                 </div>
  16.                             </div>
  17.                             <!-- PAGE-HEADER END -->
  19.                             <!-- GALLERY DEMO OPEN -->
  20.                             <div class="demo-gallery card">
  21.                                 <div class="card-header">
  22.                                     <div class="card-title">Light Gallery</div>
  23.                                 </div>
  24.                                 <div class="card-body">
  25.                                     <ul id="lightgallery" class="list-unstyled row">
  26.                                         <li class="col-xs-6 col-sm-4 col-md-4 col-xl-4 mb-5 border-bottom-0" data-responsive="{{absolute_url(asset('build/images/media/1.jpg'))}}" data-src="{{absolute_url(asset('build/images/media/1.jpg'))}}" data-sub-html="<h4>Gallery Image 1</h4><p> Many desktop publishing packages and web page editors now use Lorem Ipsum</p>">
  27.                                             <a href="javascript:void(0)">
  28.                                                 <img class="img-responsive br-5 wp-100" src="{{absolute_url(asset('build/images/media/1.jpg'))}}" alt="Thumb-1">
  29.                                             </a>
  30.                                         </li>
  31.                                         <li class="col-xs-6 col-sm-4 col-md-4 col-xl-4 mb-5 border-bottom-0" data-responsive="{{absolute_url(asset('build/images/media/4.jpg'))}}" data-src="{{absolute_url(asset('build/images/media/4.jpg'))}}" data-sub-html=" <h4>Gallery Image 4</h4><p> Many desktop publishing packages and web page editors now use Lorem Ipsum</p>">
  32.                                             <a href="javascript:void(0)">
  33.                                                 <img class="img-responsive br-5 wp-100" src="{{absolute_url(asset('build/images/media/4.jpg'))}}" alt="Thumb-2">
  34.                                             </a>
  35.                                         </li>
  37.                                         <li class="col-xs-6 col-sm-4 col-md-4 col-xl-4 mb-5 border-bottom-0" data-responsive="{{absolute_url(asset('build/images/media/5.jpg'))}}" data-src="{{absolute_url(asset('build/images/media/5.jpg'))}}" data-sub-html="<h4>Gallery Image 5</h4><p> Many desktop publishing packages and web page editors now use Lorem Ipsum</p>">
  38.                                             <a href="javascript:void(0)">
  39.                                                 <img class="img-responsive br-5 wp-100" src="{{absolute_url(asset('build/images/media/5.jpg'))}}" alt="Thumb-1">
  40.                                             </a>
  41.                                         </li>
  42.                                         <li class="col-xs-6 col-sm-4 col-md-4 col-xl-4 mb-5 border-bottom-0" data-responsive="{{absolute_url(asset('build/images/media/6.jpg'))}}" data-src="{{absolute_url(asset('build/images/media/6.jpg'))}}" data-sub-html="<h4>Gallery Image 6</h4><p> Many desktop publishing packages and web page editors now use Lorem Ipsum</p>">
  43.                                             <a href="javascript:void(0)">
  44.                                                 <img class="img-responsive br-5 wp-100" src="{{absolute_url(asset('build/images/media/6.jpg'))}}" alt="Thumb-2">
  45.                                             </a>
  46.                                         </li>
  47.                                         <li class="col-xs-6 col-sm-4 col-md-4 col-xl-4 mb-5 border-bottom-0" data-responsive="{{absolute_url(asset('build/images/media/7.jpg'))}}" data-src="{{absolute_url(asset('build/images/media/7.jpg'))}}" data-sub-html="<h4>Gallery Image 7</h4><p> Many desktop publishing packages and web page editors now use Lorem Ipsum</p>">
  48.                                             <a href="javascript:void(0)">
  49.                                                 <img class="img-responsive br-5 wp-100" src="{{absolute_url(asset('build/images/media/7.jpg'))}}" alt="Thumb-1">
  50.                                             </a>
  51.                                         </li>
  52.                                         <li class="col-xs-6 col-sm-4 col-md-4 col-xl-4 mb-5 border-bottom-0" data-responsive="{{absolute_url(asset('build/images/media/8.jpg'))}}" data-src="{{absolute_url(asset('build/images/media/8.jpg'))}}" data-sub-html="<h4>Gallery Image 8</h4><p> Many desktop publishing packages and web page editors now use Lorem Ipsum</p>">
  53.                                             <a href="javascript:void(0)">
  54.                                                 <img class="img-responsive br-5 wp-100" src="{{absolute_url(asset('build/images/media/8.jpg'))}}" alt="Thumb-2">
  55.                                             </a>
  56.                                         </li>
  57.                                         <li class="col-xs-6 col-sm-4 col-md-4 col-xl-4 mb-5 mb-md-0 mb-xl-0  border-bottom-0" data-responsive="{{absolute_url(asset('build/images/media/11.jpg'))}}" data-src="{{absolute_url(asset('build/images/media/11.jpg'))}}" data-sub-html="<h4>Gallery Image 11</h4><p> Many desktop publishing packages and web page editors now use Lorem Ipsum</p>">
  58.                                             <a href="javascript:void(0)">
  59.                                                 <img class="img-responsive mb-0 br-5 wp-100" src="{{absolute_url(asset('build/images/media/11.jpg'))}}" alt="Thumb-1">
  60.                                             </a>
  61.                                         </li>
  62.                                         <li class="col-xs-6 col-sm-4 col-md-4 col-xl-4 mb-xl-0 mb-md-0 mb-md-0 mb-5 border-bottom-0" data-responsive="{{absolute_url(asset('build/images/media/10.jpg'))}}" data-src="{{absolute_url(asset('build/images/media/10.jpg'))}}" data-sub-html="<h4>Gallery Image 10</h4><p> Many desktop publishing packages and web page editors now use Lorem Ipsum</p>">
  63.                                             <a href="javascript:void(0)">
  64.                                                 <img class="img-responsive mb-0 br-5 wp-100" src="{{absolute_url(asset('build/images/media/10.jpg'))}}" alt="Thumb-2">
  65.                                             </a>
  66.                                         </li>
  67.                                         <li class="col-xs-6 col-sm-4 col-md-4 col-xl-4 mb-5 border-bottom-0" data-responsive="{{absolute_url(asset('build/images/media/2.jpg'))}}" data-src="{{absolute_url(asset('build/images/media/2.jpg'))}}" data-sub-html="<h4>Gallery Image 2</h4><p> Many desktop publishing packages and web page editors now use Lorem Ipsum</p>">
  68.                                             <a href="javascript:void(0)">
  69.                                                 <img class="img-responsive br-5 wp-100" src="{{absolute_url(asset('build/images/media/2.jpg'))}}" alt="Thumb-2">
  70.                                             </a>
  71.                                         </li>
  72.                                         <li class="col-xs-6 col-sm-4 col-md-4 col-xl-4 mb-5 border-bottom-0" data-responsive="{{absolute_url(asset('build/images/media/9.jpg'))}}" data-src="{{absolute_url(asset('build/images/media/9.jpg'))}}" data-sub-html="<h4>Gallery Image 9</h4><p> Many desktop publishing packages and web page editors now use Lorem Ipsum</p>">
  73.                                             <a href="javascript:void(0)">
  74.                                                 <img class="img-responsive mb-0 br-5 wp-100" src="{{absolute_url(asset('build/images/media/9.jpg'))}}" alt="Thumb-1">
  75.                                             </a>
  76.                                         </li>
  77.                                         <li class="col-xs-6 col-sm-4 col-md-4 col-xl-4 mb-5 border-bottom-0" data-responsive="{{absolute_url(asset('build/images/media/12.jpg'))}}" data-src="{{absolute_url(asset('build/images/media/12.jpg'))}}" data-sub-html="<h4>Gallery Image 12</h4><p> Many desktop publishing packages and web page editors now use Lorem Ipsum</p>">
  78.                                             <a href="javascript:void(0)">
  79.                                                 <img class="img-responsive mb-0 br-5 wp-100" src="{{absolute_url(asset('build/images/media/12.jpg'))}}" alt="Thumb-2">
  80.                                             </a>
  81.                                         </li>
  82.                                         <li class="col-xs-6 col-sm-4 col-md-4 col-xl-4 mb-5 border-bottom-0" data-responsive="{{absolute_url(asset('build/images/media/20.jpg'))}}" data-src="{{absolute_url(asset('build/images/media/20.jpg'))}}" data-sub-html="<h4>Gallery Image 9</h4><p> Many desktop publishing packages and web page editors now use Lorem Ipsum</p>">
  83.                                             <a href="javascript:void(0)">
  84.                                                 <img class="img-responsive mb-0 br-5 wp-100" src="{{absolute_url(asset('build/images/media/20.jpg'))}}" alt="Thumb-1">
  85.                                             </a>
  86.                                         </li>
  87.                                     </ul>
  88.                                 </div>
  89.                             </div>
  90.                             <!-- GALLERY DEMO CLOSED -->
  92.                             <!-- PAGINATION OPEN -->
  93.                             <div class="row mb-5">
  94.                                 <div class="col-md-6 mt-1 d-none d-md-block">1 - 10 of 234 photos</div>
  95.                                 <div class="col-md-6">
  96.                                     <div class="float-end">
  97.                                         <ul class="pagination">
  98.                                             <li class="page-item page-prev disabled">
  99.                                                 <a class="page-link" href="#" tabindex="-1">Prev</a>
  100.                                             </li>
  101.                                             <li class="page-item active"><a class="page-link" href="#">1</a></li>
  102.                                             <li class="page-item"><a class="page-link" href="#">2</a></li>
  103.                                             <li class="page-item"><a class="page-link" href="#">3</a></li>
  104.                                             <li class="page-item"><a class="page-link" href="#">4</a></li>
  105.                                             <li class="page-item"><a class="page-link" href="#">5</a></li>
  106.                                             <li class="page-item page-next">
  107.                                                 <a class="page-link" href="#">Next</a>
  108.                                             </li>
  109.                                         </ul>
  110.                                     </div>
  111.                                 </div><!-- COL-END -->
  112.                             </div>
  113.                             <!-- PAGINATION CLOSED -->
  114. {% endblock %}
  116. {% block javascripts %}
  117.    {{parent()}} 
  118.         <!-- GALLERY JS -->
  119.         <script src="{{absolute_url(asset('build/plugins/gallery/picturefill.js'))}}"></script>
  120.         <script src="{{absolute_url(asset('build/plugins/gallery/lightgallery.js'))}}"></script>
  121.         <script src="{{absolute_url(asset('build/plugins/gallery/lightgallery-1.js'))}}"></script>
  122.         <script src="{{absolute_url(asset('build/plugins/gallery/lg-pager.js'))}}"></script>
  123.         <script src="{{absolute_url(asset('build/plugins/gallery/lg-autoplay.js'))}}"></script>
  124.         <script src="{{absolute_url(asset('build/plugins/gallery/lg-fullscreen.js'))}}"></script>
  125.         <script src="{{absolute_url(asset('build/plugins/gallery/lg-zoom.js'))}}"></script>
  126.         <script src="{{absolute_url(asset('build/plugins/gallery/lg-hash.js'))}}"></script>
  127.         <script src="{{absolute_url(asset('build/plugins/gallery/lg-share.js'))}}"></script>
  128. {% endblock %}