James/daydreel-website
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions
daydreel-website/public/en/index.html

1690 lines
90 KiB
HTML
Raw Permalink Normal View History

init
2026-02-19 14:14:59 +01:00
<!DOCTYPE html>
<html lang="en">
<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/en/">
<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="en">
<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="en">
<meta property="og:locale:alternate" content="fr">
<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="/en/">
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="/en/#about" aria-label="about">
About Me
</a>
</li>
<li class="nav-item navbar-text">
<a class="nav-link" href="/en/#experience"
aria-label="experience">
Experience
</a>
</li>
<li class="nav-item navbar-text">
<a class="nav-link" href="/en/#education"
aria-label="education">
Education
</a>
</li>
<li class="nav-item navbar-text">
<a class="nav-link" href="/en/#projects"
aria-label="projects">
Projects
</a>
</li>
<li class="nav-item navbar-text">
<a class="nav-link" href="/en/#achievements"
aria-label="achievements">
Achievements
</a>
</li>
<li class="nav-item navbar-text">
<a class="nav-link" href="/en/#contact"
aria-label="contact">
Contact
</a>
</li>
<li class="nav-item navbar-text">
<a class="nav-link" href="/blogs" title="Blog posts">
Blog
</a>
</li>
<li class="nav-item navbar-text">
<a class="nav-link" href="/gallery" title="Image gallery">
Gallery
</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">English</span>
</a>
<div class="dropdown-menu shadow-lg rounded" aria-labelledby="languageDropdown"><a class="dropdown-item text-center nav-link active"
href="/en/"
title="English">
English
</a><a class="dropdown-item text-center nav-link"
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
>
Resume
</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">About Me</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>I am a software developer with a passion for web development. I have a background in computer science and mathematics, and I have a strong interest in the intersection of technology and art. I am currently working as a software developer at <a href="https://example.com">example org.</a> in San Francisco, CA.</p>
<p>I am currently working on a project that will be used to help people find the best way to get around the city.</p>
Here are a few technologies I&#39;ve been working with recently:
<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">Experience</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-present-tab'
data-bs-target='#pills-facebook-jan-2023-present'
aria-controls='facebook-jan-2023-present'
>
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-dec-2021-tab'
data-bs-target='#pills-amazon-sep-2020-dec-2021'
aria-controls='amazon-sep-2020-dec-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-aug-2020-tab'
data-bs-target='#pills-apple-jan-2020-aug-2020'
aria-controls='apple-jan-2020-aug-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-june-2017-nov-2019-tab'
data-bs-target='#pills-netflix-june-2017-nov-2019'
aria-controls='netflix-june-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-feb-2016-mar-2017-tab'
data-bs-target='#pills-google-feb-2016-mar-2017'
aria-controls='google-feb-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-present'
aria-labelledby='facebook-jan-2023-present-tab'
>
<div>
<div class="d-flex align-items-center justify-content-between">
<div>
<span class="h4">Senior Software Developer</span>
<span class="p-2">
<span
data-bs-toggle="tooltip"
data-bs-placement="top"
data-bs-original-title=Working&#32;as&#32;a&#32;senior&#32;software&#32;developer
>
<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 - present</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=Example&#32;tooltip&#32;content
>
<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=Example&#32;tooltip&#32;content
>
<img src="/fav.png">
</a>
</div>
</div>
</div>
</div>
<div class="pb-2 pb-3">
I am currently working as a senior software developer at <a href="https://example.com">example org.</a> in San Francisco, CA. I am currently working on a project that will be used to help people find the best way to get around the city.
</div>
</div>
<div>
<div class="d-flex align-items-center justify-content-between">
<div>
<span class="h5">Software Developer</span>
</div>
<div class="d-block">
<small>Jan 2022 - Dec 2023</small>
</div>
</div>
<div class="pb-2 pb-3">
I worked as a software developer. I worked on a project that will be used to help people find the best way to get around the city.
</div>
</div>
</div>
<div
class="tab-pane fade bg-transparent "
role="tabpanel"
id='pills-amazon-sep-2020-dec-2021'
aria-labelledby='amazon-sep-2020-dec-2021-tab'
>
<div>
<div class="d-flex align-items-center justify-content-between">
<div>
<span class="h4">Software Developer</span>
<span class="p-2">
<span
data-bs-toggle="tooltip"
data-bs-placement="top"
data-bs-original-title=I&#32;worked&#32;as&#32;a&#32;software&#32;developer&#32;for&#32;more&#32;than&#32;one&#32;year&#32;in&#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 - Dec 2021</small>
</div>
</div>
<div class="pb-2 pb-3">
<p>I am currently working as a software developer at <a href="https://example.com">example org.</a> in San Francisco, CA. I am currently working on a project that will be used to help people find the best way to get around the city.</p>
<ul>
<li>Lead backend developer for a product.</li>
<li>Created a frontend design for a product.</li>
</ul>
</div>
</div>
</div>
<div
class="tab-pane fade bg-transparent "
role="tabpanel"
id='pills-apple-jan-2020-aug-2020'
aria-labelledby='apple-jan-2020-aug-2020-tab'
>
<div>
<div class="d-flex align-items-center justify-content-between">
<div>
<span class="h4">Junior Software Developer</span>
<small>-</small>
<a href="https://example.com" target="_blank">Apple</a>
</div>
<div class="d-block">
<small>Jan 2020 - Aug 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>I am currently working as a software developer at <a href="https://example.com">example org.</a> in San Francisco, CA. I am currently working on a project that will be used to help people find the best way to get around the city.</p>
<ul>
<li>Lead backend developer for a product.</li>
<li>Created a frontend design for a product.</li>
</ul>
</div>
</div>
</div>
<div
class="tab-pane fade bg-transparent "
role="tabpanel"
id='pills-netflix-june-2017-nov-2019'
aria-labelledby='netflix-june-2017-nov-2019-tab'
>
<div>
<div class="d-flex align-items-center justify-content-between">
<div>
<span class="h4">UI/UX Designer</span>
<small>-</small>
<a href="https://example.com" target="_blank">Netflix</a>
</div>
<div class="d-block">
<small>June 2017 - Nov 2019</small>
</div>
</div>
<div class="pb-2 pb-3">
<p>I am currently working as a software developer at <a href="https://example.com">example org.</a> in San Francisco, CA. I am currently working on a project that will be used to help people find the best way to get around the city.</p>
<ul>
<li>Lead backend developer for a product.</li>
<li>Created a frontend design for a product.</li>
</ul>
</div>
</div>
</div>
<div
class="tab-pane fade bg-transparent "
role="tabpanel"
id='pills-google-feb-2016-mar-2017'
aria-labelledby='google-feb-2016-mar-2017-tab'
>
<div>
<div class="d-flex align-items-center justify-content-between">
<div>
<span class="h4">Product Designer</span>
<small>-</small>
<a href="https://example.com" target="_blank">Google</a>
</div>
<div class="d-block">
<small>Feb 2016 - Mar 2017</small>
</div>
</div>
<div class="pb-2 pb-3">
I am currently working as a software developer at <a href="https://example.com">example org.</a> in San Francisco, CA. I am currently working on a project that will be used to help people find the best way to get around the city.
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
<section id="education" class="py-5">
<div class="container">
<h3 class="text-center">Education</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 of Business Administration</h5>
<a href="https://example.org" target="_blank">
<h6>
University of California, Berkeley
</h6>
</a>
<div class="py-1">
GPA:
<i>
<small>3.8 out of 5.0</small>
</i>
</div>
<div class="py-1 education-content">
<p>Extracurricular Activities</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">Bachelor of Science in Computer Science</h5>
<a href="https://example.org" target="_blank">
<h6>
Massachusetts Institute of Technology
</h6>
</a>
<div class="py-1">
GPA:
<i>
<small>3.9 out of 5.0</small>
</i>
</div>
<div class="py-1 education-content">
<p>I Publiced two papers in the ACM SIGCHI Conference on Artificial Intelligence.</p>
<ul>
<li><a href="https://example.com">Fast and Accurate Object Detection with a Single Convolutional Neural Network</a></li>
<li>Face mask detection using a single convolutional neural network.</li>
</ul>
<p>Extracurricular Activities</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">
My academic record
</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">High School</h5>
<a href="https://example.org" target="_blank">
<h6>
Thomas Jefferson High School for Science and Technology.
</h6>
</a>
<div class="py-1">
GPA:
<i>
<small>4.2 out of 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">Projects</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">
A highly customizable and mobile first Hugo template for personal portfolio and blog.
</div>
</div>
<div class="card-footer py-3">
<span class="m-1 mx-2">
<a href="mailto:?subject=Hugo%20Profile%20Template&amp;body=Check%20it%20out:%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=Check&#43;it&#43;out:&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">
Demo
</a>
</span>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 my-3">
<div class="card my-3 h-100" title="Image Converter">
<div class="card-head">
<img class="card-img-top" src="/images/projects/converter.jpg" alt="Image Converter">
</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">Image Converter</h5>
<div class="card-text bg-transparent secondary-font">
A web app to convert image to pdf, png to jpg, png to jpg and png to webp without database using 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">
Demo
</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">
A clean and simple Hugo template for personal portfolio and 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">
Demo V2
</a>
</span>
</div>
</div>
</div>
</div>
</div>
</section>
<section id="achievements" class="py-5">
<div class="container">
<h3 class="text-center">Achievements</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="Google kickstart runner" 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">Google kickstart runner</h5>
<div class="card-text secondary-font">
I solved all problems with optimal solution.
</div>
</div>
</a>
</div>
<div class="col-lg-4 col-md-6 my-3">
<div class="card my-3 h-100 p-3" title="Facebook Hackathon Winner">
<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">Facebook Hackathon Winner</h5>
<div class="card-text secondary-font">
Developed a product using Artificial Intelligence.
</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">
Developed a theme and getting 1K&#43; downloads per month.
</div>
</div>
</a>
</div>
<div class="col-lg-4 col-md-6 my-3">
<div class="card my-3 h-100 p-3" title="Microsoft Imagine Runner">
<div class="card-body bg-transparent">
<h5 class="card-title bg-transparent">Microsoft Imagine Runner</h5>
<div class="card-text secondary-font">
We are developed a product which can help others.
</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">
Contributed to a open source project.
</div>
</div>
</a>
</div>
</div>
</div>
</div>
</section>
<section id="contact" class="py-5">
<div class="container">
<h3 class="text-center">Get in Touch</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">
My inbox is always open. Whether you have a question or just want to say hi, I’ll try my best to get back to you!
</div>
<div class="text-center pt-3">
<a
href='
mailto:gurusabarisha@gmail.com
'
target="_blank"
class="btn"
>
Mail me
</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="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>
Reference in a new issue Copy permalink