templates/home/invectus.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  3. {% block body %}
  4.     <!-- Navbar Start -->
  5.     <div class="container-fluid position-relative p-0">
  6.        <div class="container-fluid bg-primary py-5 bg-header" style="margin-bottom: 90px;">
  7.             <div class="row py-5">
  8.                 <div class="col-12 pt-lg-5 mt-lg-5 text-center">
  9.                     <h1 class="display-4 text-white animated zoomIn">Invitus Slider</h1>
  10.                     <a href="{{ path('home') }}" class="h5 text-white">Accueil</a>
  11.                     <i class="far fa-circle text-white px-2"></i>
  12.                     <a href="" class="h5 text-white">Invitus Slider</a>
  13.                 </div>
  14.             </div>
  15.         </div>
  16.     </div>
  17.     <!-- Navbar End -->
  20.     <!-- Full Screen Search Start -->
  21.     <div class="modal fade" id="searchModal" tabindex="-1">
  22.         <div class="modal-dialog modal-fullscreen">
  23.             <div class="modal-content" style="background: rgba(9, 30, 62, .7);">
  24.                 <div class="modal-header border-0">
  25.                     <button type="button" class="btn bg-white btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
  26.                 </div>
  27.                 <div class="modal-body d-flex align-items-center justify-content-center">
  28.                     <div class="input-group" style="max-width: 600px;">
  29.                         <input type="text" class="form-control bg-transparent border-primary p-3" placeholder="Type search keyword">
  30.                         <button class="btn btn-primary px-4"><i class="bi bi-search"></i></button>
  31.                     </div>
  32.                 </div>
  33.             </div>
  34.         </div>
  35.     </div>
  36.     <!-- Full Screen Search End -->
  39.     <!-- Blog Start -->
  40.     <div class="container-fluid py-5 wow fadeInUp" data-wow-delay="0.1s">
  41.         <div class="container py-5">
  42.             <div class="row g-5">
  43.                 <div class="col-lg-8">
  44.                     <!-- Blog Detail Start -->
  45.                     <div class="mb-5">
  46.                         <img class="img-fluid w-100 rounded mb-5" src="{{asset('assets/img/projet1.jpg')}}" alt="">
  47.                         <h1 class="mb-4">Invictus slider</h1>
  48.                         <p>La présente invention a pour objet un slider motorisé de caméra pour le cinéma 
  49.                             Africain, destiné à participer à la modernisation de cette industrie et à l’amélioration
  50.                             des moyens de travail de nos cinéastes Africains.</p>
  51.                         <p>Suite à un dispositif de commande approprié, notre système est conçu pour réaliser les
  52.                              différents mouvements de caméra en particulier celui du travelling (verticale et horizontale),
  53.                               lors d’un tournage dans le cadre cinématographique ou d’une vidéo. En même temps il évite à 
  54.                               l’homme toute sorte de tâches répétitives ou dangereuses dans le domaine du cinéma afin de lui 
  55.                             faciliter un peu plus le travail.</p><br>
  57.                         <h4>Features</h4>
  58.                         <p> Enhances operator safety and reduces repetitive tasks <br>
  59.                             Capable of performing various camera movements for cinematic or video shooting <br>
  60.                             Wi-Fi and Bluetooth connectivity for easy control <br>
  61.                             User-friendly mobile or laptop app interface  <br>
  62.                         </p>
  63.                         <img class="img-fluid w-100 rounded mb-5" src="{{asset('assets/picture/4.png')}}" alt=""><br>
  64.                         <table>
  65.                             <tr>
  66.                               <th>Adventage</th>
  67.                               <th>Descriptions</th>
  68.                             </tr>
  69.                             <tr>
  70.                               <td>Time-saving</td>
  71.                               <td>The device allows for faster and more efficient camera movements, reducing the time required for filming or video production.</td>
  72.                             </tr>
  73.                             <tr>
  74.                               <td>Safety</td>
  75.                               <td>The device eliminates the need for repetitive or dangerous tasks, reducing the risk of accidents or injury for human operators.</td>
  76.                             </tr>
  77.                             <tr>
  78.                               <td>Precision</td>
  79.                               <td>The device can perform precise camera movements, ensuring high-quality footage without the need for multiple takes or editing.</td>
  80.                             </tr>
  81.                             <tr>
  82.                               <td>Remote control</td>
  83.                               <td>The device can be controlled remotely using a phone, tablet, or laptop, allowing for greater flexibility and convenience during filming or video production.</td>
  84.                             </tr>
  85.                           </table> <br>
  86.                           <iframe width="700" height="445" src="https://www.youtube.com/embed/Ji-lvZgba2E" title="1er SLIDER MOTORISE made in Afrique" ></iframe>
  87.                     </div>
  88.                     <!-- Blog Detail End -->
  89.  
  90.                 </div>
  91.     
  92.                 <!-- Sidebar Start -->
  93.                 <div class="col-lg-4">
  94.                     <!-- Search Form Start -->
  95.                     <div class="mb-5 wow slideInUp" data-wow-delay="0.1s">
  96.                         <div class="input-group">
  97.                             <input type="text" class="form-control p-3" placeholder="Keyword">
  98.                             <button class="btn btn-primary px-4"><i class="bi bi-search"></i></button>
  99.                         </div>
  100.                     </div>
  101.                     <!-- Search Form End -->
  102.     
  103.                     <!-- Category Start -->
  104.                     <div class="mb-5 wow slideInUp" data-wow-delay="0.1s">
  105.                         <div class="section-title section-title-sm position-relative pb-3 mb-4">
  106.                             <h3 class="mb-0">Categories</h3>
  107.                         </div>
  108.                         <div class="link-animated d-flex flex-column justify-content-start">
  109.                             <a class="h5 fw-semi-bold bg-light rounded py-2 px-3 mb-2" href="#"><i class="bi bi-arrow-right me-2"></i>Application web</a>
  110.                             <a class="h5 fw-semi-bold bg-light rounded py-2 px-3 mb-2" href="#"><i class="bi bi-arrow-right me-2"></i>Application moblie</a>
  111.                             <a class="h5 fw-semi-bold bg-light rounded py-2 px-3 mb-2" href="#"><i class="bi bi-arrow-right me-2"></i>Réalisation carte électronique</a>
  112.                             <a class="h5 fw-semi-bold bg-light rounded py-2 px-3 mb-2" href="#"><i class="bi bi-arrow-right me-2"></i>IOT</a>
  113.                             <a class="h5 fw-semi-bold bg-light rounded py-2 px-3 mb-2" href="#"><i class="bi bi-arrow-right me-2"></i>Système embrquée</a>
  114.                         </div>
  115.                     </div>
  116.                     <!-- Category End -->
  117.     
  118.                     <!-- Recent Post Start -->
  119.                     <div class="mb-5 wow slideInUp" data-wow-delay="0.1s">
  120.                         <div class="section-title section-title-sm position-relative pb-3 mb-4">
  121.                             <h3 class="mb-0">Postes récents</h3>
  122.                         </div>
  123.                         <div class="d-flex rounded overflow-hidden mb-3">
  124.                             <img class="img-fluid" src="{{asset('assets/img/bloc1.jpg')}}" style="width: 100px; height: 100px; object-fit: cover;" alt="">
  125.                             <a href="" class="h5 fw-semi-bold d-flex align-items-center bg-light px-3 mb-0">Nautx Eca Hackathon
  126.                             </a>
  127.                         </div>
  128.                         <div class="d-flex rounded overflow-hidden mb-3">
  129.                             <img class="img-fluid" src="{{asset('assets/img/bloc2.png')}}" style="width: 100px; height: 100px; object-fit: cover;" alt="">
  130.                             <a href="" class="h5 fw-semi-bold d-flex align-items-center bg-light px-3 mb-0">om22 Coding Camp Sénégal
  131.                             </a>
  132.                         </div>
  133.                         <div class="d-flex rounded overflow-hidden mb-3">
  134.                             <img class="img-fluid" src="{{asset('assets/img/tolukeur.jpg')}}" style="width: 100px; height: 100px; object-fit: cover;" alt="">
  135.                             <a href="" class="h5 fw-semi-bold d-flex align-items-center bg-light px-3 mb-0">TOOLU KËR
  136.                             </a>
  137.                         </div>
  138.                     </div>
  139.                     <!-- Recent Post End -->
  140.     
  141.                     <!-- Image Start -->
  142.                     <div class="mb-5 wow slideInUp" data-wow-delay="0.1s">
  143.                         <img src="img/blog-1.jpg" alt="" class="img-fluid rounded">
  144.                     </div>
  145.                     <!-- Image End -->
  146.     
  147.                     <!-- Tags Start -->
  148.                     <div class="mb-5 wow slideInUp" data-wow-delay="0.1s">
  149.                         <div class="section-title section-title-sm position-relative pb-3 mb-4">
  150.                             <h3 class="mb-0">Tag Cloud</h3>
  151.                         </div>
  152.                         <div class="d-flex flex-wrap m-n1">
  153.                             <a href="" class="btn btn-light m-1">Design</a>
  154.                             <a href="" class="btn btn-light m-1">Development</a>
  155.                             <a href="" class="btn btn-light m-1">Marketing</a>
  156.                             <a href="" class="btn btn-light m-1">SEO</a>
  157.                             <a href="" class="btn btn-light m-1">Writing</a>
  158.                             <a href="" class="btn btn-light m-1">Consulting</a>
  159.                         </div>
  160.                     </div>
  161.                     <!-- Tags End -->
  162.                 </div>
  163.                 <!-- Sidebar End -->
  164.             </div>
  165.         </div>
  166.     </div>
  167.     <!-- Blog End -->
  170.     <!-- Vendor Start -->
  171.     <div class="container-fluid py-5 wow fadeInUp" data-wow-delay="0.1s">
  172.         <div class="container py-5 mb-5">
  173.             <div class="bg-white">
  174.                 <div class="owl-carousel vendor-carousel">
  175.                     <img src="{{asset('assets/img/logoAG.png')}}" alt="">
  176.                     <img src="{{asset('assets/img/badis.png')}}" alt="">
  177.                     <img src="{{asset('assets/img/sabs.png')}}" alt="">
  178.                     <img src="{{asset('assets/img/millenium.png')}}" alt="">
  179.                     <img src="{{asset('assets/img/tolukeurlogo.png')}}" alt="">
  180.                     <img src="{{asset('assets/img/yaxanallogo.png')}}" alt="">
  181.                 </div>
  182.             </div>
  183.         </div>
  184.     </div>
  185.     <!-- Vendor End -->
  187. {% endblock %}