💄 update design
continuous-integration/drone/push Build is passing
Details
continuous-integration/drone/push Build is passing
Details
Destroyeur6315
12 months ago
parent
61bf6c9288
commit
a4cbca6fee
@ -1,388 +1,240 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Mon portfolio</title>
|
||||
<link rel="stylesheet" href="style.css">
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Mon portfolio</title>
|
||||
|
||||
<!-- Link CSS -->
|
||||
<link rel="stylesheet" href="style.css">
|
||||
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div class="scroll-up-btn">
|
||||
<i class="fas fa-angle-up"></i>
|
||||
|
||||
<!-- Button scroll -->
|
||||
<div class="scroll-up-btn">
|
||||
<i class="fas fa-angle-up"></i>
|
||||
</div>
|
||||
|
||||
<!-- Header -->
|
||||
<nav class="navbar">
|
||||
<div class="max-width">
|
||||
<div class="logo"><a href="#"><span>romain-fillot.fr</span><span></span></a></div>
|
||||
<ul class="menu">
|
||||
<li><a href="#home" class="menu-btn"><strong>Accueil</strong></a></li>
|
||||
<li><a href="#about" class="menu-btn"><strong>A propos</strong></a></li>
|
||||
<li><a href="#services" class="menu-btn"><strong>Expériences</strong></a></li>
|
||||
<li><a href="#contact" class="menu-btn"><strong>Contact</strong></a></li>
|
||||
</ul>
|
||||
<div class="menu-btn">
|
||||
<i class="fas fa-bars"></i>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Header -->
|
||||
<nav class="navbar">
|
||||
<div class="max-width">
|
||||
<div class="logo"><a href="#"><span>romain-fillot.fr</span><span></span></a></div>
|
||||
<ul class="menu">
|
||||
<li><a href="#home" class="menu-btn"><strong>Accueil</strong></a></li>
|
||||
<li><a href="#about" class="menu-btn"><strong>A propos</strong></a></li>
|
||||
<li><a href="#services" class="menu-btn"><strong>Expériences</strong></a></li>
|
||||
<li><a href="#contact" class="menu-btn"><strong>Contact</strong></a></li>
|
||||
</ul>
|
||||
<div class="menu-btn">
|
||||
<i class="fas fa-bars"></i>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<!-- Home -->
|
||||
<section class="home" id="home">
|
||||
<div class="max-width">
|
||||
<div class="home-content">
|
||||
<div class="text-1">Bonjour, Je m'appelle</div>
|
||||
<div class="text-2">Fillot Romain</div>
|
||||
<div class="text-3">Et je suis alternant en informatique <span class="typing"></span></div>
|
||||
<a href="#about">A propos de moi</a>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<!-- Home -->
|
||||
<section class="home" id="home">
|
||||
<div class="max-width">
|
||||
<div class="home-content">
|
||||
<div class="text-1">Bonjour, Je m'appelle</div>
|
||||
<div class="text-2">Fillot Romain</div>
|
||||
<div class="text-3">Et je suis alternant en informatique <span class="typing"></span></div>
|
||||
<a href="#about">A propos de moi</a>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- About -->
|
||||
<section class="about" id="about">
|
||||
<div class="max-width">
|
||||
<h2 class="title">A propos de moi</h2>
|
||||
<div class="about-content">
|
||||
<div class="column left">
|
||||
<img src="./images/picture-profil_2.jpg" alt="Profile Image">
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- About -->
|
||||
<section class="about" id="about">
|
||||
<div class="max-width">
|
||||
<h2 class="title">A propos de moi</h2>
|
||||
<div class="about-content">
|
||||
<div class="column left">
|
||||
<img src="./images/picture-profil_2.jpg" alt="Profile Image 626x626">
|
||||
</div>
|
||||
<div class="column right">
|
||||
<div class="text">Moi c'est Romain <span class="typing-2"></span></div>
|
||||
<p>
|
||||
Passionné d'informatique, j'ai découvert ce domaine lors de ma première année de lycée,
|
||||
en seconde. En effet, j'ai opté pour l'option ICN qui m'a permis de faire mon premier
|
||||
pas dans ce monde fabuleux. J'ai pu y découvrir les bases du fonctionnement d'un ordinateur
|
||||
ainsi que le langage python.
|
||||
<br><br>
|
||||
J'ai beaucoup apprécié cette option, qui m'est apparue dans un premier temps très
|
||||
obscure et compliquée. Néanmoins, cela n'a pas suffi pour me décourager étant donné
|
||||
que je suis en 3e année d'IUT informatique. Bien entendu, je ne m'arrête pas en si bon chemin. L'année prochaine, c'est parti pour deux ans supplémentaires en
|
||||
Mastère informatique à l'école Hexagone. Cette fois-ci, je me spécialise un peu en me
|
||||
tournant vers la filière "Architecture des Systèmes d'information".
|
||||
<br><br>
|
||||
Pendant mon temps libre je ne fais pas que de l'informatique. J'aime beaucoup le sport
|
||||
(pratiquant de musculation depuis presque 6 ans), je sors souvent avec mes ami(e)s et
|
||||
je m'intéresse depuis peu à deux nouveaux domaines qui me passionnent : les
|
||||
cryptomonnaies avec tout ce qui se cache derrière (NFT, blockchain, DeFi...) et les
|
||||
voitures (vieilles voitures, mécanique...).
|
||||
</p>
|
||||
<br>
|
||||
<a href="CV-RomainFillot.pdf" target="blank" download>Télécharger CV</a>
|
||||
</div>
|
||||
<div class="column right">
|
||||
<div class="text">Moi c'est Romain <span class="typing-2"></span></div>
|
||||
<p>
|
||||
Passionné d'informatique, j'ai découvert ce domaine lors de ma première année de lycée,
|
||||
en seconde. En effet, j'ai opté pour l'option ICN qui m'a permis de faire mon premier
|
||||
pas dans ce monde fabuleux. J'ai pu y découvrir les bases du fonctionnement d'un ordinateur
|
||||
ainsi que le langage python.
|
||||
<br><br>
|
||||
J'ai beaucoup apprécié cette option, qui m'est apparue dans un premier temps très
|
||||
obscure et compliquée. Néanmoins, cela n'a pas suffi pour me décourager étant donné
|
||||
que je suis en 3e année d'IUT informatique. Bien entendu, je ne m'arrête pas en si bon chemin. L'année
|
||||
prochaine, c'est parti pour deux ans supplémentaires en
|
||||
Mastère informatique à l'école Hexagone. Cette fois-ci, je me spécialise un peu en me
|
||||
tournant vers la filière "Architecture des Systèmes d'information".
|
||||
<br><br>
|
||||
Pendant mon temps libre je ne fais pas que de l'informatique. J'aime beaucoup le sport
|
||||
(pratiquant de musculation depuis presque 6 ans), je sors souvent avec mes ami(e)s et
|
||||
je m'intéresse depuis peu à deux nouveaux domaines qui me passionnent : les
|
||||
cryptomonnaies avec tout ce qui se cache derrière (NFT, blockchain, DeFi...) et les
|
||||
voitures (vieilles voitures, mécanique...).
|
||||
</p>
|
||||
<br>
|
||||
<a href="CV-RomainFillot.pdf" target="blank" download>Télécharger CV</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Services -->
|
||||
<section class="services" id="services">
|
||||
<div class="max-width">
|
||||
<h2 class="title">Mes expériences</h2>
|
||||
<!-- <div class="serv-content"> -->
|
||||
<div class="carousel-container">
|
||||
<div class="carousel-slide active" id="slide-1">
|
||||
<h2>Stage au Canada</h2>
|
||||
<div class="carousel-container-img">
|
||||
<div class="carousel-img">
|
||||
<img src="./images/UQAC.png" style="width: 100%; border-radius: 15px;">
|
||||
</div>
|
||||
<div class="carousel-text">
|
||||
J'ai réalisé mon premiers stage au canada
|
||||
à l'UQAC d'une durée de 2 mois. Ce projet consistait en la reconnaissance de geste
|
||||
de cuisine à l'aide d'un bracelet polar et d'un modèle d'apprentissage.
|
||||
<br><br>
|
||||
Je l'ai réalisé
|
||||
avec un camarade de l'iut. J'ai énormément apprécié ce projet car j'ai été confronté à
|
||||
des problèmes réels liés à la qualité des données, à leur traitement et à
|
||||
leur interprétation, ce qui explique l'utilisation du langage Python ainsi que
|
||||
de la bibliothèque auto_sklearn. Ce stage m'a fait découvrir une véritable passion pour
|
||||
l'analyse et la gestion des données, ainsi que pour l'intelligence artificielle avec
|
||||
l'apprentissage automatique.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="carousel-slide" id="slide-2">
|
||||
<h2>Alternance chez Matussière Toiles</h2>
|
||||
<div class="carousel-container-img">
|
||||
<div class="carousel-img">
|
||||
<img src="./images/store-toile.png" style="width: 100%; border-radius: 15px;">
|
||||
</div>
|
||||
<div class="carousel-text">
|
||||
Ma deuxième expérience, plus professionnalisante est ma 3 ème année d'IUT
|
||||
informatique que je réalise actuellement en alternance chez Matussière-toiles. Cette
|
||||
entreprise est spécialisée dans la production et la distribution de protection solaire extérieure.
|
||||
Pour vendre leur produit, ils utilisent un site internet.
|
||||
<br><br>
|
||||
Ma mission d'alternance consiste en la refonte du site web car il n'est plus au goût du jour et ne
|
||||
peut se positionner face à la concurrence. Pour mener à bien ce projet, j'utilise
|
||||
les langages tels que PHP, JavaScript et HTML/CSS. Etant seul à piloter le projet,
|
||||
je dois faire preuve d'autonomie et de sérieux.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="carousel-slide" id="slide-3">
|
||||
<h2>Vendeur chez E.Leclerc</h2>
|
||||
<div class="carousel-container-img">
|
||||
<div class="carousel-img">
|
||||
<img src="./images/leclerc.png" style="width: 100%; border-radius: 15px;">
|
||||
</div>
|
||||
<div class="carousel-text">
|
||||
J'ai eu l'occasion de travailler plusieurs fois chez E. Leclerc en tant
|
||||
que vendeur. Mon premier emploi remonte à 2022, où j'ai passé un mois au
|
||||
rayon traiteur. Cette expérience a été extrêmement enrichissante, notamment
|
||||
en termes de communication et d'autonomie. Dès la première semaine, j'ai dû
|
||||
gérer le stand seul pendant plusieurs heures. Il était également nécessaire
|
||||
d'être attentif aux besoins des clients pour leur offrir le meilleur service.
|
||||
<br><br>
|
||||
Ma deuxième expérience a eu lieu à la fin de 2023, pendant la période de Noël,
|
||||
où j'ai alterné entre le rayon de la poissonnerie et celui de la saurisserie.
|
||||
J'ai dû m'adapter rapidement et démontrer ma capacité
|
||||
à agir de manière autonome.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="carousel-buttons">
|
||||
<button onclick="showSlide(1)">1</button>
|
||||
<button onclick="showSlide(2)">2</button>
|
||||
<button onclick="showSlide(3)">3</button>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Skills -->
|
||||
<!-- <section class="skills" id="skills">
|
||||
<div class="max-width">
|
||||
<h2 class="title">My Skills</h2>
|
||||
<div class="skills-content">
|
||||
<div class="column left">
|
||||
|
||||
<div class="text">INTERNSHIP</div>
|
||||
<p>
|
||||
<li class="intern">contentstack</li>
|
||||
<li class="intern">Pensil- as a test analyst</li>
|
||||
<li class="intern"></li>
|
||||
</p>
|
||||
|
||||
<br>
|
||||
<div class="text">PROJECT</div>
|
||||
|
||||
<p>
|
||||
<li class="project">Portfolio (HTML, CSS, js, Bootstraps)</li>
|
||||
<li class="project">eCommerce Website (Shopify liquid-code, HTML, CSS)</li>
|
||||
<li class="project">QuickShop - eCommerce Website (Like Amazon, Flipkart etc.)</li>
|
||||
<li class="project">Fully Responsive Design Email Subscribe form</li>
|
||||
<li class="project">Blog (HTML, CSS, Bootstraps)</li>
|
||||
<li class="project">Currently Working on a Messaging App (Like WhatsApp)</li>
|
||||
</p>
|
||||
|
||||
<br>
|
||||
<div class="text">DEVELOPMENT SKILLS</div>
|
||||
|
||||
<p>
|
||||
I'm familiar & work on a daily basis with HTML, CSS, JavaScript, Bootstrap, React js and other modern frameworks.
|
||||
</p>
|
||||
<a href="https://aistechx.com/" target="blank">Get Educate...</a>
|
||||
</div>
|
||||
<div class="column right">
|
||||
<div class="bars">
|
||||
<div class="info">
|
||||
<span>Python</span>
|
||||
<span>90%</span>
|
||||
</div>
|
||||
<div class="line python"></div>
|
||||
</div>
|
||||
<div class="bars">
|
||||
<div class="info">
|
||||
<span>HTML</span>
|
||||
<span>80%</span>
|
||||
</div>
|
||||
<div class="line html"></div>
|
||||
</div>
|
||||
<div class="bars">
|
||||
<div class="info">
|
||||
<span>CSS</span>
|
||||
<span>60%</span>
|
||||
</div>
|
||||
<div class="line css"></div>
|
||||
</div>
|
||||
<div class="bars">
|
||||
<div class="info">
|
||||
<span>JavaScript</span>
|
||||
<span>40%</span>
|
||||
</div>
|
||||
<div class="line js"></div>
|
||||
</div>
|
||||
<div class="bars">
|
||||
<div class="info">
|
||||
<span>Bootstraps</span>
|
||||
<span>60%</span>
|
||||
</div>
|
||||
<div class="line bootstraps"></div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Services -->
|
||||
<section class="services" id="services">
|
||||
<div class="max-width">
|
||||
<h2 class="title">Mes expériences</h2>
|
||||
<div class="carousel-container">
|
||||
<div class="carousel-slide active" id="slide-1">
|
||||
<h2>Stage au Canada</h2>
|
||||
<div class="carousel-container-img">
|
||||
<div class="carousel-img">
|
||||
<img src="./images/UQAC.png" style="width: 100%; border-radius: 15px;" alt="image de l'UQAC">
|
||||
</div>
|
||||
<div class="bars">
|
||||
<div class="info">
|
||||
<span>Django</span>
|
||||
<span>70%</span>
|
||||
</div>
|
||||
<div class="line django"></div>
|
||||
<div class="carousel-text">
|
||||
J'ai réalisé mon premiers stage au canada
|
||||
à l'UQAC d'une durée de 2 mois. Ce projet consistait en la reconnaissance de geste
|
||||
de cuisine à l'aide d'un bracelet polar et d'un modèle d'apprentissage.
|
||||
<br><br>
|
||||
Je l'ai réalisé
|
||||
avec un camarade de l'iut. J'ai énormément apprécié ce projet car j'ai été confronté à
|
||||
des problèmes réels liés à la qualité des données, à leur traitement et à
|
||||
leur interprétation, ce qui explique l'utilisation du langage Python ainsi que
|
||||
de la bibliothèque auto_sklearn. Ce stage m'a fait découvrir une véritable passion pour
|
||||
l'analyse et la gestion des données, ainsi que pour l'intelligence artificielle avec
|
||||
l'apprentissage automatique.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section> -->
|
||||
|
||||
<!-- Projects -->
|
||||
<!-- <section class="projects" id="projects">
|
||||
<div class="max-width">
|
||||
<h2 class="title">My Projects</h2>
|
||||
<div class="carousel owl-carousel">
|
||||
<div class="card">
|
||||
<div class="box">
|
||||
<img src="https://source.unsplash.com/720x600/?shopping" alt="">
|
||||
<div class="text">Ecommerce</div>
|
||||
<p>#Project Details:- Lorem ipsum dolor sit amet consectetur adipisicing elit.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="box">
|
||||
<img src="https://source.unsplash.com/720x600/?portfolio" alt="">
|
||||
<div class="text">Portfolio</div>
|
||||
<p>#Project Details:- Lorem ipsum dolor sit amet consectetur adipisicing elit.</p>
|
||||
<div class="carousel-slide" id="slide-2">
|
||||
<h2>Alternance chez Matussière Toiles</h2>
|
||||
<div class="carousel-container-img">
|
||||
<div class="carousel-img">
|
||||
<img src="./images/store-toile.png" style="width: 100%; border-radius: 15px;"
|
||||
alt="image de toile de store">
|
||||
</div>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="box">
|
||||
<img src="https://source.unsplash.com/720x600/?blog" alt="">
|
||||
<div class="text">Blog</div>
|
||||
<p>#Project Details:- Lorem ipsum dolor sit amet consectetur adipisicing elit.</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="box">
|
||||
<img src="https://source.unsplash.com/720x600/?messanger" alt="">
|
||||
<div class="text">Messaging App</div>
|
||||
<p>#Project Details:- Lorem ipsum dolor sit amet consectetur adipisicing elit.</p>
|
||||
<div class="carousel-text">
|
||||
Ma deuxième expérience, plus professionnalisante est ma 3 ème année d'IUT
|
||||
informatique que je réalise actuellement en alternance chez Matussière-toiles. Cette
|
||||
entreprise est spécialisée dans la production et la distribution de protection solaire extérieure.
|
||||
Pour vendre leur produit, ils utilisent un site internet.
|
||||
<br><br>
|
||||
Ma mission d'alternance consiste en la refonte du site web car il n'est plus au goût du jour et ne
|
||||
peut se positionner face à la concurrence. Pour mener à bien ce projet, j'utilise
|
||||
les langages tels que PHP, JavaScript et HTML/CSS. Etant seul à piloter le projet,
|
||||
je dois faire preuve d'autonomie et de sérieux.
|
||||
</div>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="box">
|
||||
<img src="https://source.unsplash.com/720x600/?app-clone" alt="">
|
||||
<div class="text">Clone</div>
|
||||
<p>#Project Details:- Lorem ipsum dolor sit amet consectetur adipisicing elit.</p>
|
||||
</div>
|
||||
<div class="carousel-slide" id="slide-3">
|
||||
<h2>Vendeur chez E.Leclerc</h2>
|
||||
<div class="carousel-container-img">
|
||||
<div class="carousel-img">
|
||||
<img src="./images/leclerc.png" style="width: 100%; border-radius: 15px;"
|
||||
alt="image d'un magasin leclerc">
|
||||
</div>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="box">
|
||||
<img src="https://source.unsplash.com/720x600/?code,demo" alt="">
|
||||
<div class="text">Demo</div>
|
||||
<p>#Project Details:- Lorem ipsum dolor sit amet consectetur adipisicing elit.</p>
|
||||
<div class="carousel-text">
|
||||
J'ai eu l'occasion de travailler plusieurs fois chez E. Leclerc en tant
|
||||
que vendeur. Mon premier emploi remonte à 2022, où j'ai passé un mois au
|
||||
rayon traiteur. Cette expérience a été extrêmement enrichissante, notamment
|
||||
en termes de communication et d'autonomie. Dès la première semaine, j'ai dû
|
||||
gérer le stand seul pendant plusieurs heures. Il était également nécessaire
|
||||
d'être attentif aux besoins des clients pour leur offrir le meilleur service.
|
||||
<br><br>
|
||||
Ma deuxième expérience a eu lieu à la fin de 2023, pendant la période de Noël,
|
||||
où j'ai alterné entre le rayon de la poissonnerie et celui de la saurisserie.
|
||||
J'ai dû m'adapter rapidement et démontrer ma capacité
|
||||
à agir de manière autonome.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section> -->
|
||||
|
||||
<!-- Contact -->
|
||||
<section class="contact" id="contact">
|
||||
<div class="max-width">
|
||||
<h2 class="title">Me contacter</h2>
|
||||
<div class="contact-content">
|
||||
<div class="column left">
|
||||
<div class="text">Entrer en contact</div>
|
||||
<p>
|
||||
N'hésitez pas à me contacter ! Je suis ouvert à toute discussion et ce serait avec
|
||||
plaisir d'échanger avec des passionnés.
|
||||
</p>
|
||||
<div class="icons">
|
||||
|
||||
<a href="https://instagram.com/aistscience">
|
||||
<div class="row">
|
||||
<i class="fa-solid fa-user-large"></i>
|
||||
<div class="info">
|
||||
<div class="head">Nom</div>
|
||||
<div class="sub-title"><a href="https://aistechx.com/" style="text-decoration: none; color: #333;"> Fillot Romain</a></div>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<div class="row">
|
||||
<i class="fa-solid fa-location-dot"></i>
|
||||
<div class="info">
|
||||
<div class="head"> Adresse</div>
|
||||
<div class="sub-title"> Clermont-Ferrand</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<i class="fa-solid fa-envelope"></i>
|
||||
<div class="info">
|
||||
<div class="head">Email</div>
|
||||
<div class="sub-title"><a href="mailto:#" style="text-decoration: none; color: #333;">romain.fillot630@gmail.com</a></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="carousel-buttons">
|
||||
<button onclick="showSlide(1)">1</button>
|
||||
<button onclick="showSlide(2)">2</button>
|
||||
<button onclick="showSlide(3)">3</button>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Contact -->
|
||||
<section class="contact" id="contact">
|
||||
<div class="max-width">
|
||||
<h2 class="title">Me contacter</h2>
|
||||
<div class="contact-content">
|
||||
|
||||
<!-- <div class="text">Entrer en contact</div> -->
|
||||
<p>
|
||||
N'hésitez pas à me contacter ! Je suis ouvert à toute discussion et ce serait avec
|
||||
plaisir d'échanger avec des passionnés.
|
||||
</p>
|
||||
<div class="icons">
|
||||
|
||||
<a href="https://instagram.com/aistscience">
|
||||
<div class="row">
|
||||
<i class="fa-solid fa-globe"></i>
|
||||
<i class="fa-solid fa-user-large"></i>
|
||||
<div class="info">
|
||||
<div class="head">Langue</div>
|
||||
<div class="sub-title">Anglais opérationnel</div>
|
||||
<div class="head">Nom</div>
|
||||
<div class="sub-title"><a href="https://aistechx.com/" style="text-decoration: none; color: #333;">
|
||||
Fillot Romain</a></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<br>
|
||||
</a>
|
||||
|
||||
<!-- Social -->
|
||||
<div class="social-menu">
|
||||
<ul>
|
||||
<li><a href="https://github.com/Destroyeur6315"><i class="fa-brands fa-github"></i></a></li>
|
||||
<li><a href="https://www.linkedin.com/in/romain-fillot/"><i class="fa-brands fa-linkedin-in"></i></a></li>
|
||||
<li><a href="https://www.instagram.com/romain.flt/"><i class="fa-brands fa-instagram"></i></a></li>
|
||||
<!-- <li><a href="https://twitter.com/___kaaashx___/"><i class="fa-brands fa-twitter"></i></a></li> -->
|
||||
<!-- <li><a href="https://aistechx.com/" title="Get Educate with Us"><i class="fa-solid fa-graduation-cap"></i></a></li> -->
|
||||
</ul>
|
||||
<div class="row">
|
||||
<i class="fa-solid fa-location-dot"></i>
|
||||
<div class="info">
|
||||
<div class="head"> Adresse</div>
|
||||
<div class="sub-title"> Clermont-Ferrand</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Reach -->
|
||||
<div class="column right reach">
|
||||
<div class="text">Formulaire </div>
|
||||
<form action="#">
|
||||
<div class="fields">
|
||||
<div class="field name">
|
||||
<input type="text" placeholder="Votre nom" required>
|
||||
</div>
|
||||
<div class="field email">
|
||||
<input type="email" placeholder="Votre email" required>
|
||||
</div>
|
||||
</div>
|
||||
<div class="field">
|
||||
<input type="text" placeholder="Sujet" required>
|
||||
</div>
|
||||
<div class="field textarea">
|
||||
<textarea cols="30" rows="10" placeholder="Message.." required></textarea>
|
||||
|
||||
<div class="row">
|
||||
<i class="fa-solid fa-envelope"></i>
|
||||
<div class="info">
|
||||
<div class="head">Email</div>
|
||||
<div class="sub-title"><a href="mailto:#"
|
||||
style="text-decoration: none; color: #333;">romain.fillot630@gmail.com</a></div>
|
||||
</div>
|
||||
<div class="button-area">
|
||||
<button type="submit">Envoyer</button>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<i class="fa-solid fa-globe"></i>
|
||||
<div class="info">
|
||||
<div class="head">Langue</div>
|
||||
<div class="sub-title">Anglais opérationnel</div>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<br>
|
||||
|
||||
<!-- Social -->
|
||||
<div class="social-menu">
|
||||
<ul>
|
||||
<li><a href="https://github.com/Destroyeur6315"><i class="fa-brands fa-github"></i></a></li>
|
||||
<li><a href="https://www.linkedin.com/in/romain-fillot/"><i class="fa-brands fa-linkedin-in"></i></a></li>
|
||||
<li><a href="https://www.instagram.com/romain.flt/"><i class="fa-brands fa-instagram"></i></a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Footer -->
|
||||
<footer>
|
||||
<span>
|
||||
<a href="https://www.linkedin.com/in/paithankarvarad">
|
||||
Fillot Romain</a> | <span class="far fa-copyright"></span> 2024 All Rights Reserved. Privacy Policy
|
||||
</span>
|
||||
</footer>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Footer -->
|
||||
<footer>
|
||||
<span>
|
||||
<a href="https://www.linkedin.com/in/paithankarvarad">
|
||||
Fillot Romain</a> | <span class="far fa-copyright"></span> 2024 All Rights Reserved. Privacy Policy
|
||||
</span>
|
||||
</footer>
|
||||
|
||||
<!-- Script JS -->
|
||||
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
|
||||
<script src="main.js"></script>
|
||||
<script src="https://kit.fontawesome.com/b29a4dce1b.js" crossorigin="anonymous"></script>
|
||||
|
||||
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
|
||||
<script src="main.js"></script>
|
||||
<script src="https://kit.fontawesome.com/b29a4dce1b.js" crossorigin="anonymous"></script>
|
||||
|
||||
</body>
|
||||
</body>
|
||||
Loading…
Reference in new issue