navigation fonctionnelle
continuous-integration/drone/push Build is failing Details

master
Hugo PRADIER 11 months ago
parent c1ae190ee6
commit 1223373053

@ -3,6 +3,7 @@
<html lang="fr"> <html lang="fr">
<head> <head>
<meta charset="UTF-8" /> <meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Portfolio PRADIER Hugo</title> <title>Portfolio PRADIER Hugo</title>
@ -13,37 +14,98 @@
integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH"
crossorigin="anonymous" crossorigin="anonymous"
/> />
<!-- Font Awesome -->
<script
src="https://kit.fontawesome.com/14273d579a.js"
crossorigin="anonymous"
></script>
<!-- Icon Bootstrap -->
<link
rel="stylesheet"
href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.5.0/font/bootstrap-icons.css"
/>
</head> </head>
<body> <body>
<header> <!-- Barre de navigation -->
<!-- Barre de navigation --> <header class="py-4">
<nav class="bg-light"> <nav class="navbar navbar-expand-md fixed-top navbar-light bg-light">
<div class="container"> <div class="container">
<div class="bg-secondary py-4"></div> <a class="navbar-brand text-uppercase fw-bold" href="#">
<span class="bg-secondary bg-gradient p-1 rounded-3 text-light"
>Hugo</span
>
PRADIER
</a>
<button
class="navbar-toggler"
type="button"
data-bs-toggle="collapse"
data-bs-target="#navbarNav"
aria-controls="navbarNav"
aria-expanded="false"
aria-label="Toggle navigation"
>
<span class="navbar-toggler-icon"></span>
</button>
<div
class="collapse navbar-collapse justify-content-end"
id="navbarNav"
>
<ul class="navbar-nav">
<li class="nav-item">
<a class="nav-link" href="#accueil">Accueil </a>
</li>
<li class="nav-item">
<a class="nav-link" href="#apropos">À propos de moi</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#experiences">Expériences</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#parcours">Parcours</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#competences">Compétences</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#projets">Projets</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#contact">Contact</a>
</li>
</ul>
</div>
</div> </div>
</nav> </nav>
</header> </header>
<main> <main>
<!-- Accueil --> <!-- Accueil -->
<section class="my-5"> <section id="accueil" class="my-5">
<div class="container"> <div class="container">
<div class="row"> <div class="row gy-4 align-items-center">
<div class="col"> <div class="col-12 col-md-6">
<h1>Je suis Hugo PRADIER, Alternant Développeur</h1> <h1 class="fw-bold">
<h2>Bienvenue sur mon portfolio</h2> Je suis Hugo PRADIER, <br />
Alternant Développeur
</h1>
<h2 class="fw-light">Bienvenue sur mon portfolio !</h2>
<button <button
class="btn btn-secondary mt-5"
onclick="window.open('./assets/pdf/CV PRADIER Hugo.pdf', '_blank')" onclick="window.open('./assets/pdf/CV PRADIER Hugo.pdf', '_blank')"
> >
Télécharger mon CV Télécharger mon CV
</button> </button>
</div> </div>
<div class="col"> <div class="col-12 col-md-6">
<img <img
src="./assets/images/photoIdentite.jpg" src="./assets/images/photoIdentite.jpg"
alt="Photo de Hugo PRADIER" alt="Photo de Hugo PRADIER"
class="w-100" width="95%"
class="rounded-3 shadow"
/> />
</div> </div>
</div> </div>
@ -51,7 +113,7 @@
</section> </section>
<!-- À propos de moi --> <!-- À propos de moi -->
<section class="py-5"> <section id="apropos" class="py-5 bg-light">
<div class="container"> <div class="container">
<div class="row"> <div class="row">
<div class="col"> <div class="col">
@ -79,10 +141,10 @@
</div> </div>
</section> </section>
<!-- Mon parcours --> <!-- Experiences -->
<section class="py-5"> <section id="experiences" class="py-5">
<div class="container"> <div class="container">
<h2>Mon parcours</h2> <h2>Experiences</h2>
<div class="row gy-4 mt-4"> <div class="row gy-4 mt-4">
<div class="col-3"> <div class="col-3">
<div class="bg-secondary h-100 w-100 py-5"></div> <div class="bg-secondary h-100 w-100 py-5"></div>
@ -100,10 +162,10 @@
</div> </div>
</section> </section>
<!-- Mes expériences professionnelles --> <!-- Parcours -->
<section class="py-5"> <section id="parcours" class="py-5">
<div class="container"> <div class="container">
<h2>Mes expériences professionnelles</h2> <h2>Parcours</h2>
<div class="row gy-4 mt-4"> <div class="row gy-4 mt-4">
<div class="col-3"> <div class="col-3">
<div class="bg-secondary h-100 w-100 py-5"></div> <div class="bg-secondary h-100 w-100 py-5"></div>
@ -121,46 +183,44 @@
</div> </div>
</section> </section>
<!-- Mes compétences --> <!-- Compétences -->
<section class="py-5 bg-light"> <section id="competences" class="py-5 bg-light">
<div class="container"> <div class="container">
<h2>Mes compétences</h2> <h2>Compétences</h2>
<h3>Développement web et design</h3>
<!-- Developpement --> <!-- Developpement -->
<div class="row gy-4 mt-5"> <h3>Développement</h3>
<div class="col-12 col-md-7"> <div class="col-12">
<div class="bg-secondary h-100 w-100 py-5"></div> <div class="bg-secondary h-100 w-100 py-5"></div>
</div>
<div class="col-12 offset-md-1 col-md-4">
<img
src="./assets/images/ecranCode.jpg"
alt="Écran montrant du code"
width="100%"
/>
</div>
</div> </div>
<!-- Design --> <!-- Gestion de projet et collaboration -->
<div class="row gy-4 mt-5"> <h3>Gestion de projet et collaboration</h3>
<div class="col-12 col-md-4"> <div class="col-12">
<img <div class="bg-secondary h-100 w-100 py-5"></div>
src="./assets/images/maquetteSite.png" </div>
alt="Écran montrant une maquette de site web"
width="100%" <!-- Gestion de projet et collaboration -->
/> <h3>Gestion de projet et collaboration</h3>
</div> <div class="col-12">
<div class="col-12 offset-md-1 col-md-7"> <div class="bg-secondary h-100 w-100 py-5"></div>
<div class="bg-secondary h-100 w-100 py-5"></div> </div>
</div>
<!-- Outils -->
<h3>Outils</h3>
<div class="col-12">
<div class="bg-secondary h-100 w-100 py-5">
</div> </div>
</div> </div>
</section> </section>
<!-- Mes projets --> <!-- Projets -->
<section class="py-5"> <section id="projets" class="py-5">
<div class="container"> <div class="container">
<h2>Mes projets</h2> <h2>Projets</h2>
<h3>Projets scolaire et en entreprise</h3>
<div class="row gy-4 mt-4"> <div class="row gy-4 mt-4">
<div class="col-3"> <div class="col-3">
<div class="bg-secondary h-100 w-100 py-5"></div> <div class="bg-secondary h-100 w-100 py-5"></div>
@ -179,19 +239,15 @@
</section> </section>
<!-- Contact --> <!-- Contact -->
<section class="py-5 bg-light"> <section id="contact" class="py-5 bg-light">
<div class="container"> <div class="container">
<h2>Formulaire de contact</h2> <h2>Contact</h2>
<div class="row gy-4 mt-5"> <div class="row gy-4 mt-5">
<div class="col-12 col-md-5"> <div class="col-6">
<img <div class="bg-secondary h-100 w-100 py-5"></div>
src="./assets/images/contact.jpg"
alt="Image d'une touche de clavier pour contacter"
width="100%"
/>
</div> </div>
<div class="col-12 offset-md-1 col-md-6"> <div class="col-6">
<div class="bg-secondary h-100 w-100 py-5"></div> <div class="bg-secondary h-100 w-100 py-5"></div>
</div> </div>
</div> </div>
@ -210,7 +266,16 @@
<div class="bg-secondary py-5"></div> <div class="bg-secondary py-5"></div>
</div> </div>
<div class="col-12 col-md-4"> <div class="col-12 col-md-4">
<div class="bg-secondary py-5"></div> <div>
<ul class="list-inline text-center">
<li class="list-inline-item">
<i class="bi bi-linkedin fa-5x"></i>
</li>
<li class="list-inline-item">
<i class="bi bi-github fa-5x"></i>
</li>
</ul>
</div>
</div> </div>
</div> </div>
</div> </div>

Loading…
Cancel
Save