generated from Templates_CodeFirst/templateHtmlCss
cocaillot
5 months ago
parent
5b17febcff
commit
ac68028ba5
@ -0,0 +1,85 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="fr">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<link type="text/css" rel="stylesheet" href="style.css">
|
||||||
|
<script src="toggle.js"></script>
|
||||||
|
<script src="effect.js" defer></script>
|
||||||
|
<title>Compétences - Corentin</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<nav class="navbar">
|
||||||
|
<ul class="navbar-list">
|
||||||
|
<li><a href="index.html">Accueil</a></li>
|
||||||
|
<li><a href="cursus.html">Cursus</a></li>
|
||||||
|
<li class="dropdown">
|
||||||
|
<a href="#">Galerie</a>
|
||||||
|
<ul class="dropdown-content">
|
||||||
|
<li><a href="projets.html">Projets</a></li>
|
||||||
|
<li><a href="competences.html">Compétences</a></li>
|
||||||
|
</ul>
|
||||||
|
</li>
|
||||||
|
<li><a href="form.php">Contact</a></li>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
|
||||||
|
<header>
|
||||||
|
<h1>Mes Compétences</h1>
|
||||||
|
</header>
|
||||||
|
|
||||||
|
<section class="skills-section">
|
||||||
|
<h2>💻 Langages de Programmation</h2>
|
||||||
|
<div class="tech-icons">
|
||||||
|
<div class="tech-box c-box"><img src="logos/c.jpeg" alt="C">C</div>
|
||||||
|
<div class="tech-box cpp-box"><img src="logos/cpp.jpeg" alt="C++">C++</div>
|
||||||
|
<div class="tech-box csharp-box"><img src="logos/csharp.jpeg" alt="C#">C#</div>
|
||||||
|
<div class="tech-box python-box"><img src="logos/python.jpeg" alt="Python">Python</div>
|
||||||
|
<div class="tech-box bash-box"><img src="logos/bash.jpeg" alt="Bash">Bash</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section class="skills-section">
|
||||||
|
<h2>🌐 Développement Web</h2>
|
||||||
|
<div class="tech-icons">
|
||||||
|
<div class="tech-box html-box"><img src="logos/html.jpeg" alt="HTML">HTML</div>
|
||||||
|
<div class="tech-box css-box"><img src="logos/css.jpeg" alt="CSS">CSS</div>
|
||||||
|
<div class="tech-box js-box"><img src="logos/javascript.jpeg" alt="JavaScript">JavaScript</div>
|
||||||
|
<div class="tech-box react-box"><img src="logos/react.jpeg" alt="React">React</div>
|
||||||
|
|
||||||
|
<div class="tech-box php-box"><img src="logos/php.jpeg" alt="PHP">PHP</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section class="skills-section">
|
||||||
|
<h2>🛠️ Outils et Environnements</h2>
|
||||||
|
<div class="tech-icons">
|
||||||
|
<div class="tech-box linux-box"><img src="logos/linux.jpeg" alt="Linux">Linux</div>
|
||||||
|
<div class="tech-box git-box"><img src="logos/git.jpeg" alt="Git">Git</div>
|
||||||
|
<div class="tech-box docker-box"><img src="logos/docker.jpeg" alt="Docker">Docker</div>
|
||||||
|
<div class="tech-box vscode-box"><img src="logos/vscode.jpeg" alt="VS Code">VS Code</div>
|
||||||
|
<div class="tech-box postgresql-box"><img src="logos /postgresql.jpeg" alt="PostgreSQL">PostgreSQL</div>
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<footer class="site-footer">
|
||||||
|
<div class="footer-content">
|
||||||
|
<div class="footer-left">
|
||||||
|
<p>© 2025 Corentin Caillot. Tous droits réservés.</p>
|
||||||
|
</div>
|
||||||
|
<div class="footer-center">
|
||||||
|
<p>📩 Contactez-moi : <a href="mailto:contact@corentincaillot.com">contact@corentincaillot.com</a></p>
|
||||||
|
</div>
|
||||||
|
<div class="footer-right">
|
||||||
|
<a href="https://github.com/your-github" target="_blank" class="social-icon">
|
||||||
|
<img src="icons/github.png" alt="GitHub">
|
||||||
|
</a>
|
||||||
|
<a href="https://www.linkedin.com/in/your-linkedin" target="_blank" class="social-icon">
|
||||||
|
<img src="icons/linkedin.png" alt="LinkedIn">
|
||||||
|
</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</footer>
|
||||||
|
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
Before Width: | Height: | Size: 8.7 KiB |
|
After Width: | Height: | Size: 506 KiB |
|
After Width: | Height: | Size: 511 KiB |
|
After Width: | Height: | Size: 22 KiB |
|
After Width: | Height: | Size: 13 KiB |
|
After Width: | Height: | Size: 1.4 MiB |
|
After Width: | Height: | Size: 855 KiB |
|
After Width: | Height: | Size: 62 KiB |
|
After Width: | Height: | Size: 136 KiB |
|
Before Width: | Height: | Size: 8.7 KiB After Width: | Height: | Size: 96 KiB |
|
Before Width: | Height: | Size: 9.7 KiB After Width: | Height: | Size: 108 KiB |
|
After Width: | Height: | Size: 76 KiB |
|
After Width: | Height: | Size: 97 KiB |
|
Before Width: | Height: | Size: 3.4 KiB After Width: | Height: | Size: 50 KiB |
|
After Width: | Height: | Size: 90 KiB |
|
After Width: | Height: | Size: 79 KiB |
|
Before Width: | Height: | Size: 9.8 KiB After Width: | Height: | Size: 49 KiB |
|
After Width: | Height: | Size: 51 KiB |
|
After Width: | Height: | Size: 101 KiB |
|
After Width: | Height: | Size: 35 KiB |
|
After Width: | Height: | Size: 140 KiB |
|
After Width: | Height: | Size: 27 KiB |
|
After Width: | Height: | Size: 52 KiB |
|
Before Width: | Height: | Size: 8.2 KiB After Width: | Height: | Size: 61 KiB |
@ -1,72 +0,0 @@
|
|||||||
<!DOCTYPE html> <!-- Doctype HTML5 -->
|
|
||||||
<html lang="fr">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8">
|
|
||||||
<link type="text/css" rel="stylesheet" href="style.css">
|
|
||||||
<script src="toggle.js"></script>
|
|
||||||
<script src="effect.js" defer></script>
|
|
||||||
<title>Corentin</title>
|
|
||||||
<nav class="navbar">
|
|
||||||
<ul class="navbar-list">
|
|
||||||
<li><a href="index.html">Accueil</a></li>
|
|
||||||
<li><a href="cursus.html">Cursus</a></li>
|
|
||||||
<li><a href="planning.html">Planning</a></li>
|
|
||||||
<li class="dropdown">
|
|
||||||
<a href="#">Technique</a>
|
|
||||||
<ul class="dropdown-content">
|
|
||||||
<li><a href="images.html">Projets</a></li>
|
|
||||||
<li><a href="videos.html">Compétences</a></li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li><a href="form.html">Contact</a></li>
|
|
||||||
<label class="switch">
|
|
||||||
<input type="checkbox" id="theme-switch">
|
|
||||||
<span class="slider"></span>
|
|
||||||
</label>
|
|
||||||
</ul>
|
|
||||||
</nav>
|
|
||||||
</head>
|
|
||||||
<body id="planning">
|
|
||||||
<h1>PLANNING</h1>
|
|
||||||
<table>
|
|
||||||
<caption>Planning d'activités</caption>
|
|
||||||
<tr>
|
|
||||||
<th>Activités</th>
|
|
||||||
<th>Créneaux</th>
|
|
||||||
<th>Image</th>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td rowspan="2"><strong>Musculation</strong></td>
|
|
||||||
<td>Jeudi 15h-17h</td>
|
|
||||||
<td rowspan="2"><a href="img/musculation.jpg">
|
|
||||||
<img src="img/musculation.jpg" alt="muculation" height="150px" width="150px">
|
|
||||||
</a></td>
|
|
||||||
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>Samedi 8h-10h</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td rowspan="2"><strong>Révision</strong></td>
|
|
||||||
<td>Semaine 19h-21h</td>
|
|
||||||
<td rowspan="2"><a href="img/revision.gif"><img src="img/revision.gif" alt="revision" height="150px" width="150px"></a></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>week-end 12h-14h/16h-18h</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td rowspan="2"><strong>Jeux vidéos</strong></td>
|
|
||||||
<td>jeudi 17h30-19h</td>
|
|
||||||
<td rowspan="2"><a href="img/jeuxVideo.jpeg"><img src="img/jeuxVideo.jpeg" alt="jeux vidéo"height="150px" width="150px"></a></td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td>weekend 8h-10h/18h-00h</td>
|
|
||||||
</tr>
|
|
||||||
|
|
||||||
</table>
|
|
||||||
</header>
|
|
||||||
</body>
|
|
||||||
<footer>
|
|
||||||
<p>Pied de page</p>
|
|
||||||
</footer>
|
|
||||||
</html>
|
|
||||||
@ -1,67 +1,181 @@
|
|||||||
document.addEventListener("DOMContentLoaded", function () {
|
document.addEventListener("DOMContentLoaded", function () {
|
||||||
// Get project name from URL
|
// Get project name from URL
|
||||||
const urlParams = new URLSearchParams(window.location.search);
|
const urlParams = new URLSearchParams(window.location.search);
|
||||||
const projectName = urlParams.get("name");
|
const projectName = urlParams.get("name");
|
||||||
|
|
||||||
// Simulated "database" of projects
|
// Simulated "database" of projects
|
||||||
const projects = {
|
const projects = {
|
||||||
"mastermind": {
|
"mastermind": {
|
||||||
title: "Projet MasterMind",
|
title: "Projet MasterMind",
|
||||||
subtitle: "Un projet de création du jeux MasterMind.",
|
subtitle: "Un projet de création du jeu MasterMind.",
|
||||||
description: "Le but de ce projet était de réaliser par groupe de 4 personnes sur une durée de 3 mois un jeu de MasterMind en .net Maui.",
|
description: "Le but de ce projet était de réaliser par groupe de 4 personnes sur une durée de 3 mois un jeu de MasterMind en .net Maui.",
|
||||||
images: ["img/project/scolaire/mastermind_menu.png", "img/project/scolaire/mastermind_game.png", "img/project/scolaire/mastermind_login.png"],
|
images: [
|
||||||
technologies: ["csharp", "xaml", "json"]
|
{
|
||||||
},
|
src: "img/project/scolaire/mastermind_menu.png",
|
||||||
"etugestion": {
|
description: "Menu principal du jeu. Les joueurs peuvent consulter les meilleurs scores, lire les règles et lancer une partie."
|
||||||
title: "EtuGestion",
|
},
|
||||||
subtitle: "Création d'un outil de gestion en ligne de commande pour une école.",
|
{
|
||||||
description: "Ce projet réalisé en C par groupe de 2 à l'aide de l'outil git nécecitait d'avoir différentes interfaces pour des élèves, des professeurs et des jury. Les jurys devais pouvoir mettre des notes aux étudiants, les étudiants devaient pouvoir consulter et postuler à des offres de stages et enfin les professeurs devaient pouvoir ajouter et supprimer des offres de stages, affecter des étudiants...etc",
|
src: "img/project/scolaire/mastermind_game.png",
|
||||||
images: ["img/project/scolaire/brico_menu.png", "img/project/scolaire/brico_add.png", "img/project/scolaire/brico_list.png"],
|
description: "Plateau de jeux durant une partie. Les joueurs jouent en cliquant sur les cercles de couleurs afin de les placer sur le plateau."
|
||||||
technologies: ["c", "git"]
|
},
|
||||||
}
|
{
|
||||||
};
|
src: "img/project/scolaire/mastermind_login.png",
|
||||||
|
description: "Écran de début de partie. Les joueurs peuvent choisir leurs pseudo ainsi que la difficulté. La difficulté influe sur le nombre de couleurs et d'essaies."
|
||||||
|
}
|
||||||
|
],
|
||||||
|
technologies: ["csharp", "xaml", "json"]
|
||||||
|
}, // ✅ Fixed comma placement
|
||||||
|
|
||||||
// Get project data or fallback
|
"etugestion": { // ✅ Removed incorrect semicolon before this key
|
||||||
const project = projects[projectName] || {
|
title: "EtuGestion",
|
||||||
title: "Projet Inconnu",
|
subtitle: "Création d'un outil de gestion en ligne de commande pour une école.",
|
||||||
subtitle: "Désolé, ce projet n'existe pas.",
|
description: "Ce projet réalisé en C par groupe de 2 à l'aide de l'outil git nécessitait d'avoir différentes interfaces pour des élèves, des professeurs et des jury...",
|
||||||
description: "Nous n'avons pas trouvé d'informations sur ce projet.",
|
images: [
|
||||||
images: [],
|
{
|
||||||
technologies: []
|
src: "img/project/scolaire/brico_menu.png",
|
||||||
};
|
description: "Menu principal de l'outil."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
src: "img/project/scolaire/brico_add.png",
|
||||||
|
description: "Écran de connexion permettant à l'utilisateur d'accéder à ses scores enregistrés."
|
||||||
|
}, // ✅ Added missing comma here
|
||||||
|
{
|
||||||
|
src: "img/project/scolaire/brico_list.png",
|
||||||
|
description: "Écran permettant d'ajouter de nouveaux éléments à la base de données."
|
||||||
|
}
|
||||||
|
],
|
||||||
|
technologies: ["c", "git"]
|
||||||
|
},
|
||||||
|
|
||||||
// Update HTML content
|
"linux_install": {
|
||||||
document.getElementById("project-title").innerText = project.title;
|
title: "Linux et shell",
|
||||||
document.getElementById("project-subtitle").innerText = project.subtitle;
|
subtitle: "Installation d'une distribution Linux et création de scripts shell.",
|
||||||
document.getElementById("project-description").innerText = project.description;
|
description: `Dans le cadre de ma première année de BUT informatique, j'ai été amené à
|
||||||
|
installer une distribution Linux (Arch Linux) qui est rapidement devenue mon outil de travail principal.`,
|
||||||
|
images: [
|
||||||
|
{
|
||||||
|
src: "img/project/scolaire/arch_main.png",
|
||||||
|
description: "Écran principal après installation d'Arch Linux."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
src: "img/project/scolaire/arch_script1.png",
|
||||||
|
description: "Exemple de script shell automatisant une tâche quotidienne."
|
||||||
|
}
|
||||||
|
],
|
||||||
|
technologies: ["bash"]
|
||||||
|
},
|
||||||
|
"monster_battle": {
|
||||||
|
title: "Monster Battle",
|
||||||
|
subtitle: "Un projet de création du jeu MasterMind.",
|
||||||
|
description: "Le but de ce projet était de réaliser par groupe de 4 personnes sur une durée de 3 mois un jeu de MasterMind en .net Maui.",
|
||||||
|
images: [
|
||||||
|
{
|
||||||
|
src: "img/project/perso/monsterBattle_logo.png",
|
||||||
|
description: "Menu principal du jeu. Les joueurs peuvent consulter les meilleurs scores, lire les règles et lancer une partie."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
src: "img/project/perso/monsterBattle_menu.png",
|
||||||
|
description: "Plateau de jeux durant une partie. Les joueurs jouent en cliquant sur les cercles de couleurs afin de les placer sur le plateau."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
src: "img/project/perso/monsterBattle_main.png",
|
||||||
|
description: "Écran de début de partie. Les joueurs peuvent choisir leurs pseudo ainsi que la difficulté. La difficulté influe sur le nombre de couleurs et d'essaies."
|
||||||
|
}
|
||||||
|
],
|
||||||
|
technologies: ["python", "tkinter"]
|
||||||
|
}, // ✅ Fixed comma placement
|
||||||
|
|
||||||
// Update gallery
|
"etugestion": { // ✅ Removed incorrect semicolon before this key
|
||||||
const galleryContainer = document.getElementById("project-gallery");
|
title: "EtuGestion",
|
||||||
project.images.forEach(imgSrc => {
|
subtitle: "Création d'un outil de gestion en ligne de commande pour une école.",
|
||||||
const img = document.createElement("img");
|
description: "Ce projet réalisé en C par groupe de 2 à l'aide de l'outil git nécessitait d'avoir différentes interfaces pour des élèves, des professeurs et des jury...",
|
||||||
img.src = imgSrc;
|
images: [
|
||||||
img.alt = "Image du projet";
|
{
|
||||||
galleryContainer.appendChild(img);
|
src: "img/project/scolaire/brico_menu.png",
|
||||||
});
|
description: "Menu principal de l'outil."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
src: "img/project/scolaire/brico_add.png",
|
||||||
|
description: "Écran de connexion permettant à l'utilisateur d'accéder à ses scores enregistrés."
|
||||||
|
}, // ✅ Added missing comma here
|
||||||
|
{
|
||||||
|
src: "img/project/scolaire/brico_list.png",
|
||||||
|
description: "Écran permettant d'ajouter de nouveaux éléments à la base de données."
|
||||||
|
}
|
||||||
|
],
|
||||||
|
technologies: ["c", "git"]
|
||||||
|
},
|
||||||
|
|
||||||
|
"linux_install": {
|
||||||
|
title: "Linux et shell",
|
||||||
|
subtitle: "Installation d'une distribution Linux et création de scripts shell.",
|
||||||
|
description: `Dans le cadre de ma première année de BUT informatique, j'ai été amené à
|
||||||
|
installer une distribution Linux (Arch Linux) qui est rapidement devenue mon outil de travail principal.`,
|
||||||
|
images: [
|
||||||
|
{
|
||||||
|
src: "img/project/scolaire/arch_main.png",
|
||||||
|
description: "Écran principal après installation d'Arch Linux."
|
||||||
|
},
|
||||||
|
{
|
||||||
|
src: "img/project/scolaire/arch_script1.png",
|
||||||
|
description: "Exemple de script shell automatisant une tâche quotidienne."
|
||||||
|
}
|
||||||
|
],
|
||||||
|
technologies: ["bash"]
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
// Get project data or fallback
|
||||||
|
const project = projects[projectName] || {
|
||||||
|
title: "Projet Inconnu",
|
||||||
|
subtitle: "Désolé, ce projet n'existe pas.",
|
||||||
|
description: "Nous n'avons pas trouvé d'informations sur ce projet.",
|
||||||
|
images: [],
|
||||||
|
technologies: []
|
||||||
|
};
|
||||||
|
|
||||||
|
// Update HTML content
|
||||||
|
document.getElementById("project-title").innerText = project.title;
|
||||||
|
document.getElementById("project-subtitle").innerText = project.subtitle;
|
||||||
|
document.getElementById("project-description").innerText = project.description;
|
||||||
|
|
||||||
|
const galleryContainer = document.getElementById("project-gallery");
|
||||||
|
|
||||||
|
project.images.forEach((imgObj, index) => {
|
||||||
|
const wrapper = document.createElement("div");
|
||||||
|
wrapper.classList.add("image-wrapper");
|
||||||
|
|
||||||
|
const img = document.createElement("img");
|
||||||
|
img.src = imgObj.src;
|
||||||
|
img.alt = `Image ${index + 1}`;
|
||||||
|
|
||||||
|
const desc = document.createElement("div");
|
||||||
|
desc.classList.add("image-description");
|
||||||
|
desc.innerText = imgObj.description; // Custom description here
|
||||||
|
|
||||||
|
wrapper.appendChild(img);
|
||||||
|
wrapper.appendChild(desc);
|
||||||
|
galleryContainer.appendChild(wrapper);
|
||||||
|
});
|
||||||
|
|
||||||
// Update technologies
|
// Update technologies
|
||||||
const techContainer = document.getElementById("project-tech-icons");
|
const techContainer = document.getElementById("project-tech-icons");
|
||||||
project.technologies.forEach(tech => {
|
project.technologies.forEach(tech => {
|
||||||
const div = document.createElement("div");
|
const div = document.createElement("div");
|
||||||
div.classList.add("tech-box", `${tech}-box`); // Ensure the correct class is added
|
div.classList.add("tech-box", `${tech}-box`); // Ensure the correct class is added
|
||||||
|
|
||||||
const img = document.createElement("img");
|
const img = document.createElement("img");
|
||||||
img.src = `logos/${tech}.jpeg`;
|
img.src = `logos/${tech}.jpeg`;
|
||||||
img.alt = tech.toUpperCase();
|
img.alt = tech.toUpperCase();
|
||||||
|
|
||||||
|
const text = document.createElement("span");
|
||||||
|
text.innerText = tech.toUpperCase();
|
||||||
|
|
||||||
const text = document.createElement("span");
|
div.appendChild(img);
|
||||||
text.innerText = tech.toUpperCase();
|
div.appendChild(text);
|
||||||
|
techContainer.appendChild(div);
|
||||||
|
});
|
||||||
|
|
||||||
div.appendChild(img);
|
// Fade-in effect when page loads
|
||||||
div.appendChild(text);
|
document.body.classList.remove("fade-out");
|
||||||
techContainer.appendChild(div);
|
|
||||||
});
|
});
|
||||||
// Fade-in effect when page loads
|
|
||||||
document.body.classList.remove("fade-out");
|
|
||||||
});
|
|
||||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
@ -1,139 +0,0 @@
|
|||||||
<!DOCTYPE html>
|
|
||||||
<!-- Doctype HTML5 -->
|
|
||||||
<html lang="fr">
|
|
||||||
<head>
|
|
||||||
<meta charset="UTF-8" />
|
|
||||||
<link type="text/css" rel="stylesheet" href="style.css" />
|
|
||||||
<script src="toggle.js"></script>
|
|
||||||
<script src="effect.js" defer></script>s
|
|
||||||
<title>Corentin</title>
|
|
||||||
<nav class="navbar">
|
|
||||||
<ul class="navbar-list">
|
|
||||||
<li><a href="index.html">Accueil</a></li>
|
|
||||||
<li><a href="cursus.html">Cursus</a></li>
|
|
||||||
<li><a href="planning.html">Planning</a></li>
|
|
||||||
<li class="dropdown">
|
|
||||||
<a href="#">Gallerie</a>
|
|
||||||
<ul class="dropdown-content">
|
|
||||||
<li><a href="images.html">Images</a></li>
|
|
||||||
<li><a href="videos.html">Vidéos</a></li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li><a href="form.php">Form</a></li>
|
|
||||||
</ul>
|
|
||||||
</nav>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<h1 id="video_categorie">Galerie Video</h1>
|
|
||||||
<h3 class="title_gallery">Rocket league</h3>
|
|
||||||
<div class="gallery_video">
|
|
||||||
<figure>
|
|
||||||
<div class="video-item">
|
|
||||||
<video
|
|
||||||
src="video/reset_bounce.mp4"
|
|
||||||
type="video/mp4"
|
|
||||||
controls
|
|
||||||
muted
|
|
||||||
></video>
|
|
||||||
</div>
|
|
||||||
<figcaption>Double reset bounce shot</figcaption>
|
|
||||||
</figure>
|
|
||||||
<figure>
|
|
||||||
<div class="video-item">
|
|
||||||
<video
|
|
||||||
src="video/double_reset_double.mp4"
|
|
||||||
type="video/mp4"
|
|
||||||
controls
|
|
||||||
muted
|
|
||||||
></video>
|
|
||||||
</div>
|
|
||||||
<figcaption>Double reset double tap</figcaption>
|
|
||||||
</figure>
|
|
||||||
<figure>
|
|
||||||
<div class="video-item">
|
|
||||||
<video
|
|
||||||
src="video/double_tap_angle.mp4"
|
|
||||||
type="video/mp4"
|
|
||||||
controls
|
|
||||||
muted
|
|
||||||
></video>
|
|
||||||
</div>
|
|
||||||
<figcaption>Double tap</figcaption>
|
|
||||||
</figure>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<h3 class="title_gallery">Valorant</h3>
|
|
||||||
<div class="gallery_video">
|
|
||||||
<figure>
|
|
||||||
<div class="video-item">
|
|
||||||
<video
|
|
||||||
src="video/4k breeze.mp4"
|
|
||||||
type="video/mp4"
|
|
||||||
controls
|
|
||||||
muted
|
|
||||||
></video>
|
|
||||||
</div>
|
|
||||||
<figcaption>4k (asc 2)</figcaption>
|
|
||||||
</figure>
|
|
||||||
<figure>
|
|
||||||
<div class="video-item">
|
|
||||||
<video
|
|
||||||
src="video/one tap jett asc.mp4"
|
|
||||||
type="video/mp4"
|
|
||||||
controls
|
|
||||||
muted
|
|
||||||
></video>
|
|
||||||
</div>
|
|
||||||
<figcaption>One tap (asc3)</figcaption>
|
|
||||||
</figure>
|
|
||||||
<figure>
|
|
||||||
<div class="video-item">
|
|
||||||
<video
|
|
||||||
src="video/4k_lotus_clutch.mp4"
|
|
||||||
type="video/mp4"
|
|
||||||
controls
|
|
||||||
muted
|
|
||||||
></video>
|
|
||||||
</div>
|
|
||||||
<figcaption>4k clutch (dia 3)</figcaption>
|
|
||||||
</figure>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<h3 class="title_gallery">Mes Teammates</h3>
|
|
||||||
<div class="gallery_video">
|
|
||||||
<figure>
|
|
||||||
<div class="video-item">
|
|
||||||
<video
|
|
||||||
src="video/Tristan_wsh.mp4"
|
|
||||||
type="video/mp4"
|
|
||||||
controls
|
|
||||||
muted
|
|
||||||
></video>
|
|
||||||
</div>
|
|
||||||
<figcaption>Rank du joueur : (immo 2)</figcaption>
|
|
||||||
</figure>
|
|
||||||
<figure>
|
|
||||||
<div class="video-item">
|
|
||||||
<video
|
|
||||||
src="video/Rae_wtf.mp4"
|
|
||||||
type="video/mp4"
|
|
||||||
controls
|
|
||||||
muted
|
|
||||||
></video>
|
|
||||||
</div>
|
|
||||||
<figcaption>Rank du joueur : (dia 3)</figcaption>
|
|
||||||
</figure>
|
|
||||||
<figure>
|
|
||||||
<div class="video-item">
|
|
||||||
<video controls muted>
|
|
||||||
<source src="video/Skye_wtf.mp4" type="video/mp4" />
|
|
||||||
<source src="video/Skye_wtf.ogg" type="video/ogg" />
|
|
||||||
<source src="video/Skye_wtf.webm" type="video/webm" />
|
|
||||||
Video format not supported !
|
|
||||||
</video>
|
|
||||||
</div>
|
|
||||||
<figcaption>Rank du joueur : (asc 2)</figcaption>
|
|
||||||
</figure>
|
|
||||||
</div>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
Loading…
Reference in new issue