From 5db7a992137067f7810e4d126a62d6a7241817b9 Mon Sep 17 00:00:00 2001
From: kayjaydee <killian.dalcin@gmail.com>
Date: Tue, 21 Apr 2026 15:37:51 +0200
Subject: [PATCH] =?UTF-8?q?fix(05-02):=20ProseImg=20inheritAttrs=20false?=
 =?UTF-8?q?=20=E2=80=94=20classes=20MDC=20custom=20overrident=20le=20layou?=
 =?UTF-8?q?t=20auto?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/components/content/ProseImg.vue | 35 ++++++++++++++++++-----------
 1 file changed, 22 insertions(+), 13 deletions(-)

diff --git a/app/components/content/ProseImg.vue b/app/components/content/ProseImg.vue
index dca0502..5b9df9c 100644
--- a/app/components/content/ProseImg.vue
+++ b/app/components/content/ProseImg.vue
@@ -1,4 +1,6 @@
 <script setup lang="ts">
+defineOptions({ inheritAttrs: false })
+
 interface Props {
   src: string
   alt?: string
@@ -13,34 +15,41 @@ const props = withDefaults(defineProps<Props>(), {
   align: 'full',
 })
 
+const attrs = useAttrs()
+
 const figureClass = computed(() => {
   const base = 'not-prose my-6'
+
+  // Si des classes custom sont passées via MDC {.class}, on retire les classes
+  // de layout automatiques — l'utilisateur contrôle tout.
+  if (attrs.class) return base
+
   switch (props.align) {
-    case 'left':
-      return `${base} float-left mr-6 mb-2 w-1/2 max-w-xs`
-    case 'right':
-      return `${base} float-right ml-6 mb-2 w-1/2 max-w-xs`
-    case 'center':
-      return `${base} mx-auto table`
-    default:
-      return `${base} w-full`
+    case 'left':  return `${base} float-left mr-6 mb-2 w-1/2 max-w-xs`
+    case 'right': return `${base} float-right ml-6 mb-2 w-1/2 max-w-xs`
+    case 'center': return `${base} mx-auto table`
+    default: return `${base} w-full`
   }
 })
 
-const imgClass = computed(() => {
-  const base = 'rounded-lg'
-  return props.align === 'full' ? `${base} w-full` : `${base} w-full`
+const figureStyle = computed(() => {
+  if (props.width && props.align !== 'full') return `width: ${props.width}px`
+  return undefined
 })
 </script>
 
 <template>
-  <figure :class="figureClass" :style="props.width && props.align !== 'full' ? `width: ${props.width}px` : undefined">
+  <figure
+    v-bind="attrs"
+    :class="figureClass"
+    :style="figureStyle"
+  >
     <img
       :src="props.src"
       :alt="props.alt"
       :title="props.title || props.caption"
       loading="lazy"
-      :class="imgClass"
+      :class="props.align === 'full' && !attrs.class ? 'w-full rounded-lg' : 'rounded-lg'"
     />
     <figcaption
       v-if="props.caption"