Merge pull request #4 from groupe1cir1n/Felix

fix a lot of little things and start the implementation of the footer JS

Add the loader to all pages
This commit is contained in:
Félix MARQUET
2023-05-15 19:44:38 +02:00
committed by GitHub
16 changed files with 140 additions and 39 deletions

View File

@@ -3,16 +3,19 @@
<head>
<meta charset="utf-8">
<title> Contacts </title>
<script src="/src/js/navbar.js" defer></script>
<script src="/src/js/navbarAndFooter.js" defer></script>
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap" rel="stylesheet">
<script src="src/js/InfosEtContact/contacts/contacts.js" defer></script>
<script src="https://kit.fontawesome.com/5b8b37978c.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="src/css/appear.css">
<link rel="stylesheet" href="src/css/loader.css">
<link rel="stylesheet" href="src/css/style_contacts.css">
<link rel="stylesheet" href="src/css/navbar.css">
<link rel="stylesheet" href="src/css/footer.css">
</head>
<body>
<div id="loader"></div>
<div id="pageContent">
<nav>
<div class="burger-menu">
<div class="burger"><i class="fa-solid fa-bars"></i></div>
@@ -80,5 +83,6 @@
<p id="item1">Created by <a href="https://www.linkedin.com/in/cl%C3%A9ment-brossaud-719313262/" class="copya">Clément Brossaud</a> and <a href="https://www.linkedin.com/in/felix-marquet-5071bb167/" class="copya">Félix Marquet</a></p>
</div>
</footer>
</div>
</body>
</html>

View File

@@ -3,15 +3,17 @@
<head>
<meta charset="utf-8">
<title> Emplois </title>
<script src="/src/js/navbar.js" defer></script>
<script src="/src/js/navbarAndFooter.js" defer></script>
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap" rel="stylesheet">
<script src="https://kit.fontawesome.com/5b8b37978c.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="src/css/appear.css">
<link rel="stylesheet" href="src/css/loader.css">
<link rel="stylesheet" href="src/css/style_emplois.css">
<link rel="stylesheet" href="src/css/navbar.css">
<link rel="stylesheet" href="src/css/footer.css">
</head>
<body>
<div id="loader"></div>
<div id="pageContent">
<nav>
<div class="burger-menu">
<div class="burger"><i class="fa-solid fa-bars"></i></div>
@@ -89,5 +91,6 @@
<p id="item1">Created by <a href="https://www.linkedin.com/in/cl%C3%A9ment-brossaud-719313262/" class="copya">Clément Brossaud</a> and <a href="https://www.linkedin.com/in/felix-marquet-5071bb167/" class="copya">Félix Marquet</a></p>
</div>
</footer>
</div>
</body>
</html>

View File

@@ -3,17 +3,19 @@
<head>
<meta charset="utf-8">
<title> Accueil </title>
<script src="/src/js/navbar.js" defer></script>
<script src="/src/js/navbarAndFooter.js" defer></script> <!--- Include also the copy warning -->
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap" rel="stylesheet">
<script src="https://kit.fontawesome.com/5b8b37978c.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="src/css/appear.css">
<link rel="stylesheet" href="src/css/loader.css">
<link rel="stylesheet" href="src/css/style.css">
<link rel="stylesheet" href="src/css/navbar.css">
<link rel="stylesheet" href="src/css/footer.css">
<script type="module" src="src/js/index/index.js" defer></script>
</head>
<body>
<nav>
<div id="loader"></div>
<div id="pageContent">
<nav>
<div class="burger-menu">
<div class="burger"><i class="fa-solid fa-bars"></i></div>
</div>
@@ -56,21 +58,22 @@
<footer>
<div class="foot">
<p>
ISEN Nantes: 33 Q Avenue du Champ de Manœuvres,<br> 44470 Carquefou <br>+33(0)2 30 13 05 60
ISEN Nantes: 33 Q Avenue du Champ de Manœuvres,<br> 44470 Carquefou <br><a href="tel:+33230130560" class="telFooter">+33(0)2 30 13 05 60</a>
</p>
<p>
ISEN Rennes: Campus RSB 2, rue Robert d'Arbrissel,<br> 35065 Rennes <br>+33(0)2 30 13 02 50
ISEN Rennes: Campus RSB 2, rue Robert d'Arbrissel,<br> 35065 Rennes <br><a href="tel:+33230130250" class="telFooter">+33(0)2 30 13 02 50</a>
</p>
<p>
ISEN Brest: 20 rue du Cuirassé,<br> Brest 29200 <br>+33(0)2 98 03 84 00
ISEN Brest: 20 rue du Cuirassé,<br> Brest 29200 <br><a href="tel:+33298038400" class="telFooter">+33(0)2 98 03 84 00</a>
</p>
<p>
ISEN Caen: 8 Avenue Croix Guérin,<br> 14000 CAEN <br>+33(0)2 30 31 03 20
ISEN Caen: 8 Avenue Croix Guérin,<br> 14000 CAEN <br><a href="tel:+33230310320" class="telFooter">+33(0)2 30 31 03 20</a>
</p>
</div>
<div class="copyright">
<p id="item1">Created by <a href="https://www.linkedin.com/in/cl%C3%A9ment-brossaud-719313262/" class="copya">Clément Brossaud</a> and <a href="https://www.linkedin.com/in/felix-marquet-5071bb167/" class="copya">Félix Marquet</a></p>
</div>
</footer>
</div>
</body>
</html>

View File

@@ -3,16 +3,18 @@
<head>
<meta charset="utf-8">
<title> Membres </title>
<script src="/src/js/navbar.js" defer></script>
<script src="/src/js/navbarAndFooter.js" defer></script>
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap" rel="stylesheet">
<script src="/src/js/membres/membres.js" defer></script>
<script src="https://kit.fontawesome.com/5b8b37978c.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="src/css/appear.css">
<link rel="stylesheet" href="src/css/loader.css">
<link rel="stylesheet" href="src/css/style_membres.css">
<link rel="stylesheet" href="src/css/navbar.css">
<link rel="stylesheet" href="src/css/footer.css">
</head>
<body>
<div id="loader"></div>
<div id="pageContent">
<nav>
<div class="burger-menu">
<div class="burger"><i class="fa-solid fa-bars"></i></div>
@@ -142,5 +144,6 @@
<p id="item1">Created by <a href="https://www.linkedin.com/in/cl%C3%A9ment-brossaud-719313262/" class="copya">Clément Brossaud</a> and <a href="https://www.linkedin.com/in/felix-marquet-5071bb167/" class="copya">Félix Marquet</a></p>
</div>
</footer>
</div>
</body>
</html>

View File

@@ -3,15 +3,17 @@
<head>
<meta charset="utf-8">
<title> Partenaires </title>
<script src="/src/js/navbar.js" defer></script>
<script src="/src/js/navbarAndFooter.js" defer></script>
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap" rel="stylesheet">
<script src="https://kit.fontawesome.com/5b8b37978c.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="src/css/appear.css">
<link rel="stylesheet" href="src/css/loader.css">
<link rel="stylesheet" href="src/css/style_partenaires.css">
<link rel="stylesheet" href="src/css/navbar.css">
<link rel="stylesheet" href="src/css/footer.css">
</head>
<body>
<div id="loader"></div>
<div id="pageContent">
<nav>
<div class="burger-menu">
<div class="burger"><i class="fa-solid fa-bars"></i></div>
@@ -163,5 +165,6 @@
<p id="item1">Created by <a href="https://www.linkedin.com/in/cl%C3%A9ment-brossaud-719313262/" class="copya">Clément Brossaud</a> and <a href="https://www.linkedin.com/in/felix-marquet-5071bb167/" class="copya">Félix Marquet</a></p>
</div>
</footer>
</div>
</body>
</html>

View File

@@ -3,15 +3,17 @@
<head>
<meta charset="utf-8">
<title> Plan </title>
<script src="/src/js/navbar.js" defer></script>
<script src="/src/js/navbarAndFooter.js" defer></script>
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap" rel="stylesheet">
<script src="https://kit.fontawesome.com/5b8b37978c.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="src/css/appear.css">
<link rel="stylesheet" href="src/css/loader.css">
<link rel="stylesheet" href="src/css/style_plan.css">
<link rel="stylesheet" href="src/css/navbar.css">
<link rel="stylesheet" href="src/css/footer.css">
</head>
<body>
<div id="loader"></div>
<div id="pageContent">
<nav>
<div class="burger-menu">
<div class="burger"><i class="fa-solid fa-bars"></i></div>
@@ -87,5 +89,6 @@
<p id="item1">Created by <a href="https://www.linkedin.com/in/cl%C3%A9ment-brossaud-719313262/" class="copya">Clément Brossaud</a> and <a href="https://www.linkedin.com/in/felix-marquet-5071bb167/" class="copya">Félix Marquet</a></p>
</div>
</footer>
</div>
</body>
</html>

View File

@@ -3,15 +3,17 @@
<head>
<meta charset="utf-8">
<title> Platformes technologiques </title>
<script src="/src/js/navbar.js" defer></script>
<script src="/src/js/navbarAndFooter.js" defer></script>
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap" rel="stylesheet">
<script src="https://kit.fontawesome.com/5b8b37978c.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="src/css/appear.css">
<link rel="stylesheet" href="src/css/loader.css">
<link rel="stylesheet" href="src/css/style_techno.css">
<link rel="stylesheet" href="src/css/navbar.css">
<link rel="stylesheet" href="src/css/footer.css">
</head>
<body>
<div id="loader"></div>
<div id="pageContent">
<nav>
<div class="burger-menu">
<div class="burger"><i class="fa-solid fa-bars"></i></div>
@@ -73,5 +75,6 @@
<p id="item1">Created by <a href="https://www.linkedin.com/in/cl%C3%A9ment-brossaud-719313262/" class="copya">Clément Brossaud</a> and <a href="https://www.linkedin.com/in/felix-marquet-5071bb167/" class="copya">Félix Marquet</a></p>
</div>
</footer>
</div>
</body>
</html>

View File

@@ -3,17 +3,19 @@
<head>
<meta charset="utf-8">
<title> Projets </title>
<script src="/src/js/navbar.js" defer></script>
<script src="/src/js/navbarAndFooter.js" defer></script>
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap" rel="stylesheet">
<script src="https://kit.fontawesome.com/5b8b37978c.js" crossorigin="anonymous"></script>
<script type="module" src="src/js/projets/projets.js" defer></script>
<script src="src/js/projets/returnToTop.js" defer></script>
<link rel="stylesheet" href="src/css/appear.css">
<link rel="stylesheet" href="src/css/loader.css">
<link rel="stylesheet" href="src/css/style_projets.css">
<link rel="stylesheet" href="src/css/navbar.css">
<link rel="stylesheet" href="src/css/footer.css">
</head>
<body>
<div id="loader"></div>
<div id="pageContent">
<nav>
<div class="burger-menu">
<div class="burger"><i class="fa-solid fa-bars"></i></div>
@@ -92,5 +94,6 @@
<p id="item1">Created by <a href="https://www.linkedin.com/in/cl%C3%A9ment-brossaud-719313262/" class="copya">Clément Brossaud</a> and <a href="https://www.linkedin.com/in/felix-marquet-5071bb167/" class="copya">Félix Marquet</a></p>
</div>
</footer>
</div>
</body>
</html>

View File

@@ -3,15 +3,17 @@
<head>
<meta charset="utf-8">
<title> Publications </title>
<script src="/src/js/navbar.js" defer></script>
<script src="/src/js/navbarAndFooter.js" defer></script>
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap" rel="stylesheet">
<script src="https://kit.fontawesome.com/5b8b37978c.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="src/css/appear.css">
<link rel="stylesheet" href="src/css/loader.css">
<link rel="stylesheet" href="src/css/style_publications.css">
<link rel="stylesheet" href="src/css/navbar.css">
<link rel="stylesheet" href="src/css/footer.css">
</head>
<body>
<div id="loader"></div>
<div id="pageContent">
<nav>
<div class="burger-menu">
<div class="burger"><i class="fa-solid fa-bars"></i></div>
@@ -72,5 +74,6 @@
<p id="item1">Created by <a href="https://www.linkedin.com/in/cl%C3%A9ment-brossaud-719313262/" class="copya">Clément Brossaud</a> and <a href="https://www.linkedin.com/in/felix-marquet-5071bb167/" class="copya">Félix Marquet</a></p>
</div>
</footer>
</div>
</body>
</html>

View File

@@ -3,15 +3,17 @@
<head>
<meta charset="utf-8">
<title> Thématique de recheche </title>
<script src="/src/js/navbar.js" defer></script>
<script src="/src/js/navbarAndFooter.js" defer></script>
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap" rel="stylesheet">
<script src="https://kit.fontawesome.com/5b8b37978c.js" crossorigin="anonymous"></script>
<link rel="stylesheet" href="src/css/appear.css">
<link rel="stylesheet" href="src/css/loader.css">
<link rel="stylesheet" href="src/css/style_recherche.css">
<link rel="stylesheet" href="src/css/navbar.css">
<link rel="stylesheet" href="src/css/footer.css">
</head>
<body>
<div id="loader"></div>
<div id="pageContent">
<nav>
<div class="burger-menu">
<div class="burger"><i class="fa-solid fa-bars"></i></div>
@@ -72,5 +74,6 @@
<p id="item1">Created by <a href="https://www.linkedin.com/in/cl%C3%A9ment-brossaud-719313262/" class="copya">Clément Brossaud</a> and <a href="https://www.linkedin.com/in/felix-marquet-5071bb167/" class="copya">Félix Marquet</a></p>
</div>
</footer>
</div>
</body>
</html>

View File

@@ -1,8 +0,0 @@
@keyframes appear {
from { transform: translateY(100%); }
to { transform: translateY(0%); }
}
body{
animation: appear 0.5s ease-in;
}

View File

@@ -48,4 +48,24 @@ footer{
.foot{
padding-bottom: 0;
}
}
.telFooter{
text-decoration: none;
color: white;
}
.telFooter:visited{
text-decoration: none;
color: white;
}
.telFooter:hover{
text-decoration: underline;
color: white;
}
.telFooter:active{
text-decoration: none;
color: white;
}

22
src/css/loader.css Normal file
View File

@@ -0,0 +1,22 @@
#loader {
border: 16px solid #f3f3f3;
border-top: 16px solid #3498db;
border-radius: 50%;
width: 120px;
height: 120px;
animation: spin 2s linear infinite;
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
z-index: 9999;
}
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
#pageContent {
visibility: hidden;
}

View File

@@ -44,9 +44,9 @@ const menuItems = document.querySelectorAll('.menu li');
menuItems.forEach((menuItem) => {
const originalBgColor = menuItem.style.backgroundColor;
console.log(originalBgColor)
menuItem.addEventListener('mouseover', () => {
const newBgColor = '#314153'; // Remplacez '#ccc' par la nouvelle couleur que vous souhaitez utiliser
const newBgColor = '';
menuItem.style.backgroundColor = newBgColor;
console.log(`L'ancienne couleur de fond était ${originalBgColor}, la nouvelle couleur est ${newBgColor}.`);
});
@@ -57,4 +57,43 @@ menuItems.forEach((menuItem) => {
});
updateTime();
startTimer();
startTimer();
//Copy warning
document.addEventListener('copy', function(event) {
console.log('Attention, le plagiat est interdit. Veuillez citer vos sources.');
});
// On sélectionne tous les éléments qui contiennent un numéro de téléphone
let phoneNumbers = document.querySelectorAll('a.telFooter');
phoneNumbers.forEach(function(phoneNumber) {
console.log(phoneNumber);
phoneNumber.addEventListener('copy', function(event) {
let copiedText = event.clipboardData.getData('text/plain');
console.log(copiedText);
let input = prompt('Si vous voulez appeler ce numéro : ' + copiedText + ', entrez le de nouveau dans le champ ci-dessous puis validez');
if (input === copiedText){
console.log("Vous appelez ce numéro : " + copiedText);
let audio = new Audio('/src/sound/sonnerie.mp3');
audio.play();
setTimeout(function() {
audio.pause();
}, 5000);
}
});
});
// Loader
document.getElementById('pageContent').classList.add('hidden');
window.addEventListener('load', function() {
setTimeout(function () {
document.getElementById('loader').style.display = 'none';
document.getElementById('pageContent').style.visibility = 'visible';
}, 2000);
});

View File

@@ -1,3 +0,0 @@
console.log("Yo")

BIN
src/sound/sonnerie.mp3 Normal file

Binary file not shown.