91 lines
4.2 KiB
HTML
91 lines
4.2 KiB
HTML
<!DOCTYPE html>
|
||
<html>
|
||
<head>
|
||
<link rel="stylesheet" href="css/style_services.css" />
|
||
<meta charset="utf-8"/>
|
||
<meta name="viewport" content="width=device-width", initial-scame="1"/>
|
||
<title>FleetZen/services</title>
|
||
<html lang="fr">
|
||
</head>
|
||
<body>
|
||
<div id="nav_barre" class="shadow">
|
||
<h1>FleetZen</h1>
|
||
<div id="buttons">
|
||
<a href="../pages/contact.html"><button class="styled">contact</button></a>
|
||
<a href="../pages/services.html"><button class="x_to_x">services</button></a>
|
||
<a href="../index.html"><button class="retour btn_icone"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-undo2-icon lucide-undo-2"><path d="M9 14 4 9l5-5"/><path d="M4 9h10.5a5.5 5.5 0 0 1 5.5 5.5a5.5 5.5 0 0 1-5.5 5.5H11"/></svg>retour</button></a>
|
||
</div>
|
||
</div>
|
||
<div class="padding_left">
|
||
<p class="sous-titre">Découvrez nos services tous plus utiles les uns que les autres !</p>
|
||
<table border="1" class="table">
|
||
<thead>
|
||
<tr>
|
||
<th>Nom</th>
|
||
<th>Description</th>
|
||
<th>Prix</th>
|
||
</tr>
|
||
</thead>
|
||
<tr>
|
||
<td>Géolocalisation</td>
|
||
<td>Afin de retrouver l'ensemble de vos véhicules sur une carte en temps réel !</td>
|
||
<td>30€/véhicule/mois</td>
|
||
</tr>
|
||
<tr>
|
||
<td>Odomètre</td>
|
||
<td>Ayez accès à un killomètrage précis.</td>
|
||
<td>200€</td>
|
||
</tr>
|
||
<tr>
|
||
<td>Consommation</td>
|
||
<td>Le carburant consommé par votre flotte.</td>
|
||
<td>15£/véhicule/mois</td>
|
||
</tr>
|
||
<tr>
|
||
<td>Impact Carbonne</td>
|
||
<td>Ayez sous les yeux tous les chiffres concernant le CO2 rejeté par votre flotte</td>
|
||
<td>30€/véhicule/mois</td>
|
||
</tr>
|
||
</table>
|
||
</div>
|
||
<section class="simulateur">
|
||
<h2>Estimez votre devis</h2>
|
||
<p>Nombre de véhicules dans votre flotte :</p>
|
||
<button id="moins" type="button">−</button>
|
||
<span id="nb_vehicules">1</span>
|
||
<button id="plus" type="button">+</button>
|
||
<p>Total géolocalisation : <strong id="géolocalisation">30</strong> €/mois</p>
|
||
<p>Total consommation : <strong id="consommation">15</strong> €/mois</p>
|
||
</section>
|
||
<div class="center">
|
||
<div class="formulaire">
|
||
<form action="" method="post">
|
||
<p> Si vous avez des suggestions :</p>
|
||
<ul>
|
||
<li>
|
||
<label for="name">Nom :</label>
|
||
<input type="text" placeholder="Dupond" id="name" name="user_name" />
|
||
</li>
|
||
<li>
|
||
<label for="mail">E-mail :</label>
|
||
<input type="email" placeholder="dupondrichard@gmail.com" id="mail" name="user_mail" />
|
||
</li>
|
||
<li>
|
||
<label for="msg">Message :</label>
|
||
<textarea id="msg" placeholder="Je pense qu'il faudrait..." name="user_message"
|
||
row="6" cols="40" maxlength="500"></textarea>
|
||
</li>
|
||
<div id="boutton_formulaire">
|
||
<button type="submit"><svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-send-icon lucide-send"><path d="M14.536 21.686a.5.5 0 0 0 .937-.024l6.5-19a.496.496 0 0 0-.635-.635l-19 6.5a.5.5 0 0 0-.024.937l7.93 3.18a2 2 0 0 1 1.112 1.11z"/><path d="m21.854 2.147-10.94 10.939"/></svg>Envoyer le message</button>
|
||
</div>
|
||
</ul>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
<footer class="footer">
|
||
stagiaires rpz echoes
|
||
</footer>
|
||
<script src="css/devis.js"></script>
|
||
</body>
|
||
</html>
|