create for series

components/MarkdownEditor.tsx

@@ -1,5 +1,5 @@
 import { useState } from 'react'
-import { Button } from './ui'
+import { Button, Card } from './ui'
 import type { MediaRef } from '@/types/nostr'
 import { uploadNip95Media } from '@/lib/nip95'
 import { t } from '@/lib/i18n'
@@ -89,7 +89,11 @@ function MarkdownToolbar({
 }
 
 function MarkdownPreview({ value }: { value: string }): React.ReactElement {
-  return <div className="prose max-w-none border rounded p-3 bg-white whitespace-pre-wrap">{value}</div>
+  return (
+    <Card variant="default" className="prose max-w-none bg-white whitespace-pre-wrap">
+      {value}
+    </Card>
+  )
 }
 
 async function handleUpload(

components/markdownEditorTwoColumns/MarkdownEditorTwoColumns.tsx

@@ -1,5 +1,5 @@
 import { useState } from 'react'
-import { Button } from '../ui'
+import { Button, Card } from '../ui'
 import type { MediaRef, Page } from '@/types/nostr'
 import { t } from '@/lib/i18n'
 import { createPagesHandlers, PagesManager } from './PagesManager'
@@ -97,9 +97,9 @@ function PreviewColumn(params: { value: string }): React.ReactElement {
 
 function MarkdownPreview(params: { value: string }): React.ReactElement {
   return (
-    <div className="prose max-w-none border rounded p-3 bg-white h-96 overflow-y-auto whitespace-pre-wrap">
+    <Card variant="default" className="prose max-w-none bg-white h-96 overflow-y-auto whitespace-pre-wrap">
       {params.value || <span className="text-gray-400">{t('markdown.preview.empty')}</span>}
-    </div>
+    </Card>
   )
 }
 

components/markdownEditorTwoColumns/PagesManager.tsx

@@ -1,4 +1,4 @@
-import { Button, Card, Textarea } from '../ui'
+import { Button, Card, EmptyState, Textarea } from '../ui'
 import { t } from '@/lib/i18n'
 import type { Page } from '@/types/nostr'
 
@@ -10,7 +10,7 @@ export function PagesManager(params: {
   onImageUpload: (file: File, pageNumber: number) => Promise<void>
 }): React.ReactElement {
   if (params.pages.length === 0) {
-    return <div className="text-sm text-gray-500">{t('page.empty')}</div>
+    return <EmptyState title={t('page.empty')} className="py-6" />
   }
   return (
     <div className="space-y-4">

docs/migration-status.md

@@ -79,7 +79,7 @@ Aucun composant prioritaire restant. Tous les composants principaux ont été mi
   - `markdownEditorTwoColumns/PagesManager.tsx` - PageImageUploadButton
 
 ### Priorité basse
-- **`PaymentModal.tsx`** - Le container du QR code utilise encore un `div` avec styles inline (déjà partiellement migré)
+- Aucun composant prioritaire bas restant. Tous les composants principaux ont été migrés.
 
 ## Composants récemment migrés
 - ✅ `LanguageSelector.tsx` - Migration vers Button
@@ -99,8 +99,10 @@ Aucun composant prioritaire restant. Tous les composants principaux ont été mi
 - ✅ `components/ui/Modal.tsx` - Migration du bouton de fermeture vers Button
 - ✅ `components/SeriesStats.tsx` - Migration des conteneurs de statistiques vers Card
 - ✅ `components/UserArticlesEditPanel.tsx` - Migration du conteneur principal vers Card
-- ✅ `components/markdownEditorTwoColumns/PagesManager.tsx` - Migration de PageEditor vers Card
+- ✅ `components/markdownEditorTwoColumns/PagesManager.tsx` - Migration de PageEditor vers Card et message d'état vide vers EmptyState
 - ✅ `components/authorPresentationEditor/AuthorPresentationEditor.tsx` - Migration de SuccessNotice vers Card
+- ✅ `components/MarkdownEditor.tsx` - Migration de MarkdownPreview vers Card
+- ✅ `components/markdownEditorTwoColumns/MarkdownEditorTwoColumns.tsx` - Migration de MarkdownPreview vers Card
 
 ## Erreurs corrigées