daydreel-website/public/index.html
2026-02-19 14:14:59 +01:00

1782 lines
95 KiB
HTML
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="fr">
<head>
<meta name="generator" content="Hugo 0.155.3"><script src="/livereload.js?mindelay=10&amp;v=2&amp;port=35735&amp;path=livereload" data-no-instant defer></script><meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<meta http-equiv="Accept-CH" content="DPR, Viewport-Width, Width">
<link rel="icon" href="/fav.png" type="image/gif">
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="preload"
as="style"
href="https://fonts.googleapis.com/css2?family=Alata&family=Lora:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap"
>
<link rel="stylesheet"
href="https://fonts.googleapis.com/css2?family=Alata&family=Lora:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap"
media="print" onload="this.media='all'" />
<noscript>
<link
href="https://fonts.googleapis.com/css2?family=Alata&family=Lora:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap"
rel="stylesheet">
</noscript>
<link rel="stylesheet" href="/css/font.css" media="all">
<meta property="og:url" content="http://localhost:35735/">
<meta property="og:site_name" content="Daydreel">
<meta property="og:title" content="Daydreel">
<meta property="og:description" content="Text about my cool site">
<meta property="og:locale" content="fr">
<meta property="og:type" content="website">
<meta name="twitter:card" content="summary">
<meta name="twitter:title" content="Daydreel">
<meta name="twitter:description" content="Text about my cool site">
<link rel="alternate" hreflang="en" href="http://localhost:35735/en/" title="English">
<link rel="alternate" hreflang="fr" href="http://localhost:35735/" title="Français">
<meta property="og:locale" content="fr">
<meta property="og:locale:alternate" content="en">
<link rel="stylesheet" href="/bootstrap-5/css/bootstrap.min.css" media="all"><link rel="stylesheet" href="/css/header.css" media="all">
<link rel="stylesheet" href="/css/language-switcher.css" media="all">
<link rel="stylesheet" href="/css/footer.css" media="all">
<link rel="stylesheet" href="/css/theme.css" media="all">
<style>
:root {
--text-color: #343a40;
--text-secondary-color: #6c757d;
--text-link-color: #007bff;
--background-color: #f02020;
--secondary-background-color: #64ffda1a;
--primary-color: #007bff;
--secondary-color: #f8f9fa;
--text-color-dark: #F7FDFF;
--text-secondary-color-dark: #F7FDFF;
--text-link-color-dark: #ffffff;
--background-color-dark: #040348;
--secondary-background-color-dark: #030335;
--primary-color-dark: #fa99c9;
--secondary-color-dark: #030335;
}
body {
font-size: 1rem;
font-weight: 400;
line-height: 1.5;
text-align: left;
}
html {
background-color: var(--background-color) !important;
}
body::-webkit-scrollbar {
height: 0px;
width: 8px;
background-color: var(--background-color);
}
::-webkit-scrollbar-track {
border-radius: 1rem;
}
::-webkit-scrollbar-thumb {
border-radius: 1rem;
background: #b0b0b0;
outline: 1px solid var(--background-color);
}
#search-content::-webkit-scrollbar {
width: .5em;
height: .1em;
background-color: var(--background-color);
}
</style>
<meta name="description" content=Text&#32;about&#32;my&#32;cool&#32;site>
<link rel="stylesheet" href="/css/index.css" media="all">
<link rel="stylesheet" href="/css/projects.css" media="all">
<script defer src="/fontawesome-6/all-6.4.2.js"></script>
<title>
Daydreel
</title>
</head>
<body class="light">
<script>
let localStorageValue = localStorage.getItem("pref-theme");
let mediaQuery = window.matchMedia('(prefers-color-scheme: dark)').matches;
switch (localStorageValue) {
case "dark":
document.documentElement.classList.add('dark');
document.body.classList.add('dark');
break;
case "light":
document.body.classList.remove('dark');
document.documentElement.classList.remove('dark');
break;
default:
if (mediaQuery) {
document.documentElement.classList.add('dark');
document.body.classList.add('dark');
}
break;
}
</script>
<script>
var prevScrollPos = window.pageYOffset;
window.addEventListener("scroll", function showHeaderOnScroll() {
let profileHeaderElem = document.getElementById("profileHeader");
let currentScrollPos = window.pageYOffset;
let resetHeaderStyle = false;
let showNavBarOnScrollUp = true ;
let showNavBar = showNavBarOnScrollUp ? prevScrollPos > currentScrollPos : currentScrollPos > 0;
if (showNavBar) {
profileHeaderElem.classList.add("showHeaderOnTop");
} else {
resetHeaderStyle = true;
}
if(currentScrollPos === 0) {
resetHeaderStyle = true;
}
if(resetHeaderStyle) {
profileHeaderElem.classList.remove("showHeaderOnTop");
}
prevScrollPos = currentScrollPos;
});
</script>
<header id="profileHeader">
<nav class="pt-3 navbar navbar-expand-lg animate">
<div class="container-fluid mx-xs-2 mx-sm-5 mx-md-5 mx-lg-5">
<a class="navbar-brand primary-font text-wrap" href="/">
Daydreel
</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarContent"
aria-controls="navbarContent" aria-expanded="false" aria-label="Toggle navigation">
<svg aria-hidden="true" height="24" viewBox="0 0 16 16" version="1.1" width="24" data-view-component="true">
<path fill-rule="evenodd" d="M1 2.75A.75.75 0 011.75 2h12.5a.75.75 0 110 1.5H1.75A.75.75 0 011 2.75zm0 5A.75.75 0 011.75 7h12.5a.75.75 0 110 1.5H1.75A.75.75 0 011 7.75zM1.75 12a.75.75 0 100 1.5h12.5a.75.75 0 100-1.5H1.75z"></path>
</svg>
</button>
<div class="collapse navbar-collapse text-wrap primary-font" id="navbarContent">
<ul class="navbar-nav ms-auto text-center">
<li class="nav-item navbar-text">
<a class="nav-link" href="/#about" aria-label="about">
À Propos de Moi
</a>
</li>
<li class="nav-item navbar-text">
<a class="nav-link" href="/#experience"
aria-label="experience">
Expérience
</a>
</li>
<li class="nav-item navbar-text">
<a class="nav-link" href="/#education"
aria-label="education">
Éducation
</a>
</li>
<li class="nav-item navbar-text">
<a class="nav-link" href="/#projects"
aria-label="projects">
Projets
</a>
</li>
<li class="nav-item navbar-text">
<a class="nav-link" href="/#achievements"
aria-label="achievements">
Réalisations
</a>
</li>
<li class="nav-item navbar-text">
<a class="nav-link" href="/#contact"
aria-label="contact">
Contact
</a>
</li>
<li class="nav-item navbar-text">
<a class="nav-link" href="/fr/blogs" title="Articles de blog">
Blog
</a>
</li>
<li class="nav-item navbar-text">
<a class="nav-link" href="/fr/gallery" title="Galerie d&#39;images">
Galerie
</a>
</li>
<li class="nav-item navbar-text dropdown">
<a class="nav-link dropdown-toggle" href="#" id="languageDropdown" role="button"
data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
🌐
<span class="d-none d-md-inline">Français</span>
</a>
<div class="dropdown-menu shadow-lg rounded" aria-labelledby="languageDropdown"><a class="dropdown-item text-center nav-link"
href="/en/"
title="English">
English
</a><a class="dropdown-item text-center nav-link active"
href="/"
title="Français">
Français
</a></div>
</li>
</ul>
</div>
</div>
</nav>
</header>
<div id="content"><section id="hero" class="py-5 align-middle">
<div class="container px-3 px-sm-5 px-md-5 px-lg-5 pt-lg-3">
<div class="row">
<div class="col-sm-12 col-md-12 col-lg-8 content animate" id="primary-font">
<span class="subtitle">
Bienvenue, je suis
</span>
<h1>
Daydreel
</h1>
<h2>
Je manifeste de nouvelles réalités
</h2>
<p class="hero-content">
Incarnation de la nuit, les récits stellaires brillent de mille feux. Auteur de l&rsquo;imaginaire, maître de jeu, producteur de jeu vidéo indépendant ; ma passion revolve autour des mondes fictionnels et des histoires ludiques.
</p>
<div class="row">
<div class="col-auto h-100">
<a href="#" class="btn" download
>
CV
</a>
</div>
<div class="col-auto px-0 h-100"><span>
<span class="px-1">
<a href="https://daydreel.itch.io/"
target="_blank"
class="btn social-icon"
>
<i class="fab fa-itch-io"></i>
</a>
</span>
</span>
</div>
</div>
</div>
<div class="col-sm-12 col-md-12 col-lg-4">
<div class="row justify-content-center">
<div class="col-sm-12 col-md-9 pt-5 image animate px-5 px-md-5 px-lg-0 text-center">
<img src="/images/hero.jpg"
class="img-thumbnail mx-auto"
alt="Daydreel profile image"
>
</div>
</div>
</div>
</div>
</div>
<div class="hero-bottom-svg d-md-block d-lg-block d-none">
<svg xmlns="http://www.w3.org/2000/svg" width="201" height="201" viewBox="0 0 201 201">
<g id="Group_1168" data-name="Group 1168" transform="translate(-384 -1392)">
<rect id="Rectangle_2206" data-name="Rectangle 2206" width="12" height="2" rx="1"
transform="translate(391 1392) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2271" data-name="Rectangle 2271" width="12" height="2" rx="1"
transform="translate(391 1500) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2238" data-name="Rectangle 2238" width="12" height="2" rx="1"
transform="translate(391 1446) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2278" data-name="Rectangle 2278" width="12" height="2" rx="1"
transform="translate(391 1554) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2222" data-name="Rectangle 2222" width="12" height="2" rx="1"
transform="translate(391 1419) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2272" data-name="Rectangle 2272" width="12" height="2" rx="1"
transform="translate(391 1527) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2241" data-name="Rectangle 2241" width="12" height="2" rx="1"
transform="translate(391 1473) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2288" data-name="Rectangle 2288" width="12" height="2" rx="1"
transform="translate(391 1581) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2214" data-name="Rectangle 2214" width="12" height="2" rx="1"
transform="translate(499 1392) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2289" data-name="Rectangle 2289" width="12" height="2" rx="1"
transform="translate(499 1500) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2256" data-name="Rectangle 2256" width="12" height="2" rx="1"
transform="translate(499 1446) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2290" data-name="Rectangle 2290" width="12" height="2" rx="1"
transform="translate(499 1554) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2231" data-name="Rectangle 2231" width="12" height="2" rx="1"
transform="translate(499 1419) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2291" data-name="Rectangle 2291" width="12" height="2" rx="1"
transform="translate(499 1527) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2257" data-name="Rectangle 2257" width="12" height="2" rx="1"
transform="translate(499 1473) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2292" data-name="Rectangle 2292" width="12" height="2" rx="1"
transform="translate(499 1581) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2210" data-name="Rectangle 2210" width="12" height="2" rx="1"
transform="translate(445 1392) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2279" data-name="Rectangle 2279" width="12" height="2" rx="1"
transform="translate(445 1500) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2248" data-name="Rectangle 2248" width="12" height="2" rx="1"
transform="translate(445 1446) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2280" data-name="Rectangle 2280" width="12" height="2" rx="1"
transform="translate(445 1554) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2226" data-name="Rectangle 2226" width="12" height="2" rx="1"
transform="translate(445 1419) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2281" data-name="Rectangle 2281" width="12" height="2" rx="1"
transform="translate(445 1527) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2249" data-name="Rectangle 2249" width="12" height="2" rx="1"
transform="translate(445 1473) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2293" data-name="Rectangle 2293" width="12" height="2" rx="1"
transform="translate(445 1581) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2219" data-name="Rectangle 2219" width="12" height="2" rx="1"
transform="translate(553 1392) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2310" data-name="Rectangle 2310" width="12" height="2" rx="1"
transform="translate(553 1500) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2262" data-name="Rectangle 2262" width="12" height="2" rx="1"
transform="translate(553 1446) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2311" data-name="Rectangle 2311" width="12" height="2" rx="1"
transform="translate(553 1554) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2232" data-name="Rectangle 2232" width="12" height="2" rx="1"
transform="translate(553 1419) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2312" data-name="Rectangle 2312" width="12" height="2" rx="1"
transform="translate(553 1527) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2263" data-name="Rectangle 2263" width="12" height="2" rx="1"
transform="translate(553 1473) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2313" data-name="Rectangle 2313" width="12" height="2" rx="1"
transform="translate(553 1581) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2209" data-name="Rectangle 2209" width="12" height="2" rx="1"
transform="translate(418 1392) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2273" data-name="Rectangle 2273" width="12" height="2" rx="1"
transform="translate(418 1500) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2242" data-name="Rectangle 2242" width="12" height="2" rx="1"
transform="translate(418 1446) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2282" data-name="Rectangle 2282" width="12" height="2" rx="1"
transform="translate(418 1554) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2223" data-name="Rectangle 2223" width="12" height="2" rx="1"
transform="translate(418 1419) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2274" data-name="Rectangle 2274" width="12" height="2" rx="1"
transform="translate(418 1527) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2243" data-name="Rectangle 2243" width="12" height="2" rx="1"
transform="translate(418 1473) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2294" data-name="Rectangle 2294" width="12" height="2" rx="1"
transform="translate(418 1581) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2217" data-name="Rectangle 2217" width="12" height="2" rx="1"
transform="translate(526 1392) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2314" data-name="Rectangle 2314" width="12" height="2" rx="1"
transform="translate(526 1500) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2258" data-name="Rectangle 2258" width="12" height="2" rx="1"
transform="translate(526 1446) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2315" data-name="Rectangle 2315" width="12" height="2" rx="1"
transform="translate(526 1554) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2233" data-name="Rectangle 2233" width="12" height="2" rx="1"
transform="translate(526 1419) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2316" data-name="Rectangle 2316" width="12" height="2" rx="1"
transform="translate(526 1527) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2259" data-name="Rectangle 2259" width="12" height="2" rx="1"
transform="translate(526 1473) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2317" data-name="Rectangle 2317" width="12" height="2" rx="1"
transform="translate(526 1581) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2211" data-name="Rectangle 2211" width="12" height="2" rx="1"
transform="translate(472 1392) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2295" data-name="Rectangle 2295" width="12" height="2" rx="1"
transform="translate(472 1500) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2250" data-name="Rectangle 2250" width="12" height="2" rx="1"
transform="translate(472 1446) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2296" data-name="Rectangle 2296" width="12" height="2" rx="1"
transform="translate(472 1554) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2227" data-name="Rectangle 2227" width="12" height="2" rx="1"
transform="translate(472 1419) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2297" data-name="Rectangle 2297" width="12" height="2" rx="1"
transform="translate(472 1527) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2251" data-name="Rectangle 2251" width="12" height="2" rx="1"
transform="translate(472 1473) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2298" data-name="Rectangle 2298" width="12" height="2" rx="1"
transform="translate(472 1581) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2221" data-name="Rectangle 2221" width="12" height="2" rx="1"
transform="translate(580 1392) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2318" data-name="Rectangle 2318" width="12" height="2" rx="1"
transform="translate(580 1500) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2264" data-name="Rectangle 2264" width="12" height="2" rx="1"
transform="translate(580 1446) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2319" data-name="Rectangle 2319" width="12" height="2" rx="1"
transform="translate(580 1554) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2236" data-name="Rectangle 2236" width="12" height="2" rx="1"
transform="translate(580 1419) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2320" data-name="Rectangle 2320" width="12" height="2" rx="1"
transform="translate(580 1527) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2265" data-name="Rectangle 2265" width="12" height="2" rx="1"
transform="translate(580 1473) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2321" data-name="Rectangle 2321" width="12" height="2" rx="1"
transform="translate(580 1581) rotate(90)" fill="#282f49" />
<rect id="Rectangle_2207" data-name="Rectangle 2207" width="12" height="2" rx="1"
transform="translate(396 1399) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2270" data-name="Rectangle 2270" width="12" height="2" rx="1"
transform="translate(396 1507) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2239" data-name="Rectangle 2239" width="12" height="2" rx="1"
transform="translate(396 1453) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2283" data-name="Rectangle 2283" width="12" height="2" rx="1"
transform="translate(396 1561) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2224" data-name="Rectangle 2224" width="12" height="2" rx="1"
transform="translate(396 1426) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2275" data-name="Rectangle 2275" width="12" height="2" rx="1"
transform="translate(396 1534) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2244" data-name="Rectangle 2244" width="12" height="2" rx="1"
transform="translate(396 1480) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2299" data-name="Rectangle 2299" width="12" height="2" rx="1"
transform="translate(396 1588) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2215" data-name="Rectangle 2215" width="12" height="2" rx="1"
transform="translate(504 1399) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2300" data-name="Rectangle 2300" width="12" height="2" rx="1"
transform="translate(504 1507) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2252" data-name="Rectangle 2252" width="12" height="2" rx="1"
transform="translate(504 1453) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2301" data-name="Rectangle 2301" width="12" height="2" rx="1"
transform="translate(504 1561) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2228" data-name="Rectangle 2228" width="12" height="2" rx="1"
transform="translate(504 1426) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2302" data-name="Rectangle 2302" width="12" height="2" rx="1"
transform="translate(504 1534) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2253" data-name="Rectangle 2253" width="12" height="2" rx="1"
transform="translate(504 1480) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2303" data-name="Rectangle 2303" width="12" height="2" rx="1"
transform="translate(504 1588) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2212" data-name="Rectangle 2212" width="12" height="2" rx="1"
transform="translate(450 1399) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2284" data-name="Rectangle 2284" width="12" height="2" rx="1"
transform="translate(450 1507) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2245" data-name="Rectangle 2245" width="12" height="2" rx="1"
transform="translate(450 1453) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2285" data-name="Rectangle 2285" width="12" height="2" rx="1"
transform="translate(450 1561) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2229" data-name="Rectangle 2229" width="12" height="2" rx="1"
transform="translate(450 1426) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2286" data-name="Rectangle 2286" width="12" height="2" rx="1"
transform="translate(450 1534) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2246" data-name="Rectangle 2246" width="12" height="2" rx="1"
transform="translate(450 1480) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2304" data-name="Rectangle 2304" width="12" height="2" rx="1"
transform="translate(450 1588) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2218" data-name="Rectangle 2218" width="12" height="2" rx="1"
transform="translate(558 1399) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2322" data-name="Rectangle 2322" width="12" height="2" rx="1"
transform="translate(558 1507) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2266" data-name="Rectangle 2266" width="12" height="2" rx="1"
transform="translate(558 1453) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2323" data-name="Rectangle 2323" width="12" height="2" rx="1"
transform="translate(558 1561) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2234" data-name="Rectangle 2234" width="12" height="2" rx="1"
transform="translate(558 1426) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2324" data-name="Rectangle 2324" width="12" height="2" rx="1"
transform="translate(558 1534) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2267" data-name="Rectangle 2267" width="12" height="2" rx="1"
transform="translate(558 1480) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2325" data-name="Rectangle 2325" width="12" height="2" rx="1"
transform="translate(558 1588) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2208" data-name="Rectangle 2208" width="12" height="2" rx="1"
transform="translate(423 1399) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2276" data-name="Rectangle 2276" width="12" height="2" rx="1"
transform="translate(423 1507) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2240" data-name="Rectangle 2240" width="12" height="2" rx="1"
transform="translate(423 1453) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2287" data-name="Rectangle 2287" width="12" height="2" rx="1"
transform="translate(423 1561) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2225" data-name="Rectangle 2225" width="12" height="2" rx="1"
transform="translate(423 1426) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2277" data-name="Rectangle 2277" width="12" height="2" rx="1"
transform="translate(423 1534) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2247" data-name="Rectangle 2247" width="12" height="2" rx="1"
transform="translate(423 1480) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2305" data-name="Rectangle 2305" width="12" height="2" rx="1"
transform="translate(423 1588) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2216" data-name="Rectangle 2216" width="12" height="2" rx="1"
transform="translate(531 1399) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2326" data-name="Rectangle 2326" width="12" height="2" rx="1"
transform="translate(531 1507) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2260" data-name="Rectangle 2260" width="12" height="2" rx="1"
transform="translate(531 1453) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2327" data-name="Rectangle 2327" width="12" height="2" rx="1"
transform="translate(531 1561) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2235" data-name="Rectangle 2235" width="12" height="2" rx="1"
transform="translate(531 1426) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2328" data-name="Rectangle 2328" width="12" height="2" rx="1"
transform="translate(531 1534) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2261" data-name="Rectangle 2261" width="12" height="2" rx="1"
transform="translate(531 1480) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2329" data-name="Rectangle 2329" width="12" height="2" rx="1"
transform="translate(531 1588) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2213" data-name="Rectangle 2213" width="12" height="2" rx="1"
transform="translate(477 1399) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2306" data-name="Rectangle 2306" width="12" height="2" rx="1"
transform="translate(477 1507) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2254" data-name="Rectangle 2254" width="12" height="2" rx="1"
transform="translate(477 1453) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2307" data-name="Rectangle 2307" width="12" height="2" rx="1"
transform="translate(477 1561) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2230" data-name="Rectangle 2230" width="12" height="2" rx="1"
transform="translate(477 1426) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2308" data-name="Rectangle 2308" width="12" height="2" rx="1"
transform="translate(477 1534) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2255" data-name="Rectangle 2255" width="12" height="2" rx="1"
transform="translate(477 1480) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2309" data-name="Rectangle 2309" width="12" height="2" rx="1"
transform="translate(477 1588) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2220" data-name="Rectangle 2220" width="12" height="2" rx="1"
transform="translate(585 1399) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2330" data-name="Rectangle 2330" width="12" height="2" rx="1"
transform="translate(585 1507) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2268" data-name="Rectangle 2268" width="12" height="2" rx="1"
transform="translate(585 1453) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2331" data-name="Rectangle 2331" width="12" height="2" rx="1"
transform="translate(585 1561) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2237" data-name="Rectangle 2237" width="12" height="2" rx="1"
transform="translate(585 1426) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2332" data-name="Rectangle 2332" width="12" height="2" rx="1"
transform="translate(585 1534) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2269" data-name="Rectangle 2269" width="12" height="2" rx="1"
transform="translate(585 1480) rotate(-180)" fill="#282f49" />
<rect id="Rectangle_2333" data-name="Rectangle 2333" width="12" height="2" rx="1"
transform="translate(585 1588) rotate(-180)" fill="#282f49" />
</g>
</svg>
</div>
</section>
<section id="about" class="py-0 py-sm-5">
<div class="container bg-transparent">
<h3 class="text-center bg-transparent">À Propos de Moi</h3>
<div class="bg-transparent row justify-content-center px-3 py-5">
<div class="col-sm-12 col-md-8 col-lg-4 mb-5 mb-sm-0 mb-md-5 mb-lg-0 d-none d-sm-none d-md-block">
<div class="image d-flex px-5">
<img src="/images/me.jpg" class="img-thumbnail mx-auto rounded-circle" alt="Daydreel profile picture">
</div>
</div>
<div class="col-sm-12 col-md-12 col-lg-8 content">
<p>Je suis une développeuse de logiciels passionnée par le développement web. J&rsquo;ai une formation en informatique et en mathématiques, et je m&rsquo;intéresse vivement à l&rsquo;intersection de la technologie et de l&rsquo;art. Je travaille actuellement comme développeuse de logiciels chez <a href="https://example.com">exemple org.</a> à San Francisco, CA.</p>
<p>Je travaille actuellement sur un projet qui sera utilisé pour aider les gens à trouver le meilleur moyen de se déplacer dans la ville.</p>
Voici quelques technologies avec lesquelles j&#39;ai travaillé récemment:
<ul>
<li>HTML</li>
<li>CSS</li>
<li>JavaScript</li>
<li>React</li>
<li>Node</li>
<li>Express</li>
</ul>
</div>
</div>
</div>
</section>
<section id="experience" class="py-5">
<div class="container">
<h3 class="text-center">Expérience</h3>
<div class="row justify-content-center">
<div class="col-sm-12 col-md-8 col-lg-8 py-5">
<div class="experience-container px-3 pt-2">
<ul class="nav nav-pills mb-2 bg-transparent primary-font" id="pills-tab" role="tablist">
<li class="nav-item px-1 bg-transparent" role="presentation">
<div
class="nav-link active bg-transparent"
aria-selected="true"
role="tab"
data-bs-toggle="pill"
id='facebook-jan-2023-pr-sent-tab'
data-bs-target='#pills-facebook-jan-2023-pr-sent'
aria-controls='facebook-jan-2023-pr-sent'
>
Facebook
</div>
</li>
<li class="nav-item px-1 bg-transparent" role="presentation">
<div
class="nav-link bg-transparent"
aria-selected="true"
role="tab"
data-bs-toggle="pill"
id='amazon-sep-2020-d-c-2021-tab'
data-bs-target='#pills-amazon-sep-2020-d-c-2021'
aria-controls='amazon-sep-2020-d-c-2021'
>
Amazon
</div>
</li>
<li class="nav-item px-1 bg-transparent" role="presentation">
<div
class="nav-link bg-transparent"
aria-selected="true"
role="tab"
data-bs-toggle="pill"
id='apple-jan-2020-ao-t-2020-tab'
data-bs-target='#pills-apple-jan-2020-ao-t-2020'
aria-controls='apple-jan-2020-ao-t-2020'
>
Apple
</div>
</li>
<li class="nav-item px-1 bg-transparent" role="presentation">
<div
class="nav-link bg-transparent"
aria-selected="true"
role="tab"
data-bs-toggle="pill"
id='netflix-juin-2017-nov-2019-tab'
data-bs-target='#pills-netflix-juin-2017-nov-2019'
aria-controls='netflix-juin-2017-nov-2019'
>
Netflix
</div>
</li>
<li class="nav-item px-1 bg-transparent" role="presentation">
<div
class="nav-link bg-transparent"
aria-selected="true"
role="tab"
data-bs-toggle="pill"
id='google-f-v-2016-mar-2017-tab'
data-bs-target='#pills-google-f-v-2016-mar-2017'
aria-controls='google-f-v-2016-mar-2017'
>
Google
</div>
</li>
</ul>
<div class="tab-content pb-3 bg-transparent primary-font" id="pills-tabContent">
<div
class="tab-pane fade bg-transparent show active"
role="tabpanel"
id='pills-facebook-jan-2023-pr-sent'
aria-labelledby='facebook-jan-2023-pr-sent-tab'
>
<div>
<div class="d-flex align-items-center justify-content-between">
<div>
<span class="h4">Développeuse Senior de Logiciels</span>
<span class="p-2">
<span
data-bs-toggle="tooltip"
data-bs-placement="top"
data-bs-original-title=Travaille&#32;comme&#32;développeuse&#32;senior&#32;de&#32;logiciels
>
<i class="fas fa-info-circle fa-xs"></i>
</span>
</span>
<small>-</small>
<a href="https://example.com" target="_blank">Facebook</a>
</div>
<div class="d-block">
<small>Jan 2023 - présent</small>
<div class="featuredLink list-inline d-flex justify-content-end align-items-center">
<div class="list-inline-item">
<a
href="https://react.dev/"
target="_blank"
data-bs-toggle="tooltip"
data-bs-placement="top"
data-bs-original-title=Exemple&#32;de&#32;contenu&#32;d&#39;info-bulle
>
<i class="fa-brands fa-react"></i>
</a>
</div>
<div class="list-inline-item">
<a
href="https://example.com"
target="_blank"
>
<i class="fab fa-x-twitter"></i>
</a>
</div>
<div class="list-inline-item">
<a
class="d-flex align-items-center justify-content-between"
href="https://example.com"
target="_blank"
data-bs-toggle="tooltip"
data-bs-placement="top"
data-bs-original-title=Exemple&#32;de&#32;contenu&#32;d&#39;info-bulle
>
<img src="/fav.png">
</a>
</div>
</div>
</div>
</div>
<div class="pb-2 pb-3">
Je travaille actuellement comme développeuse senior de logiciels chez <a href="https://example.com">exemple org.</a> à San Francisco, CA. Je travaille sur un projet qui sera utilisé pour aider les gens à trouver le meilleur moyen de se déplacer dans la ville.
</div>
</div>
<div>
<div class="d-flex align-items-center justify-content-between">
<div>
<span class="h5">Développeuse de Logiciels</span>
</div>
<div class="d-block">
<small>Jan 2022 - Déc 2023</small>
</div>
</div>
<div class="pb-2 pb-3">
J&rsquo;ai travaillé comme développeuse de logiciels. J&rsquo;ai travaillé sur un projet qui sera utilisé pour aider les gens à trouver le meilleur moyen de se déplacer dans la ville.
</div>
</div>
</div>
<div
class="tab-pane fade bg-transparent "
role="tabpanel"
id='pills-amazon-sep-2020-d-c-2021'
aria-labelledby='amazon-sep-2020-d-c-2021-tab'
>
<div>
<div class="d-flex align-items-center justify-content-between">
<div>
<span class="h4">Développeuse de Logiciels</span>
<span class="p-2">
<span
data-bs-toggle="tooltip"
data-bs-placement="top"
data-bs-original-title=J&#39;ai&#32;travaillé&#32;comme&#32;développeuse&#32;de&#32;logiciels&#32;pendant&#32;plus&#32;d&#39;un&#32;an&#32;chez&#32;Amazon.
>
<i class="fas fa-info-circle fa-xs"></i>
</span>
</span>
<small>-</small>
<a href="https://example.com" target="_blank">Amazon</a>
</div>
<div class="d-block">
<small>Sep 2020 - Déc 2021</small>
</div>
</div>
<div class="pb-2 pb-3">
<p>Je travaille actuellement comme développeuse de logiciels chez <a href="https://example.com">exemple org.</a> à San Francisco, CA. Je travaille sur un projet qui sera utilisé pour aider les gens à trouver le meilleur moyen de se déplacer dans la ville.</p>
<ul>
<li>Développeuse backend principale pour un produit.</li>
<li>J&rsquo;ai créé un design frontend pour un produit.</li>
</ul>
</div>
</div>
</div>
<div
class="tab-pane fade bg-transparent "
role="tabpanel"
id='pills-apple-jan-2020-ao-t-2020'
aria-labelledby='apple-jan-2020-ao-t-2020-tab'
>
<div>
<div class="d-flex align-items-center justify-content-between">
<div>
<span class="h4">Développeuse Junior de Logiciels</span>
<small>-</small>
<a href="https://example.com" target="_blank">Apple</a>
</div>
<div class="d-block">
<small>Jan 2020 - Août 2020</small>
<div class="featuredLink list-inline d-flex justify-content-end align-items-center">
<div class="list-inline-item">
<a
href="https://react.dev/"
target="_blank"
>
<i class="fa-brands fa-react"></i>
</a>
</div>
<div class="list-inline-item">
<a
href="https://example.com"
target="_blank"
>
<i class="fab fa-x-twitter"></i>
</a>
</div>
<div class="list-inline-item">
<a
class="d-flex align-items-center justify-content-between"
href="https://example.com"
target="_blank"
>
<img src="/fav.png">
</a>
</div>
</div>
</div>
</div>
<div class="pb-2 pb-3">
<p>Je travaille actuellement comme développeuse de logiciels chez <a href="https://example.com">exemple org.</a> à San Francisco, CA. Je travaille sur un projet qui sera utilisé pour aider les gens à trouver le meilleur moyen de se déplacer dans la ville.</p>
<ul>
<li>Développeuse backend principale pour un produit.</li>
<li>J&rsquo;ai créé un design frontend pour un produit.</li>
</ul>
</div>
</div>
</div>
<div
class="tab-pane fade bg-transparent "
role="tabpanel"
id='pills-netflix-juin-2017-nov-2019'
aria-labelledby='netflix-juin-2017-nov-2019-tab'
>
<div>
<div class="d-flex align-items-center justify-content-between">
<div>
<span class="h4">Designer UI/UX</span>
<small>-</small>
<a href="https://example.com" target="_blank">Netflix</a>
</div>
<div class="d-block">
<small>Juin 2017 - Nov 2019</small>
</div>
</div>
<div class="pb-2 pb-3">
<p>Je travaille actuellement comme développeuse de logiciels chez <a href="https://example.com">exemple org.</a> à San Francisco, CA. Je travaille sur un projet qui sera utilisé pour aider les gens à trouver le meilleur moyen de se déplacer dans la ville.</p>
<ul>
<li>Développeuse backend principale pour un produit.</li>
<li>J&rsquo;ai créé un design frontend pour un produit.</li>
</ul>
</div>
</div>
</div>
<div
class="tab-pane fade bg-transparent "
role="tabpanel"
id='pills-google-f-v-2016-mar-2017'
aria-labelledby='google-f-v-2016-mar-2017-tab'
>
<div>
<div class="d-flex align-items-center justify-content-between">
<div>
<span class="h4">Designer de Produits</span>
<small>-</small>
<a href="https://example.com" target="_blank">Google</a>
</div>
<div class="d-block">
<small>Fév 2016 - Mar 2017</small>
</div>
</div>
<div class="pb-2 pb-3">
Je travaille actuellement comme développeuse de logiciels chez <a href="https://example.com">exemple org.</a> à San Francisco, CA. Je travaille sur un projet qui sera utilisé pour aider les gens à trouver le meilleur moyen de se déplacer dans la ville.
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section id="education" class="py-5">
<div class="container">
<h3 class="text-center">Éducation</h3>
<div class="row justify-content-center py-5">
<div class="col-12 p-0">
<div class="row row align-items-center justify-content-center m-1 mb-4">
<div class="col-md-9">
<div class="card">
<div class="card-body">
<div class="float-end">
<small>2013 - 2015</small>
</div>
<h5 class="card-title">Master en Administration des Affaires</h5>
<a href="https://example.org" target="_blank">
<h6>
Université de Californie, Berkeley
</h6>
</a>
<div class="py-1">
GPA:
<i>
<small>3.8 sur 5.0</small>
</i>
</div>
<div class="py-1 education-content">
<p>Activités Extrascolaires</p>
<ul>
<li>Lorem ipsum dolor sit amet consectetur adipisicing elit.</li>
<li>Tempora esse, eaque delectus nulla quo doloribus itaque expedita alias natus optio totam maxime nihil excepturi velit a animi laborum hic similique.</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-12 p-0">
<div class="row row align-items-center justify-content-center m-1 mb-4">
<div class="col-md-9">
<div class="card">
<div class="card-body">
<div class="float-end">
<small>2009 - 2013</small>
</div>
<h5 class="card-title">Licence en Sciences Informatiques</h5>
<a href="https://example.org" target="_blank">
<h6>
Institut de Technologie du Massachusetts
</h6>
</a>
<div class="py-1">
GPA:
<i>
<small>3.9 sur 5.0</small>
</i>
</div>
<div class="py-1 education-content">
<p>J&rsquo;ai publié deux articles lors de la Conférence ACM SIGCHI sur l&rsquo;Intelligence Artificielle.</p>
<ul>
<li><a href="https://example.com">Détection d&rsquo;Objets Rapide et Précise avec un Réseau de Neurones Convolutifs</a></li>
<li>Détection de masques faciaux à l&rsquo;aide d&rsquo;un réseau de neurones convolutifs.</li>
</ul>
<p>Activités Extrascolaires</p>
<ul>
<li>Lorem ipsum dolor sit amet consectetur adipisicing elit.</li>
<li>Tempora esse, eaque delectus nulla quo doloribus itaque expedita alias natus optio totam maxime nihil excepturi velit a animi laborum hic similique.</li>
</ul>
</div>
<div class="py-1">
<a href="https://example.com" class="btn">
Mon dossier académique
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-12 p-0">
<div class="row row align-items-center justify-content-center m-1 mb-4">
<div class="col-md-9">
<div class="card">
<div class="card-body">
<div class="float-end">
<small></small>
</div>
<h5 class="card-title">Lycée</h5>
<a href="https://example.org" target="_blank">
<h6>
Lycée Thomas Jefferson pour les Sciences et la Technologie.
</h6>
</a>
<div class="py-1">
GPA:
<i>
<small>4.2 sur 5.0</small>
</i>
</div>
<div class="py-1 education-content">
</div>
<div class="py-1">
<a href="https://example.com" class="btn">
Featured
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section id="projects" class="py-5">
<div class="container">
<h3 class="text-center">Projets</h3>
<div class="row justify-content-center px-3 px-md-5">
<div class="col-lg-4 col-md-6 my-3">
<div class="card my-3 h-100" title="Hugo Profile">
<div class="card-head">
<img class="card-img-top" src="/images/projects/profile.png" alt="Hugo Profile">
</div>
<div class="card-body bg-transparent p-3">
<div class="pb-2 bg-transparent">
<span class="badge badge-secondary">Hugo</span>
<span class="badge badge-secondary">Bootstrap</span>
<span class="badge badge-secondary">Javascript</span>
</div>
<h5 class="card-title bg-transparent mt-1">Hugo Profile</h5>
<div class="card-text bg-transparent secondary-font">
Un modèle Hugo hautement personnalisable et axé sur le mobile pour portfolio personnel et blog.
</div>
</div>
<div class="card-footer py-3">
<span class="m-1 mx-2">
<a href="mailto:?subject=Mod%c3%a8le%20Hugo%20Profile&amp;body=D%c3%a9couvrez-le:%20https%3a%2f%2fhugo-profile.netlify.app%2fblog%2fmarkdown-syntax%2f" target="_blank">
<i class="fa fa-envelope"></i>
</a>
</span>
<span class="m-1 mx-2">
<a href="https://github.com/gurusabarish/hugo-profile" target="_blank">
<i class="fab fa-github"></i>
</a>
</span>
<span class="m-1 mx-2">
<a href="https://twitter.com/intent/tweet?text=D%c3%a9couvrez-le:&amp;url=https%3A%2F%2Fgithub.com%2Fgurusabarish%2Fhugo-profile" target="_blank">
<i class="fab fa-twitter"></i>
</a>
</span>
<span class="float-end">
<a class="btn btn-sm" href="https://hugo-profile.netlify.app" target="_blank">
Démo
</a>
</span>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 my-3">
<div class="card my-3 h-100" title="Convertisseur d&#39;Images">
<div class="card-head">
<img class="card-img-top" src="/images/projects/converter.jpg" alt="Convertisseur d&#39;Images">
</div>
<div class="card-body bg-transparent p-3">
<div class="pb-2 bg-transparent">
<span class="badge badge-secondary">Django</span>
<span class="badge badge-secondary">Bootstrap</span>
</div>
<h5 class="card-title bg-transparent mt-1">Convertisseur d&#39;Images</h5>
<div class="card-text bg-transparent secondary-font">
Une application web pour convertir des images en pdf, png en jpg, png en jpg et png en webp sans base de données en utilisant django.
</div>
</div>
<div class="card-footer py-3">
<span class="m-1 mx-2">
<a href="https://github.com/gurusabarish/converter" target="_blank">
<i class="fab fa-github"></i>
</a>
</span>
<span class="float-end">
<a class="btn btn-sm" href="https://django-converter.herokuapp.com" target="_blank">
Démo
</a>
</span>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 my-3">
<div class="card my-3 h-100" title="Hugo Profile V2">
<div class="card-head">
<img class="card-img-top" src="/images/projects/profile2.jpg" alt="Hugo Profile V2">
</div>
<div class="card-body bg-transparent p-3">
<div class="pb-2 bg-transparent">
<span class="badge badge-secondary">Hugo</span>
<span class="badge badge-secondary">Bootstrap</span>
<span class="badge badge-secondary">Javascript</span>
</div>
<h5 class="card-title bg-transparent mt-1">Hugo Profile V2</h5>
<div class="card-text bg-transparent secondary-font">
Un modèle Hugo propre et simple pour portfolio personnel et blog.
</div>
</div>
<div class="card-footer py-3">
<span class="m-1 mx-2">
<a href="https://github.com/gurusabarish/HugoProfileV2" target="_blank">
<i class="fab fa-github"></i>
</a>
</span>
<span class="float-end">
<a class="btn btn-sm" href="https://hugo-profile-2.netlify.app" target="_blank">
Démo V2
</a>
</span>
</div>
</div>
</div>
</div>
</div>
</section>
<section id="achievements" class="py-5">
<div class="container">
<h3 class="text-center">Réalisations</h3>
<div class="px-0 px-md-5 px-lg-5">
<div class="row justify-content-center px-3 px-md-5 px-lg-5">
<div class="col-lg-4 col-md-6 my-3">
<a class="card my-3 h-100 p-3" href="https://example.com" title="Finaliste Google Kickstart" target="_blank">
<div class="card-head">
<img class="card-img-top" src="/images/achievement.jpg">
</div>
<div class="card-body bg-transparent">
<h5 class="card-title bg-transparent">Finaliste Google Kickstart</h5>
<div class="card-text secondary-font">
J&#39;ai résolu tous les problèmes avec une solution optimale.
</div>
</div>
</a>
</div>
<div class="col-lg-4 col-md-6 my-3">
<div class="card my-3 h-100 p-3" title="Gagnant du Hackathon Facebook">
<div class="card-head">
<img class="card-img-top" src="/images/achievement.jpg">
</div>
<div class="card-body bg-transparent">
<h5 class="card-title bg-transparent">Gagnant du Hackathon Facebook</h5>
<div class="card-text secondary-font">
J&#39;ai développé un produit utilisant l&#39;Intelligence Artificielle.
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 my-3">
<a class="card my-3 h-100 p-3" href="https://github.com/gurusabarish/hugo-profile" title="Hugo Profile" target="_blank">
<div class="card-head">
<img class="card-img-top" src="/images/achievement.jpg">
</div>
<div class="card-body bg-transparent">
<h5 class="card-title bg-transparent">Hugo Profile</h5>
<div class="card-text secondary-font">
J&#39;ai développé un thème et j&#39;obtiens plus de 1K téléchargements par mois.
</div>
</div>
</a>
</div>
<div class="col-lg-4 col-md-6 my-3">
<div class="card my-3 h-100 p-3" title="Finaliste Microsoft Imagine">
<div class="card-body bg-transparent">
<h5 class="card-title bg-transparent">Finaliste Microsoft Imagine</h5>
<div class="card-text secondary-font">
Nous avons développé un produit qui peut aider les autres.
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 my-3">
<a class="card my-3 h-100 p-3" href="https://example.com" title="Google Summer of Code" target="_blank">
<div class="card-body bg-transparent">
<h5 class="card-title bg-transparent">Google Summer of Code</h5>
<div class="card-text secondary-font">
J&#39;ai contribué à un projet open source.
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</section>
<section id="contact" class="py-5">
<div class="container">
<h3 class="text-center">Contactez-moi</h3>
<div class="px-0 px-md-5 px-lg-5">
<div class="row justify-content-center px-md-5">
<div class="col-md-8 py-3">
<div class="text-center">
Ma boîte de réception est toujours ouverte. Que vous ayez une question ou que vous vouliez simplement dire bonjour, je ferai de mon mieux pour vous répondre!
</div>
<div class="text-center pt-3">
<a
href='
mailto:gurusabarisha@gmail.com
'
target="_blank"
class="btn"
>
Écrivez-moi
</a>
</div>
</div>
</div>
</div>
</div>
<div id="contact-form-status"></div>
</section>
<svg xmlns="http://www.w3.org/2000/svg" style="display: none;">
<symbol id="check-circle-fill" viewBox="0 0 16 16">
<path d="M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0zm-3.97-3.03a.75.75 0 0 0-1.08.022L7.477 9.417 5.384 7.323a.75.75 0 0 0-1.06 1.06L6.97 11.03a.75.75 0 0 0 1.079-.02l3.992-4.99a.75.75 0 0 0-.01-1.05z"/>
</symbol>
<symbol id="info-fill" viewBox="0 0 16 16">
<path d="M8 16A8 8 0 1 0 8 0a8 8 0 0 0 0 16zm.93-9.412-1 4.705c-.07.34.029.533.304.533.194 0 .487-.07.686-.246l-.088.416c-.287.346-.92.598-1.465.598-.703 0-1.002-.422-.808-1.319l.738-3.468c.064-.293.006-.399-.287-.47l-.451-.081.082-.381 2.29-.287zM8 5.5a1 1 0 1 1 0-2 1 1 0 0 1 0 2z"/>
</symbol>
<symbol id="exclamation-triangle-fill" viewBox="0 0 16 16">
<path d="M8.982 1.566a1.13 1.13 0 0 0-1.96 0L.165 13.233c-.457.778.091 1.767.98 1.767h13.713c.889 0 1.438-.99.98-1.767L8.982 1.566zM8 5c.535 0 .954.462.9.995l-.35 3.507a.552.552 0 0 1-1.1 0L7.1 5.995A.905.905 0 0 1 8 5zm.002 6a1 1 0 1 1 0 2 1 1 0 0 1 0-2z"/>
</symbol>
</svg>
</div><footer>
<div class="container py-3" id="recent-posts">
<div class="h3 text-center text-secondary py-3">
Recent Posts
</div>
<div class="row justify-content-center">
<div class="col-lg-4 col-md-6 pt-2">
<div class="card h-100">
<div class="card-header">
<a href="/blogs/math/">
<img src="/images/mathjax.png" class="card-img-top" alt="Render Math With Mathjax">
</a>
</div>
<div class="card-body bg-transparent p-3 shadow-sm">
<a href="/blogs/math/" class="primary-font card-title">
<h5 class="card-title bg-transparent" title="Render Math With Mathjax">Render Math With Mathjax</h5>
</a>
<div class="card-text secondary-font">
<p><h2 id="mathjax">Mathjax</h2>
<p>Math equations can be rendered using <a href="https://www.mathjax.org">Mathjax</a> syntax with AMS symbol support.</p>
<p>Optionally enable this on a per-page basis by adding <code>mathjax: true</code> to your frontmatter.</p>
<p>Then, use <code>$$ ... $$</code> on a line by itself to render a block equation:</p>
<p>$$ | Pr_{x \leftarrow P_{1}} [A(x) = 1] - Pr_{x \leftarrow …</p></p>
</div>
</div>
<div class="mt-auto card-footer">
<span class="float-start">9 décembre 2022</span>
<a href="/blogs/math/" class="float-end btn btn-outline-info btn-sm">Read</a>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 pt-2">
<div class="card h-100">
<div class="card-header">
<a href="/blogs/markdown-syntax/">
<img src="/images/post.jpg" class="card-img-top" alt="Markdown Syntax">
</a>
</div>
<div class="card-body bg-transparent p-3 shadow-sm">
<a href="/blogs/markdown-syntax/" class="primary-font card-title">
<h5 class="card-title bg-transparent" title="Markdown Syntax">Markdown Syntax</h5>
</a>
<div class="card-text secondary-font">
<p><h2 id="paragraph">Paragraph</h2>
<p>Xerum, quo qui aut unt expliquam qui dolut labo. Aque venitatiusda cum, voluptionse latur sitiae dolessi aut parist aut dollo enim qui voluptate ma dolestendit peritin re plis aut quas inctum laceat est volestemque commosa as cus endigna tectur, offic to cor sequas etum rerum idem sintibus …</p></p>
</div>
</div>
<div class="mt-auto card-footer">
<span class="float-start">3 avril 2021</span>
<a href="/blogs/markdown-syntax/" class="float-end btn btn-outline-info btn-sm">Read</a>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 pt-2">
<div class="card h-100">
<div class="card-header">
<a href="/blogs/emoji-support/">
<img src="/images/post.jpg" class="card-img-top" alt="Emoji Support">
</a>
</div>
<div class="card-body bg-transparent p-3 shadow-sm">
<a href="/blogs/emoji-support/" class="primary-font card-title">
<h5 class="card-title bg-transparent" title="Emoji Support">Emoji Support</h5>
</a>
<div class="card-text secondary-font">
<p><p>Emoji can be enabled in a Hugo project in a number of ways. :zap:</p>
<h2 id="emoji-support">Emoji Support</h2>
<p>The <a href="https://gohugo.io/functions/emojify/">emojify</a> function can be called directly in templates or <a href="https://gohugo.io/templates/shortcode-templates/#inline-shortcodes">Inline Shortcodes</a>.</p>
<p>To enable emoji globally, set <code>enableEmoji</code> to <code>true</code> in your sites <a href="https://gohugo.io/getting-started/configuration/">configuration</a> and then you can type emoji shorthand codes directly in …</p></p>
</div>
</div>
<div class="mt-auto card-footer">
<span class="float-start">3 avril 2021</span>
<a href="/blogs/emoji-support/" class="float-end btn btn-outline-info btn-sm">Read</a>
</div>
</div>
</div>
</div>
</div>
<div class="text-center pt-2">
<span class="px-1">
<a href="https://github.com" target="_blank" aria-label="github">
<svg xmlns="http://www.w3.org/2000/svg" width="2.7em" height="2.7em" viewBox="0 0 1792 1792">
<path id="footer-socialNetworks-github-svg-path"
d="M522 1352q-8 9-20-3-13-11-4-19 8-9 20 3 12 11 4 19zm-42-61q9 12 0 19-8 6-17-7t0-18q9-7 17 6zm-61-60q-5 7-13 2-10-5-7-12 3-5 13-2 10 5 7 12zm31 34q-6 7-16-3-9-11-2-16 6-6 16 3 9 11 2 16zm129 112q-4 12-19 6-17-4-13-15t19-7q16 5 13 16zm63 5q0 11-16 11-17 2-17-11 0-11 16-11 17-2 17 11zm58-10q2 10-14 14t-18-8 14-15q16-2 18 9zm964-956v960q0 119-84.5 203.5t-203.5 84.5h-224q-16 0-24.5-1t-19.5-5-16-14.5-5-27.5v-239q0-97-52-142 57-6 102.5-18t94-39 81-66.5 53-105 20.5-150.5q0-121-79-206 37-91-8-204-28-9-81 11t-92 44l-38 24q-93-26-192-26t-192 26q-16-11-42.5-27t-83.5-38.5-86-13.5q-44 113-7 204-79 85-79 206 0 85 20.5 150t52.5 105 80.5 67 94 39 102.5 18q-40 36-49 103-21 10-45 15t-57 5-65.5-21.5-55.5-62.5q-19-32-48.5-52t-49.5-24l-20-3q-21 0-29 4.5t-5 11.5 9 14 13 12l7 5q22 10 43.5 38t31.5 51l10 23q13 38 44 61.5t67 30 69.5 7 55.5-3.5l23-4q0 38 .5 103t.5 68q0 22-11 33.5t-22 13-33 1.5h-224q-119 0-203.5-84.5t-84.5-203.5v-960q0-119 84.5-203.5t203.5-84.5h960q119 0 203.5 84.5t84.5 203.5z" />
<metadata>
<rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:rdfs="http://www.w3.org/2000/01/rdf-schema#" xmlns:dc="http://purl.org/dc/elements/1.1/">
<rdf:Description about="https://iconscout.com/legal#licenses"
dc:title="Github, Online, Project, Hosting, Square"
dc:description="Github, Online, Project, Hosting, Square" dc:publisher="Iconscout"
dc:date="2016-12-14" dc:format="image/svg+xml" dc:language="en">
<dc:creator>
<rdf:Bag>
<rdf:li>Font Awesome</rdf:li>
</rdf:Bag>
</dc:creator>
</rdf:Description>
</rdf:RDF>
</metadata>
</svg>
</a>
</span>
<span class="px-1">
<a href="https://linkedin.com" target="_blank" aria-label="linkedin">
<svg xmlns="http://www.w3.org/2000/svg" width='2.4em' height='2.4em' fill="#fff" aria-label="LinkedIn"
viewBox="0 0 512 512">
<rect width="512" height="512" fill="#0077b5" rx="15%" />
<circle cx="142" cy="138" r="37" />
<path stroke="#fff" stroke-width="66" d="M244 194v198M142 194v198" />
<path d="M276 282c0-20 13-40 36-40 24 0 33 18 33 45v105h66V279c0-61-32-89-76-89-34 0-51 19-59 32" />
</svg>
</a>
</span>
<a href="https://twitter.com" target="_blank" aria-label="twitter">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" width="48px" height="48px">
<path fill="#03a9f4"
d="M42,37c0,2.762-2.239,5-5,5H11c-2.762,0-5-2.238-5-5V11c0-2.762,2.238-5,5-5h26c2.761,0,5,2.238,5,5 V37z" />
<path fill="#fff"
d="M36,17.12c-0.882,0.391-1.999,0.758-3,0.88c1.018-0.604,2.633-1.862,3-3 c-0.951,0.559-2.671,1.156-3.793,1.372C31.311,15.422,30.033,15,28.617,15C25.897,15,24,17.305,24,20v2c-4,0-7.9-3.047-10.327-6 c-0.427,0.721-0.667,1.565-0.667,2.457c0,1.819,1.671,3.665,2.994,4.543c-0.807-0.025-2.335-0.641-3-1c0,0.016,0,0.036,0,0.057 c0,2.367,1.661,3.974,3.912,4.422C16.501,26.592,16,27,14.072,27c0.626,1.935,3.773,2.958,5.928,3c-1.686,1.307-4.692,2-7,2 c-0.399,0-0.615,0.022-1-0.023C14.178,33.357,17.22,34,20,34c9.057,0,14-6.918,14-13.37c0-0.212-0.007-0.922-0.018-1.13 C34.95,18.818,35.342,18.104,36,17.12" />
</svg>
</a>
<a href="https://instagram.com" target="_blank" aria-label="instagram">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" width="48px" height="48px">
<radialGradient id="yOrnnhliCrdS2gy~4tD8ma" cx="19.38" cy="42.035" r="44.899"
gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#fd5" />
<stop offset=".328" stop-color="#ff543f" />
<stop offset=".348" stop-color="#fc5245" />
<stop offset=".504" stop-color="#e64771" />
<stop offset=".643" stop-color="#d53e91" />
<stop offset=".761" stop-color="#cc39a4" />
<stop offset=".841" stop-color="#c837ab" />
</radialGradient>
<path fill="url(#yOrnnhliCrdS2gy~4tD8ma)"
d="M34.017,41.99l-20,0.019c-4.4,0.004-8.003-3.592-8.008-7.992l-0.019-20 c-0.004-4.4,3.592-8.003,7.992-8.008l20-0.019c4.4-0.004,8.003,3.592,8.008,7.992l0.019,20 C42.014,38.383,38.417,41.986,34.017,41.99z" />
<radialGradient id="yOrnnhliCrdS2gy~4tD8mb" cx="11.786" cy="5.54" r="29.813"
gradientTransform="matrix(1 0 0 .6663 0 1.849)" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#4168c9" />
<stop offset=".999" stop-color="#4168c9" stop-opacity="0" />
</radialGradient>
<path fill="url(#yOrnnhliCrdS2gy~4tD8mb)"
d="M34.017,41.99l-20,0.019c-4.4,0.004-8.003-3.592-8.008-7.992l-0.019-20 c-0.004-4.4,3.592-8.003,7.992-8.008l20-0.019c4.4-0.004,8.003,3.592,8.008,7.992l0.019,20 C42.014,38.383,38.417,41.986,34.017,41.99z" />
<path fill="#fff"
d="M24,31c-3.859,0-7-3.14-7-7s3.141-7,7-7s7,3.14,7,7S27.859,31,24,31z M24,19c-2.757,0-5,2.243-5,5 s2.243,5,5,5s5-2.243,5-5S26.757,19,24,19z" />
<circle cx="31.5" cy="16.5" r="1.5" fill="#fff" />
<path fill="#fff"
d="M30,37H18c-3.859,0-7-3.14-7-7V18c0-3.86,3.141-7,7-7h12c3.859,0,7,3.14,7,7v12 C37,33.86,33.859,37,30,37z M18,13c-2.757,0-5,2.243-5,5v12c0,2.757,2.243,5,5,5h12c2.757,0,5-2.243,5-5V18c0-2.757-2.243-5-5-5H18z" />
</svg>
</a>
<a href="https://facebook.com" target="_blank" aria-label="facebook">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" width="48px" height="48px">
<path fill="#3F51B5"
d="M42,37c0,2.762-2.238,5-5,5H11c-2.761,0-5-2.238-5-5V11c0-2.762,2.239-5,5-5h26c2.762,0,5,2.238,5,5V37z" />
<path fill="#FFF"
d="M34.368,25H31v13h-5V25h-3v-4h3v-2.41c0.002-3.508,1.459-5.59,5.592-5.59H35v4h-2.287C31.104,17,31,17.6,31,18.723V21h4L34.368,25z" />
</svg>
</a>
</div><div class="container py-4">
<div class="row justify-content-center">
<div class="col-md-4 text-center">
<div class="pb-2">
<a href="http://localhost:35735/" title="Daydreel">
<img alt="Footer logo" src="/fav.png"
height="40px" width="40px">
</a>
</div>
&copy; 2026 All rights reserved
<div class="text-secondary">
Made with
<span class="text-danger">
&#10084;
</span>
and
<a href="https://github.com/gurusabarish/hugo-profile" target="_blank"
title="Designed and developed by gurusabarish">
Hugo Profile
</a>
</div>
</div>
</div>
</div>
</footer><script src="/bootstrap-5/js/bootstrap.bundle.min.js"></script>
<script>
if (document.body.className.includes("light")) {
document.documentElement.classList.add('dark');
document.body.classList.add('dark');
localStorage.setItem("pref-theme", 'dark');
}
</script>
<section id="search-content" class="py-2">
<div class="container" id="search-results"></div>
</section>
</body>
</html>