templates/school/help.html.twig line 1

Open in your IDE?
  1. {% extends 'layout/frontEndLayout.html.twig' %}
  3. {% block name %}
  4.     Help SmartEdu
  5. {% endblock %}
  7. {% block stylesheet %}
  8. {{ parent() }}
  9.  <style>
  10.   @media print {
  11.     body {
  12.       background: white; /* Fond blanc pour le PDF */
  13.     }
  14.     /* Ajoutez ici vos styles de mise en page pour le PDF */
  15.   }
  16. </style>
  17. {% endblock %}
  21. {% block body %}
  22.      <div class="container">
  23.      
  24.       <div class="nav-scroller py-1 mb-2">
  25.         <nav class="nav d-flex justify-content-between">
  26.           <a class="p-2 text-muted" href="#student">Elève</a>
  27.           <a class="p-2 text-muted" href="#teacher">Professeur</a>
  28.            <a class="p-2 text-muted" href="#year">Annee Scolaire</a>
  29.           <a class="p-2 text-muted" href="#quater">Trimestre</a>
  30.           <a class="p-2 text-muted" href="#sequence">Sequence</a>
  31.           <a class="p-2 text-muted" href="#evaluation">Evaluations</a>
  32.           <a class="p-2 text-muted" href="#attributions">Attriutions</a>
  33.           <a class="p-2 text-muted" href="#section">Sections</a>
  34.           <a class="p-2 text-muted" href="#room">Classes</a>
  35.           <a class="p-2 text-muted" href="#report">Bulletins</a>
  36.           <a class="p-2 text-muted" href="#course">Matières</a>
  37.           <a class="p-2 text-muted" href="#subscription">Inscription</a>
  38.           <a class="p-2 text-muted" href="#module">Module</a>
  39.         </nav>
  40.       </div>
  42.      
  44.     
  45.     </div>
  47.     <main role="main" class="container" id="pdf-content">
  48.     <div id="student" class="row mb-2">
  49.         <div class="col-md-12">
  50.           <div class="card flex-md-row mb-4 box-shadow h-md-250 row">
  51.             <div class="card-body d-flex flex-column align-items-start col-3">
  52.               <strong class="d-inline-block mb-2 text-primary">Presentation</strong>
  53.              
  54.           
  55.               <p class="card-text mb-auto">SmartEdu est une application web qui prend en main la gestion des notes, la scolarité et la discipline dans tout établisement. Voici ci-dessous detailées quelques fonctionnalités. </p>
  56.           
  57.             </div>
  58.             <img src="{{ asset('assets/images/logo.png') }}"  class="card-img-right flex-auto d-none d-md-block col-9 img-fluid" data-src="holder.js/200x250?theme=thumb" alt="Card image cap"/>
  59.           </div>
  60.         </div>
  61.       </div>
  62.      <div id="student" class="row mb-2">
  63.         <div class="col-md-12">
  64.           <div class="card flex-md-row mb-4 box-shadow h-md-250 row">
  65.             <div class="card-body d-flex flex-column align-items-start col-3">
  66.               <strong class="d-inline-block mb-2 text-primary">Profil élève</strong>
  67.              
  68.           
  69.               <p class="card-text mb-auto">Les élèves sont les acteurs de  première importance de l'applications. Chaque élève dispose d'une page ou sont rassemblées leurs données(Identité, parcours scolaire au sein de l'établissement, scolarité, performances sous format graphique).</p>
  70.           
  71.             </div>
  72.             <img src="{{ asset('assets/images/student_show.PNG') }}"  class="card-img-right flex-auto d-none d-md-block col-9 img-fluid" data-src="holder.js/200x250?theme=thumb" alt="Card image cap"/>
  73.           </div>
  74.         </div>
  75.       </div>
  76.        <div id="teacher" class="row mb-2">
  77.         <div class="col-md-12">
  78.           <div class="card flex-md-row mb-4 box-shadow h-md-250 row">
  79.             <div class="card-body d-flex flex-column align-items-start col-3">
  80.               <strong class="d-inline-block mb-2 text-primary">Enseignant</strong>
  81.              
  82.           
  83.               <p class="card-text mb-auto">Les enseignants sont les utilisateurs principaux de l'applications. Chaque enseignant dispose d'une page de profil .</p>
  84.           
  85.             </div>
  86.             <img src="{{ asset('assets/images/profil_user.PNG') }}"  class="card-img-right flex-auto d-none d-md-block col-9 img-fluid" data-src="holder.js/200x250?theme=thumb" alt="Card image cap"/>
  87.           </div>
  88.         </div>
  89.       </div>
  90.        <div id="year" class="row mb-2">
  91.         <div class="col-md-12">
  92.           <div class="card flex-md-row mb-4 box-shadow h-md-250 row">
  93.             <div class="card-body d-flex flex-column align-items-start col-3">
  94.               <strong class="d-inline-block mb-2 text-primary">Annee Scolaire</strong>
  95.               <p class="card-text mb-auto"> L'année scolaire détermine la période pour laquelle l'application fonctionne. Elle est constituee de   <b><a  href="#quater">trimestres</a></b>. L'administrateur a la responsabilité d'en créer/modifier/suprimer. </p>
  96.             </div>
  97.             <img src="{{ asset('assets/images/annees_scolaires.PNG') }}"  class="card-img-right flex-auto d-none d-md-block col-9 img-fluid" data-src="holder.js/200x250?theme=thumb" alt="Card image cap"/>
  98.           </div>
  99.         </div>
  100.       </div>
  101.        <div id="quater" class="row mb-2">
  102.         <div class="col-md-12">
  103.           <div class="card flex-md-row mb-4 box-shadow h-md-250 row">
  104.             <div class="card-body d-flex flex-column align-items-start col-3">
  105.               <strong class="d-inline-block mb-2 text-primary">Trimestre</strong>
  106.               <p class="card-text mb-auto"> Le trimestre détermine la période  de l' <b><a  href="#year">année scolaire</a></b> pour laquelle l'application fonctionne. Il est constitué de   <b><a  href="#sequence">séquences</a></b>. L'administrateur a la responsabilité d'en créer/modifier/suprimer. </p>
  107.             </div>
  108.             <img src="{{ asset('assets/images/trimestres.PNG') }}"  class="card-img-right flex-auto d-none d-md-block col-9 img-fluid" data-src="holder.js/200x250?theme=thumb" alt="Card image cap"/>
  109.           </div>
  110.         </div>
  111.       </div>
  112.        <div id="sequence" class="row mb-2">
  113.         <div class="col-md-12">
  114.           <div class="card flex-md-row mb-4 box-shadow h-md-250 row">
  115.             <div class="card-body d-flex flex-column align-items-start col-3">
  116.               <strong class="d-inline-block mb-2 text-primary">Séquence</strong>
  117.               <p class="card-text mb-auto"> La séquence détermine la période  du <b><a  href="#quater">trimestre</a></b> pour laquelle l'application fonctionne. Chaque     <b><a  href="#evalauation">évaluation</a></b> doit etre faite en une séquence. L'administrateur a la responsabilité d'en créer/modifier/suprimer. </p>
  118.             </div>
  119.             <img src="{{ asset('assets/images/sequence.PNG') }}"  class="card-img-right flex-auto d-none d-md-block col-9 img-fluid" data-src="holder.js/200x250?theme=thumb" alt="Card image cap"/>
  120.           </div>
  121.         </div>
  122.       </div>
  123.        <div id="evaluation" class="row mb-2">
  124.         <div class="col-md-12">
  125.           <div class="card flex-md-row mb-4 box-shadow h-md-250 row">
  126.             <div class="card-body d-flex flex-column align-items-start col-3">
  127.               <strong class="d-inline-block mb-2 text-primary">Evaluation</strong>
  128.               <p class="card-text mb-auto"> L'évaluation rassemble est notes d'éleves en une <b><a  href="#sequence">session</a></b>, sur une <b><a  href="#course">discipline</a></b>. Chaque <b><a  href="#teacher">enseignant</a></b> peut créer/modifier/suprimer les évaluations avec l'accord de l'administration. Lors de l'édition d'une évaluation, les listes d'éleves de la classe sont listés sous ordre alphabétique, les appréciations automatiquement affectées par defaut.
  129.               La liste des évaluations est paginée. Il est egalement possible de rechercher une évaluation en fonction de la <b><a  href="#sequence">séquence</a></b>, de la <b><a  href="#course">matiere</a></b> ou de la <b><a  href="#room">classe</a></b>  </p>
  130.             </div>
  131.             <img src="{{ asset('assets/images/new_evaluations.PNG') }}"  class="card-img-right flex-auto d-none d-md-block col-9 img-fluid" data-src="holder.js/200x250?theme=thumb" alt="Card image cap"/>
  132.             <img src="{{ asset('assets/images/evaluations.PNG') }}"  class="card-img-right flex-auto d-none d-md-block col-9 img-fluid" data-src="holder.js/200x250?theme=thumb" alt="Card image cap"/>
  134.           </div>
  135.         </div>
  136.       </div>
  137.        <div id="attribution" class="row mb-2">
  138.         <div class="col-md-12">
  139.           <div class="card flex-md-row mb-4 box-shadow h-md-250 row">
  140.             <div class="card-body d-flex flex-column align-items-start col-3">
  141.               <strong class="d-inline-block mb-2 text-primary">Attribution</strong>
  142.               <p class="card-text mb-auto"> La responsabilité de dispenser un  <b><a  href="#course">cours</a></b> dans une <b><a  href="#room">classe</a></b>  est definie par l'administrateur a chaque   nouvelle   <b><a  href="#year">année scolaire</a></b> doit etre faite en une séquence. Le formulaire est concu de sorte qu'il est impossible que la même matière soit attribuee a différents enseignants la même année.</p>
  143.             </div>
  144.             <img src="{{ asset('assets/images/attributions_new.PNG') }}"  class="card-img-right flex-auto d-none d-md-block col-9 img-fluid" data-src="holder.js/200x250?theme=thumb" alt="Card image cap"/>
  145.           </div>
  146.         </div>
  147.       </div>
  148.         <div id="subscription" class="row mb-2">
  149.         <div class="col-md-12">
  150.           <div class="card flex-md-row mb-4 box-shadow h-md-250 row">
  151.             <div class="card-body d-flex flex-column align-items-start col-3">
  152.               <strong class="d-inline-block mb-2 text-primary">Inscription</strong>
  153.               <p class="card-text mb-auto"> Inscrire un  <b><a  href="#student">eleve</a></b> dans une <b><a  href="#room">classe</a></b> en une   <b><a  href="#year">année scolaire</a></b> doit etre faite . Le formulaire est concu de sorte qu'il est impossible que le même elève soit inscrit a différentes classes la même année.</p>
  154.             </div>
  155.             <img src="{{ asset('assets/images/new_subscription.PNG') }}"  class="card-img-right flex-auto d-none d-md-block col-9 img-fluid" data-src="holder.js/200x250?theme=thumb" alt="Card image cap"/>
  156.           </div>
  157.         </div>
  158.       </div>
  159.        <div id="section" class="row mb-2">
  160.         <div class="col-md-12">
  161.           <div class="card flex-md-row mb-4 box-shadow h-md-250 row">
  162.             <div class="card-body d-flex flex-column align-items-start col-3">
  163.               <strong class="d-inline-block mb-2 text-primary">Sections</strong>
  164.               <p class="card-text mb-auto"> SmartEdu donne la possibilité de structurer l'établissement en sections selon le système d'enseignement(Anglophone ou francophone). Ce qui détermine la langue a base de laquelle les bulletins de notes des élèves d'une classe seront redigée.</p>
  165.             </div>
  166.             <img src="{{ asset('assets/images/sections.PNG') }}"  class="card-img-right flex-auto d-none d-md-block col-9 img-fluid" data-src="holder.js/200x250?theme=thumb" alt="Card image cap"/>
  167.           </div>
  168.         </div>
  169.       </div>
  170.       <div id="section" class="row mb-2">
  171.         <div class="col-md-12">
  172.           <div class="card flex-md-row mb-4 box-shadow h-md-250 row">
  173.             <div class="card-body d-flex flex-column align-items-start col-3">
  174.               <strong class="d-inline-block mb-2 text-primary">Classes</strong>
  175.               <p class="card-text mb-auto">Les  <b><a  href="#section">sections</a></b> sont constituees de niveaux qui eux memes regroupent les classes. Chaque classe dispose d'une page dans laquelle elle est presentee de facons detaillee : la liste des eleves, la liste des  <b><a  href="#module">modules de cours</a></b>, les performances moyennes de la classes sous forme graphique a differentes sessions sur toutes les cours.</p>
  176.             </div>
  177.             <img src="{{ asset('assets/images/classes_show.PNG') }}"  class="card-img-right flex-auto d-none d-md-block col-9 img-fluid" data-src="holder.js/200x250?theme=thumb" alt="Card image cap"/>
  178.             <img src="{{ asset('assets/images/classes_show_2.PNG') }}"  class="card-img-right flex-auto d-none d-md-block col-6 img-fluid" data-src="holder.js/200x250?theme=thumb" alt="Card image cap"/>
  179.             <img src="{{ asset('assets/images/classes_show_3.PNG') }}"  class="card-img-right flex-auto d-none d-md-block col-6 img-fluid" data-src="holder.js/200x250?theme=thumb" alt="Card image cap"/>
  180.           </div>
  181.         </div>
  182.       </div>
  183.       <div id="report" class="row mb-2">
  184.         <div class="col-md-12">
  185.           <div class="card flex-md-row mb-4 box-shadow h-md-250 row">
  186.             <div class="card-body d-flex flex-column align-items-start col-3">
  187.               <strong class="d-inline-block mb-2 text-primary">Bulletins de notes</strong>
  188.               <p class="card-text mb-auto">Les  <b><a  href="#report">Bulletins de notes</a></b> sequentielles, trimestrielles ou annuelles peuvent etre generee par  <b><a  href="#room">classe</a></b> ou par  <b><a  href="#student">eleve</a></b> Ils consistent en un document format A4. 
  189.            
  190.           </div>
  191.         <img src="{{ asset('assets/images/buletins.PNG') }}"  class="card-img-right flex-auto d-none d-md-block col-9 img-fluid" data-src="holder.js/200x250?theme=thumb" alt="Card image cap"/>
  193.         </div>
  194.       </div>
  198.     </main><!-- /.container -->
  200. {% endblock %}