templates/gallery/index.html.twig line 1

Open in your IDE?
  2. {% extends 'base.html.twig' %}
  3. {% block title %}Hello IndexController!{% endblock %}
  4. {% block nav %}
  5.     <header class="header-nav menu_style_home_one style2 navbar-scrolltofixed stricky main-menu">
  6.  
  7. {% endblock %}
  8. {% block stylesheets %}
  9.     <style>
  10.     .gallery_item{
  11.         margin-bottom: 30px;
  12.         position: relative;
  13.     }
  14.     .gallery_item .gallery_overlay{
  15.         background-color: rgba(255, 90, 95, .8);
  16.         border-radius: 5px;
  17.         bottom: 0;
  18.         left: 0;
  19.         position: absolute;
  20.         right: 0;
  21.         top: 0;
  22.         width: 100%;
  23.         -webkit-transform: scale(0);
  24.         -moz-transform: scale(0);
  25.         -o-transform: scale(0);
  26.         -ms-transform: scale(0);
  27.         transform: scale(0);
  28.         -webkit-transition: all 0.3s ease 0s;
  29.         -moz-transition: all 0.3s ease 0s;
  30.         -o-transition: all 0.3s ease 0s;
  31.         transition: all 0.3s ease 0s;
  32.     }
  33.     .gallery_item:hover .gallery_overlay{
  34.         -webkit-transform: scale(1.0);
  35.         -moz-transform: scale(1.0);
  36.         -o-transform: scale(1.0);
  37.         -ms-transform: scale(1.0);
  38.         transform: scale(1.0);
  39.     }
  40.     .gallery_item .gallery_overlay .icon{
  41.         bottom: 0;
  42.         left: 0;
  43.         position: absolute;
  44.         right: 0;
  45.         top: 35%;
  46.         text-align: center;
  47.     }
  48.     .gallery_item .gallery_overlay .icon span{
  49.         color: #ffffff;
  50.         font-size: 50px;
  51.     }
  55. .inner_page_breadcrumb {
  56.   background-image: url({{ asset('https://{{image.domaine}}/uploads/' ~ image) | imagine_filter('gallerieindex') }});
  57.   background-repeat: no-repeat;
  58.   height: 410px;
  59.   position: relative; 
  60. }
  63. </style>
  64.  
  65. {% endblock %}
  67.   {% block logo %}
  68.                                     {{ include('include/logopage.html.twig') }} 
  69. {% endblock %}
  71.  
  72. {% block body %}
  73. <!-- Inner Page Breadcrumb -->
  74.     <section class="inner_page_breadcrumb">
  75.         <div class="container">
  76.             <div class="row">
  77.                 <div class="col-xl-6">
  78.                     <div class="breadcrumb_content">
  79.                         <ol class="breadcrumb">
  80.                             <li class="breadcrumb-item"><a href="#">Home</a></li>
  81.                             <li class="breadcrumb-item active" aria-current="page">Gallery</li>
  82.                         </ol>
  83.                         <h1 class="breadcrumb_title"> {{ titre }}   </h1>
  84.                     </div>
  85.                 </div>
  86.             </div>
  87.         </div>
  88.     </section>
  90.     <!-- About Text Content -->
  91.     <section class="about-section pb30">
  92.         <div class="container">
  93.             <div class="row">
  94.  {% for image in images %}
  96.                 <div class="col-sm-6 col-md-6 col-lg-4">
  97.                     <div class="gallery_item">
  98.                         <img class="img-fluid img-circle-rounded w100" src="https://{{image.domaine}}/uploads/{{ image.image }}" alt="fp1.jpg">
  99.                         <div class="gallery_overlay"><a class="icon popup-img" href="https://{{image.domaine}}/uploads/{{ image.image }}"><span class="flaticon-zoom-in"></span></a></div>
  100.                     </div>
  101.                 </div>
  103.    {% endfor %}
  105.             </div>
  106.         </div>
  107.     </section>
  109.  
  111. {% endblock %}