templates/fr/patient-resources-self-testing.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  3. {% block title %}Ressources sur l’autosurveillance | CoaguChek{% endblock %}
  4. {% block description %}Trouvez de l’information pour apprendre à utiliser votre appareil CoaguChek®.{% endblock %}
  6. {% block main %}
  7.     <section class="bg-patient text-white position-relative roche-header">
  8.         <div class="container-fluid">
  9.             <div class="row align-items-center">
  10.                 <div class="col-lg-4 offset-lg-2 py-5 px-0 order-2 order-lg-1">
  11.                     <div class="container">
  12.                         <div class="h1">Ressources CoaguChek<sup>®</sup></div>
  13.                         <p class="mb-0">Trouvez de l’information sur le fonctionnement de votre appareil CoaguChek<sup>®</sup>, la garantie et la politique de remboursement, ainsi que les guides d’utilisation des appareils <span class="text-nowrap">CoaguChek<sup>®</sup> INRange</span> et <span class="text-nowrap">CoaguChek<sup>®</sup> XS.</span></p>
  14.                     </div>
  15.                 </div>
  16.                 <div class="col-lg-6 pe-0 order-1 order-lg-2">
  17.                     <img src="{{ asset('build/images/patient/06-Resources/00-Heroimage_1x.png') }}" srcset="{{ asset('build/images/patient/06-Resources/00-Heroimage_1x.png') }} 1x, {{ asset('build/images/patient/06-Resources/00-Heroimage_2x.png') }} 2x" alt="Une femme et un homme assis sur un canapé qui regarde une tablette" class="w-100" />
  18.                 </div>
  19.             </div>
  20.         </div>
  21.     </section>
  23.     <div data-controller="tab">
  24.         <section class="position-relative roche-section__medium mb-0 pb-0 pt-3 roche-tab lb-tab-menu roche-tab__patient">
  25.             <div class="container lb-tab-container">
  26.                 <div class="nav d-flex rounded-4 shadow mt-5 py-3 justify-content-around">
  27.                     <a href="{{ path('patient-resources-self-testing') }}"  class="nav-link active">Ressources sur l’autosurveillance</a>
  28.                     <a href="{{ path('patient-resources-warranty-formulary') }}"  class="nav-link">Formulaire de garantie</a>
  29.                     <a href="{{ path('patient-resources-reimbursement') }}" class="nav-link">Remboursement</a>
  30.                     <a href="{{ path('patient-resources-device-manuals') }}" class="nav-link">Guides d’utilisation des appareils</a>
  31.                     <a href="{{ path('patient-resources-glossary') }}" class="nav-link">Glossaire</a>
  32.                 </div>
  33.             </div>
  34.         </section>
  36.         <div class="tab-content">
  38.             <div class="tab-pane fade show active" id="self-testing">
  40.                 <section class="roche-section__medium">
  41.                     <div class="container">
  42.                         <h1 class="h2 text-patient">Apprenez à exercer une autosurveillance</h1>
  43.                         <p>L’autosurveillance du RIN à l’aide des appareils CoaguChek<sup>®</sup> INRange ou CoaguChek<sup>®</sup> XS est un processus simple qui s’effectue en quatre étapes!</p>
  44.                         <p class="mb-5"><a href="{{ path('patient-self-testing') }}#self-testing-cc" class="text-patient">Suivez les images</a> ou regardez une vidéo sur la façon d’utiliser votre appareil :</p>
  45.                         <div class="row">
  46.                             <div class="col-12 col-lg-6 order-1 order-lg-1">
  47.                                 <h3 class="text-patient">CoaguChek<sup>®</sup> INRange</h3>
  48.                                 <p>Regardez une courte vidéo pour apprendre à utiliser CoaguChek<sup>®</sup> INRange pour déterminer votre RIN.</p>
  49.                             </div>
  50.                             <div class="col-12 col-lg-6 order-3 order-lg-2 pt-5 pt-lg-0">
  51.                                 <h3 class="text-patient">CoaguChek<sup>®</sup> XS</h3>
  52.                                 <p>Regardez une courte vidéo pour apprendre à utiliser CoaguChek<sup>®</sup> XS pour déterminer votre RIN.</p>
  53.                             </div>
  54.                             <div class="col-12 col-lg-6 order-2 order-lg-3">
  55.                                 <div class="ratio ratio-16x9 mt-3">
  56.                                     <video poster="{{ asset('build/images/video-thumb-coaguchek.png') }}" controls="" id="html5_video_eany7cgzpzu">
  57.                                         <source src="{{ asset('build/videos/coaguchek-inrange-handling-video-fr.mp4') }}" type="video/mp4">
  58.                                     </video>
  59.                                 </div>                    
  60.                             </div>
  61.                             <div class="col-12 col-lg-6 order-4">
  62.                                 <div class="ratio ratio-16x9 mt-3">
  63.                                     <video poster="{{ asset('build/images/video-thumb-roche.png') }}" controls="" id="html5_video_eany7cgzpzu">
  64.                                         <source src="{{ asset('build/videos/coaguchek_xs_handling_video-fr.mp4') }}" type="video/mp4">
  65.                                     </video>
  66.                                 </div>                                    
  67.                             </div>    
  68.                         </div>
  69.                     </div>
  70.                 </section>
  72.                 <section class="roche-section__medium bg-soft">
  73.                     <div class="container">
  74.                         <div class="row align-items-center">
  75.                             <div class="col-12 col-lg-7 order-2 order-lg-1">
  76.                                 <div class="roche-image roche-image__left">
  77.                                     <img class="img-fluid" src="{{ asset('build/images/patient/06-Resources/01-BestPractice_1x.png') }}" srcset="{{ asset('build/images/patient/06-Resources/01-BestPractice_1x.png') }} 1x, {{ asset('build/images/patient/06-Resources/01-BestPractice_2x.png') }} 2x" alt="Un homme d'âge moyen qui regarde son téléphone">
  78.                                 </div>
  79.                             </div>    
  80.                             <div class="col-12 col-lg-5 order-1 order-lg-2 pb-5 p-lg-0">
  81.                                 <h2 class="text-patient">Meilleure pratique</h2>
  82.                                 <p >Ayez le guide d’utilisation de votre appareil à portée de main pour vous y référer au besoin pendant l’autosurveillance de votre RIN.</p>
  83.                                 <a href="{{ path('patient-resources-device-manuals') }}" class="btn btn-patient text-white">Voir les guides d’utilisation</a>
  84.                             </div>
  85.                         </div>
  86.                     </div>
  87.                 </section>
  88.             </div>
  90.         </div>
  92.     </div>
  95. {% endblock %}