feat: update slides for DevoxxFR

Author: jsulpis

src/slides/0-intro/Title.astro

@@ -1,10 +1,15 @@
 ---
 import Slide from "../../components/Slide.astro";
 import introBackground from "./assets/intro-background.jpg";
+import devoxxLogo from "./assets/devoxx-logo.webp";
 ---
 
 <Slide data-background-image={introBackground.src} style="top: 0;">
 	<div class="content">
+		<span class="event">
+			<img data-src={devoxxLogo.src} alt="Devoxx Logo" />
+			<span class="date">17/04/2025</span>
+		</span>
 		<div class="title">
 			<h1>
 				Savez-vous <i>vraiment</i> ce qu'est la <strong>couleur</strong> ?
@@ -14,18 +19,17 @@ import introBackground from "./assets/intro-background.jpg";
 
 		<p class="speaker">
 			<span class="name">Julien Sulpis</span>
-			<span class="event">LyonJS #100</span>
-			<span class="date">21/02/2025</span>
 		</p>
 	</div>
 </Slide>
 
 <style lang="scss">
 	.content {
-		height: min(60dvh, 500px);
+		height: min(70dvh, 600px);
 		display: flex;
 		flex-direction: column;
 		justify-content: space-between;
+		margin-top: -10%;
 	}
 	p {
 		margin: 0;
@@ -52,8 +56,16 @@ import introBackground from "./assets/intro-background.jpg";
 		font-size: 1em;
 		font-weight: bold;
 	}
-	.event,
-	.date {
-		font-size: 0.7em;
+	.event {
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		gap: 1rem;
+		font-size: 0.9em;
+
+		img {
+			height: 12svh;
+			width: auto;
+		}
 	}
 </style>

src/slides/0-intro/assets/devoxx-logo.webp

@@ -10,6 +10,7 @@
 	import fragmentRgb from "../2-representation-of-colors/srgb/rgb-3d.frag";
 	import fragmentHsl from "../2-representation-of-colors/srgb/hsl-3d.frag";
 	import fragmentHsv from "../2-representation-of-colors/srgb/hsv-3d.frag";
+	import zenikaLogo from "./assets/zenika-logo.png";
 	import srgb from "../3-color-space-for-humans/assets/srgb.mov";
 	import { useGlslCanvas } from "../../webgl/renderer";
 
@@ -32,12 +33,12 @@
 			<a href="https://github.com/jsulpis" target="_blank">
 				<img data-src={github.src} alt="github" />
 			</a>
-			<a href="https://twitter.com/jsulpis" target="_blank">
-				<img data-src={twitter.src} alt="X" />
-			</a>
 			<a href="https://bsky.app/profile/jsulpis.bsky.social" target="_blank">
 				<img data-src={bluesky.src} alt="Bluesky" />
 			</a>
+			<a href="https://twitter.com/jsulpis" target="_blank">
+				<img data-src={twitter.src} alt="X" />
+			</a>
 			<a href="https://mastodon.social/@jsulpis" target="_blank">
 				<img data-src={mastodon.src} alt="Mastodon" />
 			</a>
@@ -48,9 +49,14 @@
 				<img data-src={shadertoy.src} alt="shadertoy" />
 			</a>
 		</div>
+		<a href="https://zenika.com">
+			<img class="zenika" data-src={zenikaLogo.src} alt="Zenika Logo" />
+		</a>
 	</div>
 
-	<img data-src={qrFeedback.src} alt="qr code for feedback" class="qr" />
+	<a href="https://bento.me/jsulpis-talk-color-science">
+		<img data-src={qrFeedback.src} alt="qr code for feedback" class="qr" />
+	</a>
 
 	<div class="color-spaces">
 		<canvas bind:this={canvasRgb} />
@@ -80,13 +86,14 @@
 	}
 	.me {
 		text-align: center;
+		padding-top: 5%;
 
 		h1 {
-			font-size: 3rem;
+			font-size: 3.5rem;
 			margin-bottom: 0;
 		}
 		strong {
-			font-size: 2rem;
+			font-size: 2.5rem;
 		}
 
 		.icons {
@@ -96,10 +103,14 @@
 			gap: 0.5em;
 		}
 		img {
-			height: 1em;
+			height: 0.8em;
 			object-fit: contain;
 		}
 	}
+	img.zenika {
+		height: 2em;
+		margin-top: 1em;
+	}
 	.qr {
 		width: min(40dvh, 100%);
 		aspect-ratio: 1;
@@ -127,6 +138,7 @@
 
 		&::before {
 			content: "";
+			pointer-events: none;
 			position: absolute;
 			width: 150%;
 			height: 250%;