Ajouts de nouvelles pages sur le site
This commit is contained in:
parent
a32c93feb4
commit
3025684d7a
106
CV_Lenny.html
Normal file
106
CV_Lenny.html
Normal file
@ -0,0 +1,106 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="fr">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>CV - FOULOU Lenny</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<script>
|
||||||
|
function printCV() {
|
||||||
|
window.print();
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<button onclick="printCV()">Imprimer le CV</button>
|
||||||
|
|
||||||
|
<header>
|
||||||
|
<h1>FOULOU Lenny</h1>
|
||||||
|
<p>Formation</p>
|
||||||
|
<p>+33 7 69 20 13 37</p>
|
||||||
|
<p>lenny.foulou@etu.u-pec.fr</p>
|
||||||
|
<p>27 rue des Chanois, 77000 Livry sur Seine</p>
|
||||||
|
<style>
|
||||||
|
body {
|
||||||
|
font-family: Arial, sans-serif;
|
||||||
|
margin: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
h1, h2, h3 {
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
p {
|
||||||
|
color: #666;
|
||||||
|
}
|
||||||
|
|
||||||
|
.section {
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.education, .experience {
|
||||||
|
margin-left: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.skills {
|
||||||
|
margin-left: 20px;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<section class="section">
|
||||||
|
<h2>Formation</h2>
|
||||||
|
<div class="education">
|
||||||
|
<h3>2023 - 2024 : Première année de BUT Informatique</h3>
|
||||||
|
<p>IUT de Fontainebleau</p>
|
||||||
|
</div>
|
||||||
|
<div class="education">
|
||||||
|
<h3>2023 : Baccalauréat Général (mention assez bien)</h3>
|
||||||
|
<p>Spécialité:
|
||||||
|
- Mathématiques
|
||||||
|
- Physique-Chimie
|
||||||
|
- Sciences de la vie et de la Terre
|
||||||
|
</p>
|
||||||
|
<p>Lycée Simone Signoret, 77000 Vaux-le-Pénil</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section class="section">
|
||||||
|
<h2>Loisirs</h2>
|
||||||
|
<div class="interests">
|
||||||
|
<p>Basket : Pratique du Basket depuis 2019 club de Vaux-le-Pénil et compétition</p>
|
||||||
|
<p>Football : Pratique du football en club de 2012 à 2013, toujours passionné par ce sport</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section class="section">
|
||||||
|
<h2>Langues</h2>
|
||||||
|
<p>- Français (langue maternelle)</p>
|
||||||
|
<p>- Anglais (niveau intermédiaire)</p>
|
||||||
|
<p>- Espagnol (niveau intermédiaire)</p>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section class="section">
|
||||||
|
<h2>Compétences Informatiques</h2>
|
||||||
|
<div class="skills">
|
||||||
|
<p>C89 : Bonne maîtrise (réalisation du jeu Snake)</p>
|
||||||
|
<p>Programmation Web HTML 5/CSS : Notions (création d'un site de location)</p>
|
||||||
|
<p>Base de données Oracle SQL : Bonne maîtrise</p>
|
||||||
|
<p>UML: Bonne maîtrise</p>
|
||||||
|
<p>Administration et réseaux Bash : Bonne maîtrise (installation d'un poste de travail)</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section class="section">
|
||||||
|
<h2>Expérience Professionnelle</h2>
|
||||||
|
<div class="experience">
|
||||||
|
<p>Été 2023 : Manutentionnaire à la poste, à Orly et préparateur de commande en interim.</p>
|
||||||
|
<p>2022 : Arbitre de basketball à Vaux le Pénil, avoir des responsabilités et prendre des décisions rapidement</p>
|
||||||
|
<p>2020 : Stage d'observation à la crèche de l'hôpital, première impression du monde professionnel</p>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
BIN
Pegasus-Logo.webp
Normal file
BIN
Pegasus-Logo.webp
Normal file
Binary file not shown.
|
After 
(image error) Size: 115 KiB |
BIN
black.jpg
Normal file
BIN
black.jpg
Normal file
Binary file not shown.
|
After 
(image error) Size: 9.0 KiB |
145
contact.html
Normal file
145
contact.html
Normal file
@ -0,0 +1,145 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="fr">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="initial-scale=1,width=device-width">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
|
||||||
|
|
||||||
|
<title>Pegasus</title>
|
||||||
|
<link rel="stylesheet" href="style.css">
|
||||||
|
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="header-placeholder"></div>
|
||||||
|
<header>
|
||||||
|
<h2 class="logo"><img src="logo1.png" alt="Votre Logo" width="100"></h2>
|
||||||
|
<div class="menu-toggle">
|
||||||
|
<img src="menu.png" alt="Menu Burger" width="30">
|
||||||
|
</div>
|
||||||
|
<nav class="navigation">
|
||||||
|
<a href ="index.html">Acceuil</a>
|
||||||
|
<a href ="réservation.html">Réservation</a>
|
||||||
|
<a href ="equipement.html">Nos équipements</a>
|
||||||
|
<a href ="contact.html">Contact</a>
|
||||||
|
<a href ="faq.html">FAQ</a>
|
||||||
|
</nav>
|
||||||
|
<div class="menu-toggle" id="mobile-menu">
|
||||||
|
<span></span>
|
||||||
|
<span></span>
|
||||||
|
<span></span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="mobile-menu">
|
||||||
|
<a href="index.html">Acceuil</a>
|
||||||
|
<a href="réservation.html">Réservation</a>
|
||||||
|
<a href="equipement.html">Nos équipements</a>
|
||||||
|
<a href="contact.html">Contact</a>
|
||||||
|
<a href="faq.html">FAQ</a>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<section class="contact">
|
||||||
|
<div class="contact-container">
|
||||||
|
<h1>Nous Contacter</h1>
|
||||||
|
<p>Si vous avez des questions, des commentaires ou si vous avez simplement besoin de plus d'informations, n'hésitez pas à nous contacter. Nous sommes là pour vous aider!</p>
|
||||||
|
<form action="#" method="post">
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section class="about-us">
|
||||||
|
<h2 class="section-title">L'équipe Pegasus</h2>
|
||||||
|
<p class="section-description">Permettez-nous de vous présenter les personnes derrière Pegasus, notre équipe passionnée qui travaille pour rendre vos aventures exceptionnelles :</p>
|
||||||
|
<div class="about-us-container">
|
||||||
|
|
||||||
|
|
||||||
|
<div class="creator-profile">
|
||||||
|
<img src="lenny1.jpg" alt="Créateur 1">
|
||||||
|
<div class="profile-description">
|
||||||
|
<h3>Lenny FOULOU</h3>
|
||||||
|
<p>PDG et Chef de projet de Pegasus</p>
|
||||||
|
<p>6 mois d'expérience professionnelle</p>
|
||||||
|
<a href="CV_Lenny.html" target="_blank" class="cv-button">Voir le CV</a>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="creator-profile">
|
||||||
|
<img src="perso.png" alt="Créateur 2">
|
||||||
|
<div class="profile-description">
|
||||||
|
<h3>Nom du Créateur 2</h3>
|
||||||
|
<p>Description du Créateur 2...</p>
|
||||||
|
<a href="CV_Lenny.html" target="_blank" class="cv-button">Voir le CV</a>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="creator-profile">
|
||||||
|
<img src="perso.png" alt="Créateur 3">
|
||||||
|
<div class="profile-description">
|
||||||
|
<h3>Nom du Créateur 3</h3>
|
||||||
|
<p>Description du Créateur 3...</p>
|
||||||
|
<a href="CV_Lenny.html" target="_blank" class="cv-button">Voir le CV</a>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<section class="company-history">
|
||||||
|
<h2 class="section-title">Qui sommes-nous ?</h2>
|
||||||
|
<p class="section-description">Bienvenue chez Pegasus, votre destination privilégiée pour une expérience de loisirs exceptionnelle ! Fondée en 2024 par Lenny FOULOU, Khalid CHENOUNA et Yanis RECHACHI, notre entreprise est dédiée à la location d'équipements de loisirs pour répondre à toutes vos envies d'évasion.
|
||||||
|
|
||||||
|
Chez Pegasus, nous croyons en l'importance de créer des moments mémorables et de découvrir de nouvelles perspectives. Notre vaste sélection d'équipements de qualité vous offre la liberté de vivre pleinement chaque aventure, que ce soit en plein air, à la plage, ou lors d'événements spéciaux.
|
||||||
|
|
||||||
|
Explorez notre catalogue varié comprenant des kayaks, des vélos tout-terrain, des tentes spacieuses, des barbecues portables, des équipements de camping dernier cri et bien plus encore. Nous sommes fiers de vous proposer des équipements constamment mis à jour, alliant innovation et praticité pour une expérience de location exceptionnelle.
|
||||||
|
|
||||||
|
Chez Pegasus, votre satisfaction est notre priorité absolue. Notre équipe dévouée est là pour vous conseiller dans le choix des équipements adaptés à vos besoins et pour vous garantir un service personnalisé. Nous nous engageons à vous fournir des équipements en parfait état, entretenus avec soin, pour que vos moments de loisirs soient synonymes de plaisir et de tranquillité.
|
||||||
|
|
||||||
|
Découvrez les tarifs compétitifs de Pegasus, conçus pour s'adapter à tous les budgets, et profitez de nos options de location flexibles. Pegasus, c'est bien plus qu'une entreprise de location : c'est votre partenaire pour des expériences uniques et des souvenirs mémorables.
|
||||||
|
|
||||||
|
Laissez-vous emporter par l'esprit Pegasus et préparez-vous à vivre des aventures extraordinaires. Nous sommes impatients de vous accompagner dans chaque escapade, à la découverte de nouveaux horizons et de moments exceptionnels.</p>
|
||||||
|
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<footer>
|
||||||
|
<div class="footer-content">
|
||||||
|
<div class="footer-section about">
|
||||||
|
<h2>À propos de nous</h2>
|
||||||
|
<p>Explorez vos vacances avec Pegasus, votre partenaire idéal pour la location d'équipement de loisir.</p>
|
||||||
|
</div>
|
||||||
|
<div class="footer-section contact">
|
||||||
|
<h2>Contactez-nous</h2>
|
||||||
|
<p>Email: contact@pegasus.com</p>
|
||||||
|
<p>Téléphone: +123 456 789</p>
|
||||||
|
<div class="social-icons">
|
||||||
|
<a href="#" target="_blank"><img src="facebook.png" alt="Facebook" width="30" height="30"></a>
|
||||||
|
<a href="#" target="_blank"><img src="twitter.png" alt="Twitter" width="30" height="30"></a>
|
||||||
|
<a href="#" target="_blank"><img src="instagram.png" alt="Instagram" width="30" height="30"></a>
|
||||||
|
<!-- Ajoutez d'autres images selon vos besoins -->
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="footer-section links">
|
||||||
|
<h2>Liens rapides</h2>
|
||||||
|
<ul>
|
||||||
|
<li><a href="index.html">Acceuil</a></li>
|
||||||
|
<li><a href="réservation.html">Réservation</a></li>
|
||||||
|
<li><a href="equipement.html">Nos équipements</a></li>
|
||||||
|
<li><a href="contact.html">Contact</a></li>
|
||||||
|
<li><a href="faq.html">FAQ</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="footer-bottom">
|
||||||
|
<p>© 2024 Pegasus. Tous droits réservés.</p>
|
||||||
|
<p>Créez par Lenny FOULOU, Khalid CHENOUNA et Yanis RECHACHI</p>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
<button id="backToTopBtn" title="Retour en haut">↑</button>
|
||||||
|
<script src="script.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
BIN
entreprise.png
Normal file
BIN
entreprise.png
Normal file
Binary file not shown.
|
After 
(image error) Size: 185 KiB |
0
equipement.html
Normal file
0
equipement.html
Normal file
BIN
facebook.png
Normal file
BIN
facebook.png
Normal file
Binary file not shown.
|
After 
(image error) Size: 58 KiB |
123
faq.html
Normal file
123
faq.html
Normal file
@ -0,0 +1,123 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="fr">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="initial-scale=1,width=device-width">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
|
||||||
|
|
||||||
|
<title>Pegasus</title>
|
||||||
|
<link rel="stylesheet" href="style.css">
|
||||||
|
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
|
||||||
|
|
||||||
|
<div class="header-placeholder"></div>
|
||||||
|
<header>
|
||||||
|
<h2 class="logo"><img src="logo1.png" alt="Votre Logo" width="100"></h2>
|
||||||
|
<div class="menu-toggle">
|
||||||
|
<img src="menu.png" alt="Menu Burger" width="30">
|
||||||
|
</div>
|
||||||
|
<nav class="navigation">
|
||||||
|
<a href ="index.html">Acceuil</a>
|
||||||
|
<a href ="réservation.html">Réservation</a>
|
||||||
|
<a href ="equipement.html">Nos équipements</a>
|
||||||
|
<a href ="contact.html">Contact</a>
|
||||||
|
<a href ="faq.html">FAQ</a>
|
||||||
|
</nav>
|
||||||
|
<div class="menu-toggle" id="mobile-menu">
|
||||||
|
<span></span>
|
||||||
|
<span></span>
|
||||||
|
<span></span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="mobile-menu">
|
||||||
|
<a href="index.html">Acceuil</a>
|
||||||
|
<a href="réservation.html">Réservation</a>
|
||||||
|
<a href="equipement.html">Nos équipements</a>
|
||||||
|
<a href="contact.html">Contact</a>
|
||||||
|
<a href="faq.html">FAQ</a>
|
||||||
|
</div>
|
||||||
|
</header>
|
||||||
|
<main class="faq-container">
|
||||||
|
<section class="faq-section">
|
||||||
|
<h2>Foire Aux Questions</h2>
|
||||||
|
|
||||||
|
<div class="faq-item">
|
||||||
|
<h3>Q1 : Quels types d'équipements de loisirs proposez-vous à la location?</h3>
|
||||||
|
<p>Réponse : Nous proposons une large gamme d'équipements de loisirs, notamment des vélos électriques, des kayaks, des tentes de camping, des planches de surf, des motos-neiges, des montgolfières, et bien plus encore.</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="faq-item">
|
||||||
|
<h3>Q2 : Comment puis-je réserver un équipement pour mes activités de loisirs?
|
||||||
|
</h3>
|
||||||
|
<p>Réponse : La réservation est simple ! Vous pouvez le faire en ligne sur notre site Web convivial ou en nous appelant directement. Choisissez votre équipement, indiquez la date et la durée de location, et c'est tout !</p>
|
||||||
|
</div>
|
||||||
|
<div class="faq-item">
|
||||||
|
<h3>Q3 : Quelles sont les options de livraison disponibles pour l'équipement loué?
|
||||||
|
</h3>
|
||||||
|
<p>Réponse : Nous offrons des options de livraison pratiques à votre domicile, sur votre lieu de vacances, ou même sur le site de votre aventure. Des frais de livraison peuvent s'appliquer en fonction de la distance.</p>
|
||||||
|
</div>
|
||||||
|
<div class="faq-item">
|
||||||
|
<h3>Q4 : Y a-t-il des conditions d'âge ou de qualification pour la location de certains équipements?
|
||||||
|
</h3>
|
||||||
|
<p>Réponse : Oui, certaines activités peuvent avoir des exigences d'âge ou de compétence. Cependant, la plupart de nos équipements sont adaptés à tous les niveaux, et nos équipes sont là pour vous fournir les informations nécessaires.</p>
|
||||||
|
</div>
|
||||||
|
<div class="faq-item">
|
||||||
|
<h3>Q5 : Comment fonctionne le processus de retour de l'équipement?</h3>
|
||||||
|
<p>Réponse : Le retour de l'équipement est tout aussi simple que la réservation. Il vous suffit de ramener l'équipement à notre point de location désigné à la fin de la période de location convenue.</p>
|
||||||
|
</div>
|
||||||
|
<div class="faq-item">
|
||||||
|
<h3>Q6 : Proposez-vous des assurances pour les équipements loués?</h3>
|
||||||
|
<p>Réponse : Oui, nous proposons des options d'assurance pour la plupart de nos équipements. Cela vous offre une tranquillité d'esprit supplémentaire en cas d'éventuels dommages ou pertes pendant la période de location.</p>
|
||||||
|
</div>
|
||||||
|
<div class="faq-item">
|
||||||
|
<h3>Q7 : Puis-je modifier ma réservation une fois qu'elle est confirmée?</h3>
|
||||||
|
<p>Réponse : Oui, vous pouvez modifier votre réservation sous réserve de disponibilité. Nous vous recommandons de nous contacter dès que possible pour apporter des changements.</p>
|
||||||
|
</div>
|
||||||
|
<div class="faq-item">
|
||||||
|
<h3>Q8 : Quels sont vos tarifs de location?</h3>
|
||||||
|
<p>Réponse : Nos tarifs de location varient en fonction de l'équipement choisi, de la durée de la location et des options supplémentaires. Consultez notre site Web ou contactez-nous directement pour obtenir des informations détaillées sur les tarifs.</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</section>
|
||||||
|
</main>
|
||||||
|
<footer>
|
||||||
|
<div class="footer-content">
|
||||||
|
<div class="footer-section about">
|
||||||
|
<h2>À propos de nous</h2>
|
||||||
|
<p>Explorez vos vacances avec Pegasus, votre partenaire idéal pour la location d'équipement de loisir.</p>
|
||||||
|
</div>
|
||||||
|
<div class="footer-section contact">
|
||||||
|
<h2>Contactez-nous</h2>
|
||||||
|
<p>Email: contact@pegasus.com</p>
|
||||||
|
<p>Téléphone: +123 456 789</p>
|
||||||
|
<div class="social-icons">
|
||||||
|
<a href="#" target="_blank"><img src="facebook.png" alt="Facebook" width="30" height="30"></a>
|
||||||
|
<a href="#" target="_blank"><img src="twitter.png" alt="Twitter" width="30" height="30"></a>
|
||||||
|
<a href="#" target="_blank"><img src="instagram.png" alt="Instagram" width="30" height="30"></a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="footer-section links">
|
||||||
|
<h2>Liens rapides</h2>
|
||||||
|
<ul>
|
||||||
|
<li><a href="index.html">Acceuil</a></li>
|
||||||
|
<li><a href="réservation.html">Réservation</a></li>
|
||||||
|
<li><a href="equipement.html">Nos équipements</a></li>
|
||||||
|
<li><a href="contact.html">Contact</a></li>
|
||||||
|
<li><a href="faq.html">FAQ</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="footer-bottom">
|
||||||
|
<p>© 2024 Pegasus. Tous droits réservés.</p>
|
||||||
|
<p>Créez par Lenny FOULOU, Khalid CHENOUNA et Yanis RECHACHI</p>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
<button id="backToTopBtn" title="Retour en haut">↑</button>
|
||||||
|
<script src="script.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
158
index.html
158
index.html
@ -3,85 +3,48 @@
|
|||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<meta name="viewport" content="initial-scale=1,width=device-width">
|
<meta name="viewport" content="initial-scale=1,width=device-width">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no">
|
||||||
|
|
||||||
<title>Pegasus</title>
|
<title>Pegasus</title>
|
||||||
<link rel="stylesheet" href="style.css">
|
<link rel="stylesheet" href="style.css">
|
||||||
<script src="script.js"></script>
|
|
||||||
<script type="module" src="https://unpkg.com/ionicons@7.1.0/dist/ionicons/ionicons.esm.js"></script>
|
|
||||||
<script nomodule src="https://unpkg.com/ionicons@7.1.0/dist/ionicons/ionicons.js"></script>
|
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
|
|
||||||
|
|
||||||
<div class="header-placeholder"></div>
|
<div class="header-placeholder"></div>
|
||||||
<header>
|
<header>
|
||||||
<h2 class="logo">Logo</h2>
|
<h2 class="logo"><img src="logo1.png" alt="Votre Logo" width="100"></h2>
|
||||||
|
<div class="menu-toggle">
|
||||||
|
<img src="menu.png" alt="Menu Burger" width="30">
|
||||||
|
</div>
|
||||||
<nav class="navigation">
|
<nav class="navigation">
|
||||||
<a href ="#">Acceuil</a>
|
<a href ="index.html">Acceuil</a>
|
||||||
<a href ="#">Réservation</a>
|
<a href ="réservation.html">Réservation</a>
|
||||||
<a href ="#">À propos</a>
|
<a href ="equipement.html">Nos équipements</a>
|
||||||
<a href ="#">Contact</a>
|
<a href ="contact.html">Contact</a>
|
||||||
<a href ="#">FAQ</a>
|
<a href ="faq.html">FAQ</a>
|
||||||
<button class ="btnLogin-popup">Connexion</button>
|
|
||||||
</nav>
|
</nav>
|
||||||
</header>
|
<div class="menu-toggle" id="mobile-menu">
|
||||||
<div class="wrapper">
|
<span></span>
|
||||||
<span class="icon-close">
|
<span></span>
|
||||||
<ion-icon name="close-outline"></ion-icon>
|
<span></span>
|
||||||
</span class>
|
|
||||||
<div class="form-box login">
|
|
||||||
<h2>Connexion</h2>
|
|
||||||
<form action="#">
|
|
||||||
<div class="input-box">
|
|
||||||
<span class="icon"><ion-icon name="mail"></ion-icon></span>
|
|
||||||
<input type="email" required>
|
|
||||||
<label>Email</label>
|
|
||||||
</div>
|
|
||||||
<div class="input-box">
|
|
||||||
<span class="icon"><ion-icon name="lock-closed"></ion-icon></span>
|
|
||||||
<input type="password" required>
|
|
||||||
<label>Mot de passe</label>
|
|
||||||
</div>
|
|
||||||
<div class="remember-forgot">
|
|
||||||
<label><input type="checkbox"> Se souvenir de moi</label>
|
|
||||||
<a href="#">Mot de passe oublié ?</a>
|
|
||||||
</div>
|
|
||||||
<button type="submit" class="btn"> Connexion</button>
|
|
||||||
<div class="login-register">
|
|
||||||
<p>Vous n'avez pas de compte ?<a href ="#" class="register-link"> S'inscire</a></p>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="form-box register">
|
<div class="mobile-menu">
|
||||||
<h2>S'inscrire</h2>
|
<a href="index.html">Acceuil</a>
|
||||||
<form action="#">
|
<a href="réservation.html">Réservation</a>
|
||||||
<div class="input-box">
|
<a href="equipement.html">Nos équipements</a>
|
||||||
<span class="icon">
|
<a href="contact.html">Contact</a>
|
||||||
<ion-icon name="person"></ion-icon>
|
<a href="faq.html">FAQ</a>
|
||||||
</span>
|
|
||||||
<input type="text" required>
|
|
||||||
<label>Nom d'utilisateur</label>
|
|
||||||
</div>
|
|
||||||
<div class="input-box">
|
|
||||||
<span class="icon"><ion-icon name="mail"></ion-icon></span>
|
|
||||||
<input type="email" required>
|
|
||||||
<label>Email</label>
|
|
||||||
</div>
|
|
||||||
<div class="input-box">
|
|
||||||
<span class="icon"><ion-icon name="lock-closed"></ion-icon></span>
|
|
||||||
<input type="password" required>
|
|
||||||
<label>Mot de passe</label>
|
|
||||||
</div>
|
|
||||||
<div class="remember-forgot">
|
|
||||||
<label><input type="checkbox"> J'ai compris les conditions d'utilisations</label>
|
|
||||||
</div>
|
|
||||||
<button type="submit" class="btn"> S'inscrire</button>
|
|
||||||
<div class="login-register">
|
|
||||||
<p>Vous avez déjà un compte ?<a href ="#" class="login-link"> Connexion</a></p>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</header>
|
||||||
|
|
||||||
<section class="presentation">
|
<section class="presentation">
|
||||||
|
<img src="logo2.png" alt="Votre Logo" width="500" style="margin-left: auto; margin-right: auto;">
|
||||||
|
|
||||||
<h1>Bienvenue chez Pegasus</h1>
|
<h1>Bienvenue chez Pegasus</h1>
|
||||||
<p>
|
<p>
|
||||||
Explorez vos vacances avec Pegasus, votre partenaire idéal pour la location d'équipement de loisir.
|
Explorez vos vacances avec Pegasus, votre partenaire idéal pour la location d'équipement de loisir.
|
||||||
@ -98,34 +61,37 @@
|
|||||||
<p class="slogan">Vivez l'aventure, louez avec Pegasus!</p>
|
<p class="slogan">Vivez l'aventure, louez avec Pegasus!</p>
|
||||||
</section>
|
</section>
|
||||||
<section class="gallery">
|
<section class="gallery">
|
||||||
<h2>Nos Photos</h2>
|
<h2>Nos meilleures offres</h2>
|
||||||
<div class="photo-grid">
|
<div class="photo-grid">
|
||||||
<div class="photo">
|
<div class="photo">
|
||||||
<img src="montgolfiere.jpg" alt="Montgolfière">
|
<img src="montgolfiere.jpg" alt="Montgolfière">
|
||||||
<div class="comment">
|
<div class="comment">
|
||||||
<h3>Commentaire 1</h3>
|
<h3>Ciel</h3>
|
||||||
<p>Ceci est le commentaire pour la photo de la montgolfière.</p>
|
<p>Envolez-vous vers l'extraordinaire avec notre montgolfière de rêve ! Profitez d'une vue panoramique à couper le souffle, glissant doucement dans le ciel. Laissez-vous emporter par la magie des hauteurs et créez des souvenirs uniques en volant au gré des vents. Offrez-vous une aventure céleste inoubliable avec notre montgolfière !</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="photo">
|
<div class="photo">
|
||||||
<img src="jetski.jpg" alt="Jet Ski">
|
<img src="jetski.jpg" alt="Jet Ski">
|
||||||
<div class="comment">
|
<div class="comment">
|
||||||
<h3>Commentaire 2</h3>
|
<h3>Mer</h3>
|
||||||
<p>Ceci est le commentaire pour la photo du jet ski.</p>
|
<p>Découvrez l'ultime sensation de liberté aquatique avec notre jet-ski ! Puissant, agile et conçu pour l'aventure, il offre des moments inoubliables sur l'eau. Embarquez dès maintenant pour des escapades palpitantes et des souvenirs pleins de vitesse et de plaisir. Le jet-ski, c'est la promesse d'une expérience aquatique exceptionnelle !
|
||||||
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="photo">
|
<div class="photo">
|
||||||
<img src="motoneige.jpg" alt="Motoneige">
|
<img src="motoneige.jpg" alt="Motoneige">
|
||||||
<div class="comment">
|
<div class="comment">
|
||||||
<h3>Commentaire 3</h3>
|
<h3>Neige</h3>
|
||||||
<p>Ceci est le commentaire pour la photo de la motoneige.</p>
|
<p>
|
||||||
|
Vibrez au rythme de l'hiver avec notre moto-neige ultime ! Conçue pour la puissance et l'adrénaline, elle vous propulse à travers les paysages enneigés comme jamais. Explorez des terrains gelés avec confiance et ressentez l'excitation glacée de la vitesse. Préparez-vous à une aventure hivernale mémorable et domptez les étendues enneigées avec notre moto-neige haute performance !</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="photo">
|
<div class="photo">
|
||||||
<img src="buggy.jpg" alt="Buggy">
|
<img src="buggy.jpg" alt="Buggy">
|
||||||
<div class="comment">
|
<div class="comment">
|
||||||
<h3>Commentaire 4</h3>
|
<h3>Désert</h3>
|
||||||
<p>Ceci est le commentaire pour la photo du buggy.</p>
|
<p>
|
||||||
|
Plongez au cœur du désert avec notre buggy d'exception ! Conçu pour la puissance et l'aventure, il vous propulse à travers les dunes comme jamais auparavant. Explorez les paysages arides en toute confiance, ressentant l'excitation palpitante de la vitesse. Préparez-vous à une aventure désertique inoubliable et maîtrisez les étendues de sable avec notre buggy tout-terrain haute performance </p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@ -133,5 +99,43 @@
|
|||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<footer>
|
||||||
|
<div class="footer-content">
|
||||||
|
<div class="footer-section about">
|
||||||
|
<h2>Mentions légales</h2>
|
||||||
|
<p><a href="mention.html">Mentions légales</a></p>
|
||||||
|
</div>
|
||||||
|
<div class="footer-section contact">
|
||||||
|
<h2>Contactez-nous</h2>
|
||||||
|
<p>Email: contact@pegasus.com</p>
|
||||||
|
<p>Téléphone: +123 456 789</p>
|
||||||
|
</div>
|
||||||
|
<div class="social-icons">
|
||||||
|
<h2>Réseaux sociaux</h2>
|
||||||
|
<a href="#" target="_blank"><img src="facebook.png" alt="Facebook" width="30" height="30"></a>
|
||||||
|
<a href="#" target="_blank"><img src="twitter.png" alt="Twitter" width="30" height="30"></a>
|
||||||
|
<a href="#" target="_blank"><img src="instagram.png" alt="Instagram" width="30" height="30"></a>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="footer-section links">
|
||||||
|
<h2>Liens rapides</h2>
|
||||||
|
<ul>
|
||||||
|
<li><a href="index.html">Acceuil</a></li>
|
||||||
|
<li><a href="réservation.html">Réservation</a></li>
|
||||||
|
<li><a href="equipement.html">Nos équipements</a></li>
|
||||||
|
<li><a href="contact.html">Contact</a></li>
|
||||||
|
<li><a href="faq.html">FAQ</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="footer-bottom">
|
||||||
|
<p>© 2024 Pegasus. Tous droits réservés.</p>
|
||||||
|
<p>Créez par Lenny FOULOU, Khalid CHENOUNA et Yanis RECHACHI</p>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
<button id="backToTopBtn" title="Retour en haut">↑</button>
|
||||||
|
<script src="script.js"></script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</body>
|
</body>
|
||||||
BIN
instagram.png
Normal file
BIN
instagram.png
Normal file
Binary file not shown.
|
After 
(image error) Size: 6.6 KiB |
BIN
lenny.jpg
Normal file
BIN
lenny.jpg
Normal file
Binary file not shown.
|
After 
(image error) Size: 165 KiB |
BIN
lenny1.jpg
Normal file
BIN
lenny1.jpg
Normal file
Binary file not shown.
|
After 
(image error) Size: 140 KiB |
BIN
logo.jpg
BIN
logo.jpg
Binary file not shown.
|
Before 
(image error) Size: 56 KiB After 
(image error) Size: 68 KiB
|
BIN
logo1.png
Normal file
BIN
logo1.png
Normal file
Binary file not shown.
|
After 
(image error) Size: 37 KiB |
BIN
logo2.png
Normal file
BIN
logo2.png
Normal file
Binary file not shown.
|
After 
(image error) Size: 34 KiB |
BIN
menu.png
Normal file
BIN
menu.png
Normal file
Binary file not shown.
|
After 
(image error) Size: 24 KiB |
BIN
nul.jpg
Normal file
BIN
nul.jpg
Normal file
Binary file not shown.
|
After 
(image error) Size: 1.2 MiB |
BIN
pegasus.zip
Normal file
BIN
pegasus.zip
Normal file
Binary file not shown.
BIN
perso.png
Normal file
BIN
perso.png
Normal file
Binary file not shown.
|
After 
(image error) Size: 131 KiB |
113
réservation.html
Normal file
113
réservation.html
Normal file
@ -0,0 +1,113 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="fr">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Réservation - Pegasus</title>
|
||||||
|
<link rel="stylesheet" href="style.css">
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
<div class="header-placeholder"></div>
|
||||||
|
<header>
|
||||||
|
<h2 class="logo"><img src="logo1.png" alt="Votre Logo" width="100"></h2>
|
||||||
|
|
||||||
|
<nav class="navigation">
|
||||||
|
<a href ="index.html">Acceuil</a>
|
||||||
|
<a href ="réservation.html">Réservation</a>
|
||||||
|
<a href ="equipement.html">Nos équipements</a>
|
||||||
|
<a href ="contact.html">Contact</a>
|
||||||
|
<a href ="faq.html">FAQ</a>
|
||||||
|
</nav>
|
||||||
|
</header>
|
||||||
|
<section class="reservation">
|
||||||
|
<div class="reservation-container">
|
||||||
|
<h1>Réservez votre véhicule</h1>
|
||||||
|
<form action="#" method="post">
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="firstName">Prénom :</label>
|
||||||
|
<input type="text" name="firstName" id="firstName" required>
|
||||||
|
</div>
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="lastName">Nom :</label>
|
||||||
|
<input type="text" name="lastName" id="lastName" required>
|
||||||
|
</div>
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="email">Adresse e-mail :</label>
|
||||||
|
<input type="email" name="email" id="email" required>
|
||||||
|
</div>
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="vehicleType">Type de véhicule :</label>
|
||||||
|
<select name="vehicleType" id="vehicleType" required>
|
||||||
|
<option value="camping-car">Camping-car</option>
|
||||||
|
<option value="caravane">Caravane</option>
|
||||||
|
<option value="van">Van aménagé</option>
|
||||||
|
<option value="montgolfiere">Montgolfière</option>
|
||||||
|
<option value="jet-ski">jet-ski</option>
|
||||||
|
<option value="moto-neige">moto-neige</option>
|
||||||
|
<option value="ski">ski</option>
|
||||||
|
<option value="luge">Luge</option>
|
||||||
|
<option value="buggy">Buggy</option>
|
||||||
|
|
||||||
|
<!-- Ajoutez d'autres options selon vos besoins -->
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="startDate">Date de début :</label>
|
||||||
|
<input type="date" name="startDate" id="startDate" required>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="endDate">Date de fin :</label>
|
||||||
|
<input type="date" name="endDate" id="endDate" required>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="form-group">
|
||||||
|
<label for="additionalInfo">Informations supplémentaires :</label>
|
||||||
|
<textarea name="additionalInfo" id="additionalInfo" rows="4"></textarea>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<button type="submit">Réserver</button>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
<footer>
|
||||||
|
<div class="footer-content">
|
||||||
|
<div class="footer-section about">
|
||||||
|
<h2>À propos de nous</h2>
|
||||||
|
<p>Explorez vos vacances avec Pegasus, votre partenaire idéal pour la location d'équipement de loisir.</p>
|
||||||
|
</div>
|
||||||
|
<div class="footer-section contact">
|
||||||
|
<h2>Contactez-nous</h2>
|
||||||
|
<p>Email: contact@pegasus.com</p>
|
||||||
|
<p>Téléphone: +123 456 789</p>
|
||||||
|
<div class="social-icons">
|
||||||
|
<a href="#" target="_blank"><img src="facebook.png" alt="Facebook" width="30" height="30"></a>
|
||||||
|
<a href="#" target="_blank"><img src="twitter.png" alt="Twitter" width="30" height="30"></a>
|
||||||
|
<a href="#" target="_blank"><img src="instagram.png" alt="Instagram" width="30" height="30"></a>
|
||||||
|
<!-- Ajoutez d'autres images selon vos besoins -->
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="footer-section links">
|
||||||
|
<h2>Liens rapides</h2>
|
||||||
|
<ul>
|
||||||
|
<li><a href="index.html">Acceuil</a></li>
|
||||||
|
<li><a href="réservation.html">Réservation</a></li>
|
||||||
|
<li><a href="equipement.html">Nos équipements</a></li>
|
||||||
|
<li><a href="contact.html">Contact</a></li>
|
||||||
|
<li><a href="faq.html">FAQ</a></li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="footer-bottom">
|
||||||
|
<p>© 2024 Pegasus. Tous droits réservés.</p>
|
||||||
|
<p>Créez par Lenny FOULOU, Khalid CHENOUNA et Yanis RECHACHI</p>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
<button id="backToTopBtn" title="Retour en haut">↑</button>
|
||||||
|
<script src="script.js"></script>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
|
||||||
78
script.js
78
script.js
@ -1,37 +1,41 @@
|
|||||||
document.addEventListener("DOMContentLoaded", function () {
|
|
||||||
const wrapper = document.querySelector('.wrapper');
|
var mybutton = document.getElementById("backToTopBtn");
|
||||||
const loginLink = document.querySelector('.login-link');
|
|
||||||
const registerLink = document.querySelector('.register-link');
|
// Afficher le bouton lorsqu'on descend en dessous de 20 pixels depuis le haut de la page
|
||||||
const btnPopup = document.querySelector('.btnLogin-popup');
|
window.onscroll = function () {
|
||||||
const iconClose = document.querySelector('.icon-close');
|
scrollFunction();
|
||||||
|
};
|
||||||
function openLoginForm(event) {
|
|
||||||
event.preventDefault();
|
function scrollFunction() {
|
||||||
event.stopPropagation();
|
if (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) {
|
||||||
wrapper.classList.add('active-popup');
|
mybutton.style.display = "block";
|
||||||
}
|
} else {
|
||||||
|
mybutton.style.display = "none";
|
||||||
function closeLoginForm(event) {
|
}
|
||||||
event.preventDefault();
|
}
|
||||||
event.stopPropagation();
|
|
||||||
wrapper.classList.remove('active-popup');
|
|
||||||
}
|
mybutton.onclick = function () {
|
||||||
function hideLoginForm() {
|
document.body.scrollTop = 0;
|
||||||
wrapper.classList.remove('active-popup');
|
document.documentElement.scrollTop = 0;
|
||||||
}
|
};
|
||||||
|
|
||||||
registerLink.addEventListener('click', function (event) {
|
function printCV(cvUrl) {
|
||||||
openLoginForm(event);
|
var printWindow = window.open(cvUrl, '_blank');
|
||||||
wrapper.classList.add('active');
|
|
||||||
});
|
printWindow.onload = function () {
|
||||||
|
printWindow.print();
|
||||||
loginLink.addEventListener('click', function (event) {
|
printWindow.onafterprint = function () {
|
||||||
openLoginForm(event);
|
printWindow.close();
|
||||||
wrapper.classList.remove('active');
|
};
|
||||||
});
|
};
|
||||||
closeLoginForm();
|
}
|
||||||
|
|
||||||
btnPopup.addEventListener('click', openLoginForm);
|
document.addEventListener('DOMContentLoaded', function () {
|
||||||
iconClose.addEventListener('click', closeLoginForm);
|
const menuToggle = document.querySelector('.menu-toggle');
|
||||||
});
|
const mobileMenu = document.querySelector('.mobile-menu');
|
||||||
|
|
||||||
|
menuToggle.addEventListener('click', function () {
|
||||||
|
mobileMenu.style.display = mobileMenu.style.display === 'none' ? 'flex' : 'none';
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|||||||
BIN
twitter.png
Normal file
BIN
twitter.png
Normal file
Binary file not shown.
|
After 
(image error) Size: 22 KiB |
BIN
white.jpg
Normal file
BIN
white.jpg
Normal file
Binary file not shown.
|
After 
(image error) Size: 6.1 KiB |
Loading…
x
Reference in New Issue
Block a user