🎨 UI: sections temoignages et vedettes

pages/about.php

@@ -198,7 +198,7 @@ include_template('navbar', compact('currentPage'));
 
     <?php $testimonials = getTestimonials(); ?>
     <?php if (!empty($testimonials)): ?>
-        <section class="section bg-surface">
+        <section class="section">
             <div class="container-content">
                 <div class="section-header">
                     <h2 class="section-title">Ce Qu'ils Disent</h2>
@@ -230,4 +230,4 @@ include_template('navbar', compact('currentPage'));
     </section>
 </main>
 
-<?php include_template('footer'); ?>
+<?php include_template('footer'); ?>

pages/projects.php

@@ -21,6 +21,13 @@ include_template('navbar', compact('currentPage'));
             </div>
 
             <?php if (!empty($featuredProjects)): ?>
+                <div class="mt-10 mb-16">
+                    <h2 class="text-heading mb-3">Projets vedettes</h2>
+                    <p class="text-text-secondary max-w-2xl">
+                        Une sélection de projets qui montrent le mieux mon approche produit et technique.
+                    </p>
+                </div>
+
                 <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 gap-6 lg:gap-8">
                     <?php foreach ($featuredProjects as $project): ?>
                         <?php include_template('project-card', ['project' => $project]); ?>
@@ -48,4 +55,4 @@ include_template('navbar', compact('currentPage'));
     </section>
 </main>
 
-<?php include_template('footer'); ?>
+<?php include_template('footer'); ?>

templates/testimonial.php

@@ -10,6 +10,7 @@ $authorName = $testimonial['author_name'] ?? 'Anonyme';
 $authorRole = $testimonial['author_role'] ?? '';
 $authorCompany = $testimonial['author_company'] ?? '';
 $authorPhoto = $testimonial['author_photo'] ?? null;
+$authorPhotoFallback = $authorPhoto ? str_replace('.webp', '.jpg', $authorPhoto) : null;
 $projectSlug = $testimonial['project_slug'] ?? null;
 $showProjectLink = $showProjectLink ?? true;
 ?>
@@ -25,12 +26,15 @@ $showProjectLink = $showProjectLink ?? true;
 
     <footer class="flex items-center gap-4">
         <?php if ($authorPhoto): ?>
-            <img
-                src="/assets/img/testimonials/<?= htmlspecialchars($authorPhoto, ENT_QUOTES, 'UTF-8') ?>"
-                alt="<?= htmlspecialchars($authorName, ENT_QUOTES, 'UTF-8') ?>"
-                class="w-12 h-12 rounded-full object-cover"
-                loading="lazy"
-            >
+            <picture>
+                <source srcset="/assets/img/testimonials/<?= htmlspecialchars($authorPhoto, ENT_QUOTES, 'UTF-8') ?>" type="image/webp">
+                <img
+                    src="/assets/img/testimonials/<?= htmlspecialchars($authorPhotoFallback, ENT_QUOTES, 'UTF-8') ?>"
+                    alt="<?= htmlspecialchars($authorName, ENT_QUOTES, 'UTF-8') ?>"
+                    class="w-12 h-12 rounded-full object-cover"
+                    loading="lazy"
+                >
+            </picture>
         <?php else: ?>
             <div class="w-12 h-12 rounded-full bg-primary/20 flex items-center justify-center">
                 <span class="text-primary font-semibold text-lg">
@@ -58,4 +62,4 @@ $showProjectLink = $showProjectLink ?? true;
             </svg>
         </a>
     <?php endif; ?>
-</blockquote>
+</blockquote>