From e2df8d04e0489a6c83dacb7c09656f5610e978be Mon Sep 17 00:00:00 2001
From: isUnknown <adrien.payet@outlook.com>
Date: Sat, 21 Mar 2026 09:28:36 +0100
Subject: [PATCH] feat(about): team members cliquables si champ link rempli +
 fix ARIA warning

closes #3

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 site/templates/about.json.php |  1 +
 src/views/About.svelte        | 29 ++++++++++++++++++++---------
 src/views/WhitePaper.svelte   |  6 +++---
 3 files changed, 24 insertions(+), 12 deletions(-)

diff --git a/site/templates/about.json.php b/site/templates/about.json.php
index f7b3307..2ed1ccb 100644
--- a/site/templates/about.json.php
+++ b/site/templates/about.json.php
@@ -19,6 +19,7 @@ $specificData = [
             'name'  => $file->memberName()->value(),
             'role'  => $file->role()->value(),
             'photo' => $file->url(),
+            'link'  => $file->link()->value() ?: null,
         ];
     })->values()
 ];
diff --git a/src/views/About.svelte b/src/views/About.svelte
index f96cbf9..75ca814 100644
--- a/src/views/About.svelte
+++ b/src/views/About.svelte
@@ -107,6 +107,7 @@
         <div class="team-carousel-container">
           <div
             class="team-grid"
+            role="list"
             style="transform: translateX(-{carouselOffset}px)"
             ontouchstart={(e) => { touchStartX = e.touches[0].clientX }}
             ontouchend={(e) => {
@@ -117,13 +118,23 @@
             }}
           >
             {#each members as member}
-              <div class="team-member">
-                {#if member.photo}
-                  <img src={member.photo} alt={member.name} class="team-member-image" draggable="false" />
-                {/if}
-                <h4 class="team-member-name">{member.name}</h4>
-                <p class="team-member-title">{member.role}</p>
-              </div>
+              {#if member.link}
+                <a href={member.link} target="_blank" rel="noopener noreferrer" class="team-member" role="listitem">
+                  {#if member.photo}
+                    <img src={member.photo} alt={member.name} class="team-member-image" draggable="false" />
+                  {/if}
+                  <h4 class="team-member-name">{member.name}</h4>
+                  <p class="team-member-title">{member.role}</p>
+                </a>
+              {:else}
+                <div class="team-member" role="listitem">
+                  {#if member.photo}
+                    <img src={member.photo} alt={member.name} class="team-member-image" draggable="false" />
+                  {/if}
+                  <h4 class="team-member-name">{member.name}</h4>
+                  <p class="team-member-title">{member.role}</p>
+                </div>
+              {/if}
             {/each}
           </div>
         </div>
@@ -297,7 +308,7 @@
     transition: transform 0.3s ease;
   }
 
-  .team-member:hover {
+  a.team-member:hover {
     transform: translateY(-5px);
   }
 
@@ -310,7 +321,7 @@
     transition: transform 0.3s ease;
   }
 
-  .team-member-image:hover {
+  a.team-member .team-member-image:hover {
     transform: scale(1.03);
   }
 
diff --git a/src/views/WhitePaper.svelte b/src/views/WhitePaper.svelte
index aefd2b3..12cb5c7 100644
--- a/src/views/WhitePaper.svelte
+++ b/src/views/WhitePaper.svelte
@@ -21,7 +21,7 @@
   })
   
   let isDownloadable = $derived.by(() => {
-    return firstName.length > 0 && lastName.length > 0 && email.length > 0 && isEmailValid && consent
+    return firstName.length > 0 && lastName.length > 0 && company.length > 0 && role.length > 0 && email.length > 0 && isEmailValid && consent
   })
 
   async function handleSubmit(e) {
@@ -93,8 +93,8 @@
             <input class="input" type="text" placeholder={t('wp_firstname')} bind:value={firstName} required />
             <input class="input" type="text" placeholder={t('wp_lastname')} bind:value={lastName} required />
           </div>
-          <input class="input" type="text" placeholder={t('wp_company')} bind:value={company} />
-          <input class="input" type="text" placeholder={t('wp_role')} bind:value={role} />
+          <input class="input" type="text" placeholder={t('wp_company')} bind:value={company} required />
+          <input class="input" type="text" placeholder={t('wp_role')} bind:value={role} required />
           <input class="input" type="email" placeholder={t('wp_email')} bind:value={email} required />
 
           <div class="hp" aria-hidden="true">