Commit 49735851 authored by Corentin Mors's avatar Corentin Mors
Browse files

Add user guide to homepage

parent 10370a35
......@@ -47,44 +47,171 @@
</div>
</div>
<!-- <br>
<h1> Article </h1>
<div class="row box ">
<article class="article">
<h2>Article 1</h2>
Invitis rumores ipsa nuntiabant nuntiabant peius vel posticas rumores peragranter nuntiabant
habitu audirent homines quaedam super duplicarent his peius quae.
</article>
</div>
<br><br>
<div class="row box ">
<article class="article">
<h2>Article 2</h2>
Haberi exposui Laeli habitum Fannio Laeli cum cum libro illo incidisset ab tamquam secum hoc cum diebus eam
saepius cum Marci ne ipsam cum Eius post in arbitratu altero arbitratu Scaevola mentionem secum genero cum Scaevola
C ut diebus filio.
</article>
</div>
<button type="button" class="btn btn-warning btn-block" data-toggle="modal" data-target="#tutoModal">
Launch user guide
</button>
<div class="row box ">
<article class="article">
<h2>Article 3</h2>
Modi est me necem cadaveribus quorum ut multa nihilo narrare quod narrare cadaveribus non nihilo modum pastus quae professione singula evitandum quod nihilo refert huius modum narrare non quod cadaveribus ferociens narrare multa professione
modum leo quorum me professione multa narrare est quorum ferociens quorum ferociens scrutabatur ut necem nihilo me non leo evitandum necem non professione me ut quorum scrutabatur me quorum quorum evitandum ut cadaveribus me lenius non non
pastus quae non pastus professione narrare nihilo cadaveribus Gallus leo nihilo quod lenius cadaveribus cadaveribus refert quod quae quod Gallus modi cadaveribus non singula huius pastus modi quod ferociens.
</article>
</div>
<!-- Modals -->
<div class="modal fade" id="tutoModal" tabindex="-1" role="dialog" aria-labelledby="tutoModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="tutoModalLabel">User guide</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
This tutorial will show you the features of the application. If you close it now, you will still be able to get help in the <strong>FAQ</strong> section.
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary" data-dismiss="modal" data-toggle="modal" data-target="#dashboardModal">Next</button>
</div>
</div>
</div>
</div> <!--Modal for the beginning of tutorial-->
<div class="modal fade" id="dashboardModal" tabindex="-1" role="dialog" aria-labelledby="dashboardModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="dashboardModalLabel">Your Dashboard</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
Under the <strong>Dashboard</strong> section you can find information about your sensors, robots, camp, datacenter, weather forecasts and vital signs.
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary" data-dismiss="modal" data-toggle="modal" data-target="#checklistModal">Next</button>
</div>
</div>
</div>
</div> <!--Modal for the dashboard explanation-->
<div class="modal fade" id="checklistModal" tabindex="-1" role="dialog" aria-labelledby="checklistModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="checklistModalLabel">Your Checklist</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
Under the <strong>Checklist</strong> section you can track every achieved and remaining tasks to be performed to stay organized.
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary" data-dismiss="modal" data-toggle="modal" data-target="#vitalsModal">Next</button>
</div>
</div>
</div>
</div> <!--Modal for the checklist explanation-->
<div class="modal fade" id="vitalsModal" tabindex="-1" role="dialog" aria-labelledby="vitalsModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="vitalsModalLabel">Your Vitals</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
On the left side of the interface you can see three icons. They enable you to go directly to the <strong>survival</strong> section, or monitor your heart rate and hydration level. Find more information in the <strong>FAQ</strong> section.
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary" data-dismiss="modal" data-toggle="modal" data-target="#mapModal">Next</button>
</div>
</div>
</div>
</div> <!--Modal for the vitals icons explanation-->
<div class="modal fade" id="mapModal" tabindex="-1" role="dialog" aria-labelledby="mapModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="mapModalLabel">Your Map</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
Under the <strong>Map</strong> section you are allowed to see your position on a map and get your GPS coordinates.
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary" data-dismiss="modal" data-toggle="modal" data-target="#survivalModal">Next</button>
</div>
</div>
</div>
</div> <!--Modal for the map section explanation-->
<div class="modal fade" id="survivalModal" tabindex="-1" role="dialog" aria-labelledby="survivalModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="survivalModalLabel">Your Survival Guide</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
Under the <strong>Survival</strong> section you will find plenty of useful tips on how to survive in a hostile environment.
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary" data-dismiss="modal" data-toggle="modal" data-target="#suppliesModal">Next</button>
</div>
</div>
</div>
</div> <!--Modal for the survival guide explanation-->
<div class="modal fade" id="suppliesModal" tabindex="-1" role="dialog" aria-labelledby="suppliesModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="suppliesModalLabel">Your Supplies</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
Under the <strong>Supplies</strong> section you will be able to monitor the status of your supplies : food, water and hardware.
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary" data-dismiss="modal" data-toggle="modal" data-target="#tutoEndModal">Next</button>
</div>
</div>
</div>
</div> <!--Modal for the supplies explanation-->
<div class="row box ">
<article class="article">
<h2>Article 4</h2>
Nec milites iumentorum itineribus repente tristissima spoliari et itineribus oppidum eo domesticis spoliari elegerat qua eo milites posse spoliari apparuit tristissima sunt qui in sub Apodemio in agente emensis qui insidiarum cum praemiis
certus itaque praefuit praestitutum posse suis et imperio permutatione miseratione eum tristissima praestitutum et praefuit suis vita insidiarum praemiis tristissima rebus viam Barbatio elegerat et quos sorte praestitutum praestitutum venit
itaque milites imperator sunt oppidum itaque suis ulla qua miseratione et imperator domesticis repente qui qui ducens spoliari nec cum beneficiis posse et et imperio emensis fatorum in praefuit imperator posse praefuit Apodemio viam insidiarum
praemiis suis.
</article>
</div> -->
<div class="modal fade" id="tutoEndModal" tabindex="-1" role="dialog" aria-labelledby="tutoEndModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="tutoEndModalLabel">Tutorial End</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
This is the end of the tutorial. If you wish to get these explanations again in the future, go to the <strong>FAQ</strong> section.
</div>
<div class="modal-footer">
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div> <!--Modal for the end of tutorial-->
</main><!-- /.container -->
{% endblock %}
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment