ajout première SAE WEB 1ere année 17/20
This commit is contained in:
EmmanuelTiamzon
201
SAE_WEB1/html/chef_tiamzon.html
Normal file
201
SAE_WEB1/html/chef_tiamzon.html
Normal file
@@ -0,0 +1,201 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="fr">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Chef TIAMZON Emmanuel - Étoiles & Saveurs</title>
|
||||
<link rel="stylesheet" href="../css/style_global.css">
|
||||
<style>
|
||||
.chef-profile {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
text-align: center;
|
||||
padding: 20px;
|
||||
background-color: #fff;
|
||||
margin: 20px auto;
|
||||
border-radius: 8px;
|
||||
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
|
||||
width: 80%;
|
||||
max-width: 800px;
|
||||
}
|
||||
|
||||
.chef-profile img {
|
||||
width: 200px;
|
||||
height: 200px;
|
||||
border-radius: 50%;
|
||||
object-fit: cover;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.chef-profile h2 {
|
||||
font-size: 2rem;
|
||||
margin-bottom: 10px;
|
||||
color: #a6aa7f;
|
||||
}
|
||||
|
||||
.chef-profile p {
|
||||
font-size: 1.2rem;
|
||||
color: #333;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.chef-specialties {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
gap: 40px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.specialty {
|
||||
background-color: #F9A03F;
|
||||
padding: 10px 20px;
|
||||
border-radius: 5px;
|
||||
color: #fff;
|
||||
font-weight: bold;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.contact-form {
|
||||
max-width: 600px;
|
||||
margin: 30px auto;
|
||||
background-color: #fff;
|
||||
padding: 20px;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.contact-form h2 {
|
||||
color: #a6aa7f;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.contact-form label {
|
||||
display: block;
|
||||
margin: 10px 0 5px;
|
||||
font-weight: bold;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.contact-form input,
|
||||
.contact-form textarea {
|
||||
width: 100%;
|
||||
padding: 10px;
|
||||
border: 1px solid #ddd;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.contact-form button {
|
||||
display: block;
|
||||
width: 100%;
|
||||
padding: 10px;
|
||||
background-color: #ffcc00;
|
||||
color: #333;
|
||||
font-weight: bold;
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.contact-form button:hover {
|
||||
background-color: #e6b800;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<header>
|
||||
<a href="../index.html"><img src="../img/logo_etoile&saveurs.png" alt="TIAMZON Emmanuel" width="100"></a>
|
||||
|
||||
|
||||
<div class="burger-menu" onclick="toggleMenu()">
|
||||
<span></span>
|
||||
<span></span>
|
||||
<span></span>
|
||||
</div>
|
||||
|
||||
|
||||
<a href="inscription.html" class="register-button">S'inscrire</a>
|
||||
|
||||
|
||||
<a href="connecter.html" class="login-button">Se connecter</a>
|
||||
|
||||
<nav class="main-nav" id="main-nav">
|
||||
<ul>
|
||||
<li><a href="../index.html">Accueil</a></li>
|
||||
<li><a href="apropos.html">Qui sommes-nous</a></li>
|
||||
<li><a href="page_recettes.html">Nos Chefs et Nos Recettes</a></li>
|
||||
<li><a href="carte_chefs.html">Carte des Chefs</a></li> <!-- Nouveau lien -->
|
||||
<li><a href="disponibilite.html">Disponibilité</a></li>
|
||||
<li><a href="page_contact.html">Contact</a></li>
|
||||
<li><a href="javascript:history.back()" class="back-button">Retour</a></li>
|
||||
</ul>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<main>
|
||||
<section class="chef-profile">
|
||||
<img src="../img/img_manu.jpg" alt="Chef TIAMZON Emmanuel">
|
||||
<h2>Chef TIAMZON Emmanuel</h2>
|
||||
<p>Chef passionné par la cuisine asiatique, italienne et la friture, Emmanuel TIAMZON est reconnu pour ses plats innovants qui mêlent tradition et modernité, créant des expériences culinaires inoubliables.</p>
|
||||
|
||||
<div class="chef-specialties">
|
||||
<div class="specialty">Cuisine asiatique</div>
|
||||
<div class="specialty">Cuisine Française</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="contact-form">
|
||||
<h2>Contactez Chef TIAMZON Emmanuel</h2>
|
||||
<form action="#" method="POST">
|
||||
<label for="name">Votre Nom</label>
|
||||
<input type="text" id="name" name="name" required>
|
||||
|
||||
<label for="email">Votre Email</label>
|
||||
<input type="email" id="email" name="email" required>
|
||||
|
||||
<label for="message">Votre Message</label>
|
||||
<textarea id="message" name="message" rows="4" required></textarea>
|
||||
|
||||
<button type="submit">Envoyer</button>
|
||||
</form>
|
||||
</section>
|
||||
</main>
|
||||
<div class="scroll-to-top" onclick="scrollToTop()">
|
||||
<img src="../img/fleche.png" alt="Retour en haut">
|
||||
</div>
|
||||
<footer>
|
||||
<p>© 2024 Étoiles & Saveurs. Tous droits réservés.</p>
|
||||
</footer>
|
||||
|
||||
<script>
|
||||
// Code pour le bouton burger
|
||||
const burgerMenu = document.querySelector('.burger-menu');
|
||||
const nav = document.querySelector('#main-nav'); // Utilisation du bon sélecteur pour nav
|
||||
|
||||
burgerMenu.addEventListener('click', () => {
|
||||
nav.classList.toggle('open');
|
||||
});
|
||||
|
||||
window.addEventListener('resize', () => {
|
||||
if (window.innerWidth > 768) {
|
||||
nav.classList.remove('open');
|
||||
}
|
||||
});
|
||||
|
||||
// Code pour le lien "Retour" (ajustement de l'ID)
|
||||
const backButton = document.querySelector('.back-button'); // Sélecteur corrigé
|
||||
|
||||
backButton.addEventListener('click', (e) => {
|
||||
e.preventDefault(); // Empêche le comportement par défaut du lien
|
||||
window.history.back(); // Retour à la page précédente
|
||||
});
|
||||
// Fonction pour revenir en haut de la page
|
||||
function scrollToTop() {
|
||||
window.scrollTo({
|
||||
top: 0,
|
||||
behavior: 'smooth'
|
||||
});
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user