templates/front/tuto/single-tuto.html.twig line 1

Open in your IDE?
  1. {% extends "front/base.html.twig" %}
  3. {% block title %}
  4.     {{ tuto.title }}
  5. {% endblock %}
  7. {% block body %}
  10.     <section class="first-section single-tutorial">
  11.         <div class="container">
  12.             <div class="row">
  13.                 <div class="col-12 mb-1">
  14.                     <a href="{{ path('tutos') }}" class="nav-link d-flex align-items-center px-0"><i class="fas fa-chevron-left h4 m-0"></i><span class="ml-2">{{ "tuto.back" | trans }}</span></a>
  15.                 </div>
  16.                 <div class="col-12">
  17.                     <div class="tuto-content">
  18.                         <h1 class="title m-0">{{ tuto.title }}</h1>
  19.                         <ul class="d-flex p-0 nav category">    
  20.                             {% for category in tuto.categories %}
  21.                                 <li class="nav-link pl-0 pt-0">
  22.                                     <span>{{ category.title }}</span>
  23.                                 </li>
  24.                             {% endfor %}
  25.                         </ul>
  26.                         {% if tuto.video %}
  27.                         {% set embed_url = tuto.video|replace({'watch?v=': 'embed/'}) %}
  28.                         <div class="content-main-video" data-video="{{ embed_url }}">
  29.                             <iframe width="100%" height="100%" src="{{ embed_url }}" title="{{ tuto.title }}" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>
  30.                         </div>
  31.                         {% else %}
  32.                         <div class="cover">
  33.                             <img loading="lazy" src="{{ asset('images/tuto/' ~ tuto.photo) }}" alt="{{ tuto.title }}">
  34.                         </div>
  35.                         {% endif %}
  37.                         <div class="content-text">
  38.                             {{ tuto.description | raw }}
  39.                         </div>
  40.                     </div>
  41.                 </div>                
  42.             </div>
  43.             <div class="row tutorials-section">
  44.                 <div class="col-12">
  45.                     <h2 class="section-title-underline">{{ "tuto.discover_also" | trans }}</h2>
  46.                     <div class="tutos-grid">
  48.                     {% for tuto in othersTuto %}
  50.                     <a class="tuto-card" href="{{ path('tuto_detail', {'slug' : tuto.slug}) }}">
  51.                         <div class="cover">
  52.                             <img loading="lazy" src="{{ asset('images/tuto/' ~ tuto.photo) }}" alt="{{ tuto.title }}">
  53.                         </div>
  54.                         <h3 class="title">{{ tuto.title }}</h3>
  55.                     </a>
  57.                     {% endfor %}
  59.                     </div>
  60.                 </div>
  61.             </div>
  62.         </div>
  63.     </section>
  66. {% endblock %}