ajout des images sur les services

frontend/app/components/Contact.tsx

@@ -66,7 +66,7 @@ export default function ContactComponent() {
         {data?.email ? (
           <ContactForm />
         ) : (
-          <p className="u-muted">Une erreur est survenue. Vous pouvez tout de même me contacter directement par email : <a href="mailto:violet.anthony90@gmail.com">Me joindre par email</a></p>
+          <p className="u-muted"></p>
         )}
       </div>
     </div>

frontend/app/components/Services.tsx

@@ -1,3 +1,5 @@
+import Image from "next/image";
+
 async function GetServices() {
     const res = await fetch(`${process.env.BACKEND_URL}/services`, {
         cache: process.env.CACHE
@@ -19,7 +21,15 @@ export default async function Services() {
                 <ul className="grid-3">
                     {services.map((service: any) => (
                         <li key={service.id} className="service-card card feature">
-                            <span className="feature__icon" aria-hidden="true"></span>
+                            <div className="feature__icon" aria-hidden="true">
+                                <Image
+                                    src={service.img}
+                                    alt={service.name}
+                                    fill
+                                    sizes="40px"
+                                    style={{ objectFit: "cover" }}
+                                />
+                            </div>
                             <div>
                                 <h3 className="feature__title">{service.name}</h3>
                                 {"description" in service && service.description ? (

frontend/app/css/components.css

@@ -84,6 +84,8 @@
   background: var(--color-accent-600);
   border: 1px solid var(--color-accent-100, #ffe4d6);
   box-shadow: inset 0 0 0 2px rgba(255, 107, 53, 0.08);
+  position: relative;
+  overflow: hidden;
 }
 
 .feature__title {
@@ -144,6 +146,8 @@
   background: var(--color-accent-50, #fff4ec);
   border: 1px solid var(--color-accent-100, #ffe4d6);
   box-shadow: inset 0 0 0 2px rgba(255, 107, 53, 0.08);
+  position: relative;
+  overflow: hidden;
 }
 
 .feature__title {

frontend/next.config.ts

@@ -2,6 +2,9 @@ import type { NextConfig } from "next";
 
 const nextConfig: NextConfig = {
   /* config options here */
+    images: {
+        domains: ['photos.toine-server.eu'],
+    },
 };
 
 export default nextConfig;