using rocket instead of astro
This commit is contained in:
parent
eb72400722
commit
e61ef1d4c3
79 changed files with 4406 additions and 8501 deletions
26
templates/base.html
Normal file
26
templates/base.html
Normal file
|
|
@ -0,0 +1,26 @@
|
|||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8"/>
|
||||
<meta name="viewport" content="width=device-width"/>
|
||||
<title>{{ title|title }}</title>
|
||||
<link rel="stylesheet" href="/style.css">
|
||||
<link rel="apple-touch-icon" sizes="180x180" href="/apple-touch-icon.png">
|
||||
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png">
|
||||
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png">
|
||||
<link rel="manifest" href="/site.webmanifest">
|
||||
<link rel="mask-icon" href="/safari-pinned-tab.svg" color="#0c4a6e">
|
||||
<meta name="msapplication-TileColor" content="#0c4a6e">
|
||||
<meta name="theme-color" content="#0c4a6e">
|
||||
<script defer data-domain="philippeloctaux.com" src="https://plausible.y.z.x4m3.rocks/js/script.js"></script>
|
||||
</head>
|
||||
<body class="flex flex-col min-h-screen bg-gray-900 text-white">
|
||||
<div class="flex-grow">
|
||||
{% block container %}{% endblock %}
|
||||
</div>
|
||||
<footer class="bg-black">
|
||||
<div class="container mx-auto px-4 py-8">
|
||||
<p>© 2015 - {{ year }} Philippe Loctaux</p>
|
||||
</div>
|
||||
</footer>
|
||||
</body>
|
||||
</html>
|
||||
10
templates/content.html
Normal file
10
templates/content.html
Normal file
|
|
@ -0,0 +1,10 @@
|
|||
{% extends "base.html" %}
|
||||
|
||||
{% block container %}
|
||||
<main class="container mx-auto px-4 py-16">
|
||||
<h1 class="text-3xl sm:text-4xl font-bold">{{ title }}</h1>
|
||||
<div class="mt-8">
|
||||
{% block content %}{% endblock %}
|
||||
</div>
|
||||
</main>
|
||||
{% endblock %}
|
||||
11
templates/icons/calendar.html
Normal file
11
templates/icons/calendar.html
Normal file
|
|
@ -0,0 +1,11 @@
|
|||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 20 20"
|
||||
fill="currentColor"
|
||||
class="w-5 h-5"
|
||||
>
|
||||
<path
|
||||
fill-rule="evenodd"
|
||||
d="M5.75 2a.75.75 0 01.75.75V4h7V2.75a.75.75 0 011.5 0V4h.25A2.75 2.75 0 0118 6.75v8.5A2.75 2.75 0 0115.25 18H4.75A2.75 2.75 0 012 15.25v-8.5A2.75 2.75 0 014.75 4H5V2.75A.75.75 0 015.75 2zm-1 5.5c-.69 0-1.25.56-1.25 1.25v6.5c0 .69.56 1.25 1.25 1.25h10.5c.69 0 1.25-.56 1.25-1.25v-6.5c0-.69-.56-1.25-1.25-1.25H4.75z"
|
||||
clip-rule="evenodd"></path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 547 B |
14
templates/icons/email.html
Normal file
14
templates/icons/email.html
Normal file
|
|
@ -0,0 +1,14 @@
|
|||
<svg
|
||||
class="w-6 h-6 mr-0 sm:mr-2"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke-width="1.5"
|
||||
stroke="currentColor"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
d="M21.75 6.75v10.5a2.25 2.25 0 01-2.25 2.25h-15a2.25 2.25 0 01-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0019.5 4.5h-15a2.25 2.25 0 00-2.25 2.25m19.5 0v.243a2.25 2.25 0 01-1.07 1.916l-7.5 4.615a2.25 2.25 0 01-2.36 0L3.32 8.91a2.25 2.25 0 01-1.07-1.916V6.75"
|
||||
></path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 556 B |
9
templates/icons/github.html
Normal file
9
templates/icons/github.html
Normal file
|
|
@ -0,0 +1,9 @@
|
|||
<svg
|
||||
class="w-6 h-6 fill-current mr-0 sm:mr-2"
|
||||
viewBox="0 0 24 24"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"
|
||||
></path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 887 B |
13
templates/icons/link.html
Normal file
13
templates/icons/link.html
Normal file
|
|
@ -0,0 +1,13 @@
|
|||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 20 20"
|
||||
fill="currentColor"
|
||||
class="w-5 h-5 fill-current mr-2"
|
||||
>
|
||||
<path
|
||||
d="M12.232 4.232a2.5 2.5 0 013.536 3.536l-1.225 1.224a.75.75 0 001.061 1.06l1.224-1.224a4 4 0 00-5.656-5.656l-3 3a4 4 0 00.225 5.865.75.75 0 00.977-1.138 2.5 2.5 0 01-.142-3.667l3-3z"
|
||||
></path>
|
||||
<path
|
||||
d="M11.603 7.963a.75.75 0 00-.977 1.138 2.5 2.5 0 01.142 3.667l-3 3a2.5 2.5 0 01-3.536-3.536l1.225-1.224a.75.75 0 00-1.061-1.06l-1.224 1.224a4 4 0 105.656 5.656l3-3a4 4 0 00-.225-5.865z"
|
||||
></path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 596 B |
9
templates/icons/linkedin.html
Normal file
9
templates/icons/linkedin.html
Normal file
|
|
@ -0,0 +1,9 @@
|
|||
<svg
|
||||
class="w-6 h-6 fill-current mr-0 sm:mr-2"
|
||||
viewBox="0 0 24 24"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M20.447 20.452h-3.554v-5.569c0-1.328-.027-3.037-1.852-3.037-1.853 0-2.136 1.445-2.136 2.939v5.667H9.351V9h3.414v1.561h.046c.477-.9 1.637-1.85 3.37-1.85 3.601 0 4.267 2.37 4.267 5.455v6.286zM5.337 7.433c-1.144 0-2.063-.926-2.063-2.065 0-1.138.92-2.063 2.063-2.063 1.14 0 2.064.925 2.064 2.063 0 1.139-.925 2.065-2.064 2.065zm1.782 13.019H3.555V9h3.564v11.452zM22.225 0H1.771C.792 0 0 .774 0 1.729v20.542C0 23.227.792 24 1.771 24h20.451C23.2 24 24 23.227 24 22.271V1.729C24 .774 23.2 0 22.222 0h.003z"
|
||||
></path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 673 B |
11
templates/icons/location.html
Normal file
11
templates/icons/location.html
Normal file
|
|
@ -0,0 +1,11 @@
|
|||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 20 20"
|
||||
fill="currentColor"
|
||||
class="w-5 h-5"
|
||||
>
|
||||
<path
|
||||
fill-rule="evenodd"
|
||||
d="M9.69 18.933l.003.001C9.89 19.02 10 19 10 19s.11.02.308-.066l.002-.001.006-.003.018-.008a5.741 5.741 0 00.281-.14c.186-.096.446-.24.757-.433.62-.384 1.445-.966 2.274-1.765C15.302 14.988 17 12.493 17 9A7 7 0 103 9c0 3.492 1.698 5.988 3.355 7.584a13.731 13.731 0 002.273 1.765 11.842 11.842 0 00.976.544l.062.029.018.008.006.003zM10 11.25a2.25 2.25 0 100-4.5 2.25 2.25 0 000 4.5z"
|
||||
clip-rule="evenodd"></path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 613 B |
9
templates/icons/mastodon.html
Normal file
9
templates/icons/mastodon.html
Normal file
|
|
@ -0,0 +1,9 @@
|
|||
<svg
|
||||
class="w-6 h-6 fill-current mr-0 sm:mr-2"
|
||||
viewBox="0 0 24 24"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M23.268 5.313c-.35-2.578-2.617-4.61-5.304-5.004C17.51.242 15.792 0 11.813 0h-.03c-3.98 0-4.835.242-5.288.309C3.882.692 1.496 2.518.917 5.127.64 6.412.61 7.837.661 9.143c.074 1.874.088 3.745.26 5.611.118 1.24.325 2.47.62 3.68.55 2.237 2.777 4.098 4.96 4.857 2.336.792 4.849.923 7.256.38.265-.061.527-.132.786-.213.585-.184 1.27-.39 1.774-.753a.057.057 0 0 0 .023-.043v-1.809a.052.052 0 0 0-.02-.041.053.053 0 0 0-.046-.01 20.282 20.282 0 0 1-4.709.545c-2.73 0-3.463-1.284-3.674-1.818a5.593 5.593 0 0 1-.319-1.433.053.053 0 0 1 .066-.054c1.517.363 3.072.546 4.632.546.376 0 .75 0 1.125-.01 1.57-.044 3.224-.124 4.768-.422.038-.008.077-.015.11-.024 2.435-.464 4.753-1.92 4.989-5.604.008-.145.03-1.52.03-1.67.002-.512.167-3.63-.024-5.545zm-3.748 9.195h-2.561V8.29c0-1.309-.55-1.976-1.67-1.976-1.23 0-1.846.79-1.846 2.35v3.403h-2.546V8.663c0-1.56-.617-2.35-1.848-2.35-1.112 0-1.668.668-1.67 1.977v6.218H4.822V8.102c0-1.31.337-2.35 1.011-3.12.696-.77 1.608-1.164 2.74-1.164 1.311 0 2.302.5 2.962 1.498l.638 1.06.638-1.06c.66-.999 1.65-1.498 2.96-1.498 1.13 0 2.043.395 2.74 1.164.675.77 1.012 1.81 1.012 3.12z"
|
||||
></path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.2 KiB |
9
templates/icons/telegram.html
Normal file
9
templates/icons/telegram.html
Normal file
|
|
@ -0,0 +1,9 @@
|
|||
<svg
|
||||
class="w-6 h-6 fill-current mr-0 sm:mr-2"
|
||||
viewBox="0 0 24 24"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M11.944 0A12 12 0 0 0 0 12a12 12 0 0 0 12 12 12 12 0 0 0 12-12A12 12 0 0 0 12 0a12 12 0 0 0-.056 0zm4.962 7.224c.1-.002.321.023.465.14a.506.506 0 0 1 .171.325c.016.093.036.306.02.472-.18 1.898-.962 6.502-1.36 8.627-.168.9-.499 1.201-.82 1.23-.696.065-1.225-.46-1.9-.902-1.056-.693-1.653-1.124-2.678-1.8-1.185-.78-.417-1.21.258-1.91.177-.184 3.247-2.977 3.307-3.23.007-.032.014-.15-.056-.212s-.174-.041-.249-.024c-.106.024-1.793 1.14-5.061 3.345-.48.33-.913.49-1.302.48-.428-.008-1.252-.241-1.865-.44-.752-.245-1.349-.374-1.297-.789.027-.216.325-.437.893-.663 3.498-1.524 5.83-2.529 6.998-3.014 3.332-1.386 4.025-1.627 4.476-1.635z"
|
||||
></path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 805 B |
9
templates/icons/twitter.html
Normal file
9
templates/icons/twitter.html
Normal file
|
|
@ -0,0 +1,9 @@
|
|||
<svg
|
||||
class="w-6 h-6 fill-current mr-0 sm:mr-2"
|
||||
viewBox="0 0 24 24"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M23.953 4.57a10 10 0 01-2.825.775 4.958 4.958 0 002.163-2.723c-.951.555-2.005.959-3.127 1.184a4.92 4.92 0 00-8.384 4.482C7.69 8.095 4.067 6.13 1.64 3.162a4.822 4.822 0 00-.666 2.475c0 1.71.87 3.213 2.188 4.096a4.904 4.904 0 01-2.228-.616v.06a4.923 4.923 0 003.946 4.827 4.996 4.996 0 01-2.212.085 4.936 4.936 0 004.604 3.417 9.867 9.867 0 01-6.102 2.105c-.39 0-.779-.023-1.17-.067a13.995 13.995 0 007.557 2.209c9.053 0 13.998-7.496 13.998-13.985 0-.21 0-.42-.015-.63A9.935 9.935 0 0024 4.59z"
|
||||
></path>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 666 B |
5
templates/pages/404.html
Normal file
5
templates/pages/404.html
Normal file
|
|
@ -0,0 +1,5 @@
|
|||
{% extends "content.html" %}
|
||||
|
||||
{% block content %}
|
||||
<p>This page could not be found.</p>
|
||||
{% endblock %}
|
||||
25
templates/pages/email.html
Normal file
25
templates/pages/email.html
Normal file
|
|
@ -0,0 +1,25 @@
|
|||
{% extends "content.html" %}
|
||||
|
||||
{% block content %}
|
||||
<p>Send an email if you want to work with me, propose a project idea, or just to say hi!</p>
|
||||
|
||||
<div class="my-4">
|
||||
<a
|
||||
href="mailto:helloATphilippeloctauxDOTcom"
|
||||
class="inline-flex bg-sky-900 hover:bg-sky-700 transition-all duration-200 text-white font-bold py-2 px-4 rounded-xl items-center"
|
||||
>
|
||||
<div class="inline-flex items-center">
|
||||
{% include "icons/email.html" %}
|
||||
<span class="ml-2 sm:ml-0 text-center">hello at philippeloctaux dot com</span>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<p class="mb-2">
|
||||
If you want to encrypt your message, I have a
|
||||
<a href="/pub/pgp-0x69771CD04BA82EC0.txt" class="underline">pgp key</a> at your disposal.
|
||||
</p>
|
||||
<p class="mb-2">
|
||||
I also have a <a href="/keybase.txt" class="underline">Keybase</a> account, but I do not check it often.
|
||||
</p>
|
||||
{% endblock %}
|
||||
15
templates/pages/root.html
Normal file
15
templates/pages/root.html
Normal file
|
|
@ -0,0 +1,15 @@
|
|||
{% extends "base.html" %}
|
||||
|
||||
{% block container %}
|
||||
{% include "pages/root/hero-image.html" %}
|
||||
<main class="container mx-auto px-4 md:px-8 lg:px-16 py-16">
|
||||
{% include "pages/root/whoami.html" %}
|
||||
<div class="my-16 space-y-16 md:space-y-32">
|
||||
{% include "pages/root/www.html" %}
|
||||
{% include "pages/root/jobs.html" %}
|
||||
{% include "pages/root/projects.html" %}
|
||||
{% include "pages/root/talks.html" %}
|
||||
{% include "pages/root/friends.html" %}
|
||||
</div>
|
||||
</main>
|
||||
{% endblock %}
|
||||
24
templates/pages/root/friends.html
Normal file
24
templates/pages/root/friends.html
Normal file
|
|
@ -0,0 +1,24 @@
|
|||
<div>
|
||||
<h1 class="text-4xl font-bold mb-4">Friends</h1>
|
||||
<p class="text-lg">Folks I worked with, or I like what they do.</p>
|
||||
|
||||
<ul class="mt-4 grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 sm:gap-4">
|
||||
{% for friend in friends %}
|
||||
<li class="py-2">
|
||||
<a
|
||||
href={{friend.uri}}
|
||||
target="_blank"
|
||||
class="hover:bg-gray-500 transition-all duration-200 flex items-center rounded-lg p-2"
|
||||
>
|
||||
<span class="rounded-full flex-shrink-0 mr-4 w-10 h-10 bg-sky-900 text-white flex items-center justify-center text-lg font-medium"
|
||||
>{{ friend.initials() }}</span
|
||||
>
|
||||
<div>
|
||||
<p class="font-bold">{{ friend.first_name }} {{ friend.last_name }}</p>
|
||||
<p>{{ friend.domain_name() }}</p>
|
||||
</div>
|
||||
</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
8
templates/pages/root/hero-content.html
Normal file
8
templates/pages/root/hero-content.html
Normal file
|
|
@ -0,0 +1,8 @@
|
|||
<div class="container mx-auto px-8 py-16 w-full h-full justify-center items-center flex flex-col">
|
||||
<div class="inline-block backdrop-blur-lg backdrop-brightness-75 rounded-3xl shadow-2xl px-4 py-6 sm:px-8 sm:py-12 space-y-4">
|
||||
<h1 class="text-3xl sm:text-4xl font-bold">Philippe Loctaux</h1>
|
||||
<h2 class="sm:text-xl font-semibold">
|
||||
Developer of all sorts. Epitech alumni, class of 2023.
|
||||
</h2>
|
||||
</div>
|
||||
</div>
|
||||
70
templates/pages/root/hero-image.html
Normal file
70
templates/pages/root/hero-image.html
Normal file
|
|
@ -0,0 +1,70 @@
|
|||
<style>
|
||||
/* Fixed background when scrolling in tailwind
|
||||
* Disabled on iOS devices
|
||||
|
||||
* https://tailwindcss.com/docs/background-attachment
|
||||
* https://stackoverflow.com/a/60220757/4809297
|
||||
*/
|
||||
|
||||
@supports (-webkit-touch-callout: none) {
|
||||
/* CSS specific to iOS devices */
|
||||
#wallpaper {
|
||||
background-attachment: scroll;
|
||||
}
|
||||
}
|
||||
|
||||
@supports not (-webkit-touch-callout: none) {
|
||||
/* CSS for other than iOS devices */
|
||||
#wallpaper {
|
||||
background-attachment: fixed;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="bg-gradient-to-r from-red-900 via-teal-900 to-fuchsia-900">
|
||||
{% let wallpaper_uri -%}
|
||||
{% match wallpaper %}
|
||||
{% when Some with (wallpaper) %}
|
||||
{% let wallpaper_uri = wallpaper.file -%}
|
||||
{% when None %}
|
||||
{% let wallpaper_uri = "" -%}
|
||||
{% endmatch %}
|
||||
|
||||
<div
|
||||
id="wallpaper"
|
||||
class="relative text-white w-full h-almostscreen bg-center bg-cover"
|
||||
style="background-image: url({{ wallpaper_uri }});"
|
||||
>
|
||||
<!-- Content inside -->
|
||||
{% include "pages/root/hero-content.html" %}
|
||||
|
||||
{% match wallpaper %}
|
||||
{% when Some with (wallpaper) %}
|
||||
<!-- Exif info -->
|
||||
<div
|
||||
class="absolute bottom-3 sm:bottom-5 left-2 sm:left-5 inline-block backdrop-blur-lg backdrop-brightness-75 rounded-xl shadow-2xl p-2 space-y-0.5 sm:space-y-2"
|
||||
>
|
||||
<!-- Location -->
|
||||
<div class="flex">
|
||||
<div class="inline-flex items-center">
|
||||
{% include "icons/location.html" %}
|
||||
<span class="ml-1 text-sm"
|
||||
>{{ wallpaper.location.precise }}<span class="hidden md:inline"
|
||||
>, {{ wallpaper.location.broad }}</span
|
||||
></span
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Date -->
|
||||
<div class="flex">
|
||||
<div class="inline-flex items-center">
|
||||
{% include "icons/calendar.html" %}
|
||||
<span class="ml-1 text-sm">{{ wallpaper.date }}</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{% when None %}
|
||||
{% endmatch %}
|
||||
</div>
|
||||
</div>
|
||||
64
templates/pages/root/jobs.html
Normal file
64
templates/pages/root/jobs.html
Normal file
|
|
@ -0,0 +1,64 @@
|
|||
<div>
|
||||
<h1 class="text-4xl font-bold mb-4">Professional Experiences</h1>
|
||||
|
||||
<div class="mt-4 grid grid-cols-1 sm:grid-cols-2 gap-4">
|
||||
{% for job in jobs %}
|
||||
|
||||
<div class="w-full rounded-2xl bg-sky-950">
|
||||
|
||||
<div class="p-6 justify-between h-full">
|
||||
|
||||
<!-- Header -->
|
||||
<div class="flex flex-col">
|
||||
<div class="flex flex-row">
|
||||
{% let css -%}
|
||||
{# If css updates make sure to update in both places! #}
|
||||
{% if job.logo.transparent_background == true -%}
|
||||
{% let css = "h-16 w-16 rounded-xl mr-4 p-2 bg-white" -%}
|
||||
{% else -%}
|
||||
{% let css = "h-16 w-16 rounded-xl mr-4" -%}
|
||||
{% endif -%}
|
||||
<img loading="lazy" src="{{ job.logo.file }}" alt="{{ job.company }} logo" class="{{ css }}">
|
||||
<div class="flex flex-col justify-evenly">
|
||||
<div class="text-xl md:text-2xl font-semibold">{{ job.company }}</div>
|
||||
<div class="text-xs md:text-sm">{{ job.dates }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<p class="text-xl md:text-2xl font-semibold my-4">{{ job.title }}</p>
|
||||
</div>
|
||||
|
||||
<!-- Content -->
|
||||
<div class="space-y-2">
|
||||
<!-- Description -->
|
||||
{% for desc in job.description %}
|
||||
<p>{{ desc }}</p>
|
||||
{% endfor %}
|
||||
|
||||
<!-- Accomplishments -->
|
||||
<div>
|
||||
<ul class="list-disc mt-6">
|
||||
{% for accomplishment in job.accomplishments %}
|
||||
<li class="ml-5">{{ accomplishment }}</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<!-- Technologies -->
|
||||
<div>
|
||||
<div class="text-xl font-semibold mt-8 mb-2">
|
||||
Technologies
|
||||
</div>
|
||||
<ul>
|
||||
{% for technology in job.technologies %}
|
||||
<li>{{ technology }}</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
108
templates/pages/root/project-with-image.html
Normal file
108
templates/pages/root/project-with-image.html
Normal file
|
|
@ -0,0 +1,108 @@
|
|||
{% let css_image_position -%}
|
||||
{% let css_image_position_corner -%}
|
||||
{# If css updates make sure to update in both places! #}
|
||||
{% match project.image.position %}
|
||||
|
||||
{% when Position::Left %}
|
||||
{% let css_image_position = "2xl:flex items-stretch justify-between" -%}
|
||||
{% let css_image_position_corner = "flex w-full 2xl:w-1/2 grow rounded-t-2xl object-cover 2xl:rounded-tr-none 2xl:rounded-l-2xl" -%}
|
||||
|
||||
{% when Position::Right %}
|
||||
{% let css_image_position = "2xl:flex items-stretch justify-between 2xl:flex-row-reverse" -%}
|
||||
{% let css_image_position_corner = "flex w-full 2xl:w-1/2 grow rounded-t-2xl object-cover 2xl:rounded-tl-none 2xl:rounded-r-2xl" -%}
|
||||
|
||||
{% endmatch %}
|
||||
<div class="w-full rounded-2xl bg-pink-950 {{ css_image_position }}">
|
||||
|
||||
<!-- Image on the side -->
|
||||
<img loading="lazy" src="{{ project.image.file }}" alt="{{ project.name }} image" class="{{ css_image_position_corner }}">
|
||||
|
||||
<div class="p-6 flex flex-col grow-0 justify-between h-full">
|
||||
|
||||
<!-- Header -->
|
||||
<div class="flex flex-col">
|
||||
<div class="flex flex-row">
|
||||
{% match project.logo %}
|
||||
{% when Some with (logo) %}
|
||||
|
||||
{% let css_logo -%}
|
||||
{# If css updates make sure to update in both places! #}
|
||||
{% if logo.transparent_background == true -%}
|
||||
{% let css_logo = "h-16 w-16 rounded-xl mr-4 p-2 bg-white" -%}
|
||||
{% else -%}
|
||||
{% let css_logo = "h-16 w-16 rounded-xl mr-4" -%}
|
||||
{% endif -%}
|
||||
<img loading="lazy" src="{{ logo.file }}" alt="{{ project.name }} logo" class="{{ css_logo }}">
|
||||
|
||||
{% when None %}
|
||||
{% endmatch %}
|
||||
|
||||
<div class="flex flex-col justify-evenly">
|
||||
<div class="text-xl md:text-2xl font-semibold">{{ project.name }}</div>
|
||||
<div class="text-xs md:text-sm">{{ project.dates }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<p class="text-xl md:text-2xl font-semibold my-4">{{ project.tagline }}</p>
|
||||
</div>
|
||||
|
||||
<!-- Content -->
|
||||
<div class="space-y-2">
|
||||
<!-- Description -->
|
||||
{% for desc in project.description %}
|
||||
<p>{{ desc }}</p>
|
||||
{% endfor %}
|
||||
|
||||
<!-- Accomplishments -->
|
||||
<div>
|
||||
<ul class="list-disc mt-6">
|
||||
{% for accomplishment in project.accomplishments %}
|
||||
<li class="ml-5">{{ accomplishment }}</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<!-- Technologies -->
|
||||
<div>
|
||||
<div class="text-xl font-semibold mt-8 mb-2">
|
||||
Technologies
|
||||
</div>
|
||||
<ul>
|
||||
{% for technology in project.technologies %}
|
||||
<li>{{ technology }}</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Link with label -->
|
||||
{% match project.link %}
|
||||
|
||||
{% when Some with (link) %}
|
||||
{% match link %}
|
||||
|
||||
{% when ProjectLink::Available(project_link) %}
|
||||
<a
|
||||
href="{{ project_link.uri }}"
|
||||
target="_blank"
|
||||
class="mt-4 inline-flex max-w-fit bg-transparent hover:bg-sky-700 text-white font-semibold py-1.5 px-4 rounded-xl items-center border border-white hover:border-transparent transition-all duration-200"
|
||||
>
|
||||
<div class="inline-flex items-center">
|
||||
{% include "icons/link.html" %}
|
||||
<span>{{ project_link.label }}</span>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<!-- Link is not available -->
|
||||
{% when ProjectLink::NotAvailable %}
|
||||
<span class="mt-4 cursor-not-allowed inline-flex max-w-fit bg-gray-400 text-gray-600 font-semibold py-1.5 px-4 rounded-xl items-center">
|
||||
No longer available
|
||||
</span>
|
||||
|
||||
{% endmatch %}
|
||||
<!-- No link -->
|
||||
{% when None %}
|
||||
{% endmatch %}
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
91
templates/pages/root/project-without-image.html
Normal file
91
templates/pages/root/project-without-image.html
Normal file
|
|
@ -0,0 +1,91 @@
|
|||
<div class="w-full rounded-2xl bg-pink-950">
|
||||
|
||||
<div class="p-6 justify-between h-full">
|
||||
|
||||
<!-- Header -->
|
||||
<div class="flex flex-col">
|
||||
<div class="flex flex-row">
|
||||
{% match project.logo %}
|
||||
{% when Some with (logo) %}
|
||||
|
||||
{% let css_logo -%}
|
||||
{# If css updates make sure to update in both places! #}
|
||||
{% if logo.transparent_background == true -%}
|
||||
{% let css_logo = "h-16 w-16 rounded-xl mr-4 p-2 bg-white" -%}
|
||||
{% else -%}
|
||||
{% let css_logo = "h-16 w-16 rounded-xl mr-4" -%}
|
||||
{% endif -%}
|
||||
<img loading="lazy" src="{{ logo.file }}" alt="{{ project.name }} logo" class="{{ css_logo }}">
|
||||
|
||||
{% when None %}
|
||||
{% endmatch %}
|
||||
|
||||
<div class="flex flex-col justify-evenly">
|
||||
<div class="text-xl md:text-2xl font-semibold">{{ project.name }}</div>
|
||||
<div class="text-xs md:text-sm">{{ project.dates }}</div>
|
||||
</div>
|
||||
</div>
|
||||
<p class="text-xl md:text-2xl font-semibold my-4">{{ project.tagline }}</p>
|
||||
</div>
|
||||
|
||||
<!-- Content -->
|
||||
<div class="space-y-2">
|
||||
<!-- Description -->
|
||||
{% for desc in project.description %}
|
||||
<p>{{ desc }}</p>
|
||||
{% endfor %}
|
||||
|
||||
<!-- Accomplishments -->
|
||||
<div>
|
||||
<ul class="list-disc mt-6">
|
||||
{% for accomplishment in project.accomplishments %}
|
||||
<li class="ml-5">{{ accomplishment }}</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<!-- Technologies -->
|
||||
<div>
|
||||
<div class="text-xl font-semibold mt-8 mb-2">
|
||||
Technologies
|
||||
</div>
|
||||
<ul>
|
||||
{% for technology in project.technologies %}
|
||||
<li>{{ technology }}</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Link with label -->
|
||||
{% match project.link %}
|
||||
|
||||
{% when Some with (link) %}
|
||||
{% match link %}
|
||||
|
||||
{% when ProjectLink::Available(project_link) %}
|
||||
<a
|
||||
href="{{ project_link.uri }}"
|
||||
target="_blank"
|
||||
class="mt-4 inline-flex max-w-fit bg-transparent hover:bg-sky-700 text-white font-semibold py-1.5 px-4 rounded-xl items-center border border-white hover:border-transparent transition-all duration-200"
|
||||
>
|
||||
<div class="inline-flex items-center">
|
||||
{% include "icons/link.html" %}
|
||||
<span>{{ project_link.label }}</span>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<!-- Link is not available -->
|
||||
{% when ProjectLink::NotAvailable %}
|
||||
<span class="mt-4 cursor-not-allowed inline-flex max-w-fit bg-gray-400 text-gray-600 font-semibold py-1.5 px-4 rounded-xl items-center">
|
||||
No longer available
|
||||
</span>
|
||||
|
||||
{% endmatch %}
|
||||
<!-- No link -->
|
||||
{% when None %}
|
||||
{% endmatch %}
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
23
templates/pages/root/projects.html
Normal file
23
templates/pages/root/projects.html
Normal file
|
|
@ -0,0 +1,23 @@
|
|||
<div>
|
||||
<h1 class="text-4xl font-bold mb-4">Projects</h1>
|
||||
|
||||
<div class="mt-4 space-y-4">
|
||||
|
||||
{% for project in projects %}
|
||||
|
||||
{% match project %}
|
||||
{% when ProjectKind::WithoutImage((project1, project2)) %}
|
||||
<div class="flex flex-col space-y-4 md:flex-row md:space-x-4 md:space-y-0">
|
||||
{% let project = project1 -%}
|
||||
{% include "pages/root/project-without-image.html" %}
|
||||
|
||||
{% let project = project2 -%}
|
||||
{% include "pages/root/project-without-image.html" %}
|
||||
</div>
|
||||
{% when ProjectKind::WithImage(project) %}
|
||||
{% include "pages/root/project-with-image.html" %}
|
||||
{% endmatch %}
|
||||
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
46
templates/pages/root/talks.html
Normal file
46
templates/pages/root/talks.html
Normal file
|
|
@ -0,0 +1,46 @@
|
|||
<div>
|
||||
<h1 class="text-4xl font-bold mb-4">Talks</h1>
|
||||
<p class="text-lg">
|
||||
Giving a talk is the opportunity to share what I know, and helps me
|
||||
reduce my fear of public speaking.
|
||||
</p>
|
||||
|
||||
<div class="mt-4 grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6 place-content-center">
|
||||
|
||||
{% for talk in talks %}
|
||||
<div class="rounded-2xl w-full bg-teal-950 p-6">
|
||||
|
||||
<!-- Title -->
|
||||
<h3 class="text-xl font-semibold mb-4">{{talk.title}}</h3>
|
||||
|
||||
<!-- Date -->
|
||||
<div class="flex">
|
||||
<div class="inline-flex items-center">
|
||||
{% include "icons/calendar.html" %}
|
||||
<span class="ml-2">{{talk.date}}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Location -->
|
||||
<div class="flex">
|
||||
<div class="inline-flex items-center">
|
||||
{% include "icons/location.html" %}
|
||||
<span class="ml-2">{{talk.location}}</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Link with label -->
|
||||
<a
|
||||
href={{talk.link.uri}}
|
||||
target="_blank"
|
||||
class="mt-4 inline-flex bg-transparent hover:bg-sky-700 text-white font-semibold py-1.5 px-4 rounded-xl items-center border border-white hover:border-transparent transition-all duration-200"
|
||||
>
|
||||
<div class="inline-flex items-center">
|
||||
{% include "icons/link.html" %}
|
||||
<span>{{talk.link.label}}</span>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
</div>
|
||||
39
templates/pages/root/whoami.html
Normal file
39
templates/pages/root/whoami.html
Normal file
|
|
@ -0,0 +1,39 @@
|
|||
<div class="md:flex md:flex-row-reverse items-center">
|
||||
<div class="md:w-1/2 mb-4 md:mb-0">
|
||||
<img
|
||||
src="/pub/phil.png"
|
||||
alt="Phil"
|
||||
class="rounded-3xl bg-sky-900 h-36 w-36 md:mx-auto md:h-56 md:w-56 lg:h-64 lg:w-64 mb-2 md:mb-0"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div class="md:w-1/2">
|
||||
<h1 class="text-4xl font-bold mb-4">About Phil</h1>
|
||||
<h2 class="text-2xl font-semibold mb-4">Developer of all sorts</h2>
|
||||
|
||||
<div class="text-lg space-y-6">
|
||||
<p>
|
||||
I got into computer science by learning about the Linux kernel and administrating servers.
|
||||
</p>
|
||||
<p>
|
||||
After high school, I became a student at Epitech and learned to
|
||||
tackle technical concepts and apply them quickly by working
|
||||
on small projects.
|
||||
</p>
|
||||
<p>
|
||||
During my studies at Epitech, I had the opportunity to be a
|
||||
teacher. My role was to assist students with technical problems
|
||||
in their projects.
|
||||
</p>
|
||||
<p>
|
||||
Now I have experience in software engineering, full-stack web
|
||||
and mobile development, system administration and CI/CD, as well
|
||||
as embedded development.
|
||||
</p>
|
||||
<p>
|
||||
My goal is to use my knowledge and experience to make software
|
||||
helping its users accomplish their needs.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
39
templates/pages/root/www.html
Normal file
39
templates/pages/root/www.html
Normal file
|
|
@ -0,0 +1,39 @@
|
|||
<div class="grid grid-cols-3 lg:grid-cols-6 gap-4 place-content-center">
|
||||
{% for network in networks %}
|
||||
<div class="w-full h-auto md:w-auto">
|
||||
<div class="text-center">
|
||||
<a
|
||||
target="_blank"
|
||||
href="{{ network.uri }}"
|
||||
class="inline-flex bg-sky-900 hover:bg-sky-700 transition-all duration-200 text-white font-bold py-2 px-4 rounded-xl items-center"
|
||||
>
|
||||
{% match network.icon %}
|
||||
|
||||
{% when Icon::Email %}
|
||||
{% include "icons/email.html" %}
|
||||
|
||||
{% when Icon::Github %}
|
||||
{% include "icons/github.html" %}
|
||||
|
||||
{% when Icon::Linkedin %}
|
||||
{% include "icons/linkedin.html" %}
|
||||
|
||||
{% when Icon::Mastodon %}
|
||||
{% include "icons/mastodon.html" %}
|
||||
|
||||
{% when Icon::Telegram %}
|
||||
{% include "icons/telegram.html" %}
|
||||
|
||||
{% when Icon::Twitter %}
|
||||
{% include "icons/twitter.html" %}
|
||||
|
||||
{% endmatch %}
|
||||
|
||||
<div class="inline-flex items-center">
|
||||
<span class="hidden sm:inline">{{ network.name }}</span>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
{% endfor %}
|
||||
</div>
|
||||
Loading…
Add table
Add a link
Reference in a new issue