streaper2/plume
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

correction des themes

Browse Source
This commit is contained in:
streaper2
2026-02-28 00:15:54 +01:00
parent 521e529ab0
commit 82c4d1cfe1
67 changed files with 1861 additions and 742 deletions
Download Patch File Download Diff File Expand all files Collapse all files

156
src/components/WorldBuilder.tsx
View File

@@ -204,22 +204,22 @@ const WorldBuilder: React.FC<WorldBuilderProps> = ({ entities, onCreate, onUpdat
const attrs = tempEntity.attributes;
return (
<div className="space-y-8 border-t border-slate-100 pt-6 mt-4">
<div className="space-y-8 border-t border-theme-border pt-6 mt-4">
{/* SECTION 1: ROLE & ARCHETYPE */}
<div className="bg-[#eef2ff] p-4 rounded-lg border border-indigo-100">
<h3 className="text-sm font-bold text-slate-700 uppercase mb-4 flex items-center gap-2">
<div className="bg-theme-bg p-4 rounded-lg border border-theme-border">
<h3 className="text-sm font-bold text-theme-text uppercase mb-4 flex items-center gap-2">
<User size={16} /> Identité Narrative
</h3>
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
<div>
<label className="block text-xs font-semibold text-slate-500 mb-2">Archétype</label>
<label className="block text-xs font-semibold text-theme-muted mb-2">Archétype</label>
<input
type="text"
list="archetype-suggestions"
value={attrs.archetype}
onChange={(e) => updateAttribute('archetype', e.target.value)}
className="w-full p-2 bg-[#eef2ff] border border-slate-300 rounded text-sm outline-none focus:border-blue-500"
className="w-full p-2 bg-theme-bg border border-theme-border rounded text-sm outline-none focus:border-blue-500"
placeholder="Ex: Le Héros, Le Sage..."
/>
<datalist id="archetype-suggestions">
@@ -227,7 +227,7 @@ const WorldBuilder: React.FC<WorldBuilderProps> = ({ entities, onCreate, onUpdat
</datalist>
</div>
<div>
<label className="block text-xs font-semibold text-slate-500 mb-2">Rôle dans l'histoire</label>
<label className="block text-xs font-semibold text-theme-muted mb-2">Rôle dans l'histoire</label>
<div className="flex gap-2 flex-wrap">
{[
{ val: 'protagonist', label: 'Protagoniste' },
@@ -235,7 +235,7 @@ const WorldBuilder: React.FC<WorldBuilderProps> = ({ entities, onCreate, onUpdat
{ val: 'support', label: 'Secondaire' },
{ val: 'extra', label: 'Figurant' }
].map(opt => (
<label key={opt.val} className={`cursor-pointer px-3 py-1.5 rounded text-xs border transition-colors ${attrs.role === opt.val ? 'bg-indigo-100 border-indigo-300 text-indigo-700 font-bold' : 'bg-[#eef2ff] border-slate-200 text-slate-600 hover:bg-slate-100'}`}>
<label key={opt.val} className={`cursor-pointer px-3 py-1.5 rounded text-xs border transition-colors ${attrs.role === opt.val ? 'bg-indigo-100 border-indigo-300 text-indigo-700 font-bold' : 'bg-theme-bg border-theme-border text-theme-muted hover:bg-theme-border'}`}>
<input
type="radio"
name="role"
@@ -253,15 +253,15 @@ const WorldBuilder: React.FC<WorldBuilderProps> = ({ entities, onCreate, onUpdat
</div>
{/* SECTION 2: PHYSIQUE */}
<div className="bg-[#eef2ff] p-4 rounded-lg border border-indigo-100">
<h3 className="text-sm font-bold text-slate-700 uppercase mb-4 flex items-center gap-2">
<div className="bg-theme-bg p-4 rounded-lg border border-theme-border">
<h3 className="text-sm font-bold text-theme-text uppercase mb-4 flex items-center gap-2">
<Ruler size={16} /> Apparence Physique
</h3>
<div className="grid grid-cols-1 md:grid-cols-2 gap-6">
<div className="space-y-6">
<div>
<div className="flex justify-between text-xs mb-1">
<label className="font-semibold text-slate-600">Âge (ans)</label>
<label className="font-semibold text-theme-muted">Âge (ans)</label>
</div>
<div className="flex items-center gap-3">
<input
@@ -274,14 +274,14 @@ const WorldBuilder: React.FC<WorldBuilderProps> = ({ entities, onCreate, onUpdat
type="number"
value={attrs.age}
onChange={(e) => updateAttribute('age', parseInt(e.target.value))}
className="w-20 p-1 text-right text-sm border border-slate-300 rounded font-mono text-indigo-700 bg-[#eef2ff] focus:border-indigo-500 outline-none"
className="w-20 p-1 text-right text-sm border border-theme-border rounded font-mono text-indigo-700 bg-theme-bg focus:border-indigo-500 outline-none"
/>
</div>
</div>
<div>
<div className="flex justify-between text-xs mb-1">
<label className="font-semibold text-slate-600">Taille (cm)</label>
<label className="font-semibold text-theme-muted">Taille (cm)</label>
</div>
<div className="flex items-center gap-3">
<input
@@ -294,7 +294,7 @@ const WorldBuilder: React.FC<WorldBuilderProps> = ({ entities, onCreate, onUpdat
type="number"
value={attrs.height}
onChange={(e) => updateAttribute('height', parseInt(e.target.value))}
className="w-20 p-1 text-right text-sm border border-slate-300 rounded font-mono text-indigo-700 bg-[#eef2ff] focus:border-indigo-500 outline-none"
className="w-20 p-1 text-right text-sm border border-theme-border rounded font-mono text-indigo-700 bg-theme-bg focus:border-indigo-500 outline-none"
/>
</div>
</div>
@@ -303,34 +303,34 @@ const WorldBuilder: React.FC<WorldBuilderProps> = ({ entities, onCreate, onUpdat
<div className="space-y-4">
<div className="grid grid-cols-2 gap-4">
<div>
<label className="block text-xs font-semibold text-slate-500 mb-1">Cheveux</label>
<label className="block text-xs font-semibold text-theme-muted mb-1">Cheveux</label>
<select
value={attrs.hair}
onChange={(e) => updateAttribute('hair', e.target.value)}
className="w-full p-2 bg-[#eef2ff] border border-slate-300 rounded text-sm"
className="w-full p-2 bg-theme-bg border border-theme-border rounded text-sm"
>
{HAIR_COLORS.map(c => <option key={c} value={c}>{c}</option>)}
</select>
</div>
<div>
<label className="block text-xs font-semibold text-slate-500 mb-1">Yeux</label>
<label className="block text-xs font-semibold text-theme-muted mb-1">Yeux</label>
<select
value={attrs.eyes}
onChange={(e) => updateAttribute('eyes', e.target.value)}
className="w-full p-2 bg-[#eef2ff] border border-slate-300 rounded text-sm"
className="w-full p-2 bg-theme-bg border border-theme-border rounded text-sm"
>
{EYE_COLORS.map(c => <option key={c} value={c}>{c}</option>)}
</select>
</div>
</div>
<div>
<label className="block text-xs font-semibold text-slate-500 mb-1">Signe distinctif</label>
<label className="block text-xs font-semibold text-theme-muted mb-1">Signe distinctif</label>
<input
type="text"
value={attrs.physicalQuirk}
onChange={(e) => updateAttribute('physicalQuirk', e.target.value)}
placeholder="Cicatrice, tatouage..."
className="w-full p-2 bg-[#eef2ff] border border-slate-300 rounded text-sm outline-none focus:border-indigo-400"
className="w-full p-2 bg-theme-bg border border-theme-border rounded text-sm outline-none focus:border-indigo-400"
/>
</div>
</div>
@@ -338,15 +338,15 @@ const WorldBuilder: React.FC<WorldBuilderProps> = ({ entities, onCreate, onUpdat
</div>
{/* SECTION 3: PSYCHOLOGIE */}
<div className="bg-[#eef2ff] p-4 rounded-lg border border-indigo-100">
<h3 className="text-sm font-bold text-slate-700 uppercase mb-4 flex items-center gap-2">
<div className="bg-theme-bg p-4 rounded-lg border border-theme-border">
<h3 className="text-sm font-bold text-theme-text uppercase mb-4 flex items-center gap-2">
<Brain size={16} /> Psychologie & Comportement
</h3>
<div className="space-y-6">
<div className="space-y-4 px-2">
<div className="relative pt-1">
<div className="flex justify-between text-[10px] uppercase font-bold text-slate-500 mb-1">
<div className="flex justify-between text-[10px] uppercase font-bold text-theme-muted mb-1">
<span>Introverti</span>
<span>Extraverti</span>
</div>
@@ -358,7 +358,7 @@ const WorldBuilder: React.FC<WorldBuilderProps> = ({ entities, onCreate, onUpdat
/>
</div>
<div className="relative pt-1">
<div className="flex justify-between text-[10px] uppercase font-bold text-slate-500 mb-1">
<div className="flex justify-between text-[10px] uppercase font-bold text-theme-muted mb-1">
<span>Émotionnel</span>
<span>Rationnel</span>
</div>
@@ -370,7 +370,7 @@ const WorldBuilder: React.FC<WorldBuilderProps> = ({ entities, onCreate, onUpdat
/>
</div>
<div className="relative pt-1">
<div className="flex justify-between text-[10px] uppercase font-bold text-slate-500 mb-1">
<div className="flex justify-between text-[10px] uppercase font-bold text-theme-muted mb-1">
<span>Chaotique</span>
<span>Loyal</span>
</div>
@@ -383,14 +383,14 @@ const WorldBuilder: React.FC<WorldBuilderProps> = ({ entities, onCreate, onUpdat
</div>
</div>
<div className="border-t border-slate-200 pt-4">
<label className="block text-xs font-semibold text-slate-500 mb-1">Toc ou habitude comportementale</label>
<div className="border-t border-theme-border pt-4">
<label className="block text-xs font-semibold text-theme-muted mb-1">Toc ou habitude comportementale</label>
<input
type="text"
value={attrs.behavioralQuirk}
onChange={(e) => updateAttribute('behavioralQuirk', e.target.value)}
placeholder="Joue avec sa bague, bégaie quand il ment..."
className="w-full p-2 bg-[#eef2ff] border border-slate-300 rounded text-sm outline-none focus:border-indigo-400"
className="w-full p-2 bg-theme-bg border border-theme-border rounded text-sm outline-none focus:border-indigo-400"
/>
</div>
</div>
@@ -404,8 +404,8 @@ const WorldBuilder: React.FC<WorldBuilderProps> = ({ entities, onCreate, onUpdat
if (!currentTemplate || currentTemplate.fields.length === 0) return null;
return (
<div className="bg-[#eef2ff] p-4 rounded-lg border border-indigo-100 mt-6">
<h3 className="text-sm font-bold text-slate-700 uppercase mb-4 flex items-center gap-2">
<div className="bg-theme-bg p-4 rounded-lg border border-theme-border mt-6">
<h3 className="text-sm font-bold text-theme-text uppercase mb-4 flex items-center gap-2">
<List size={16} /> Champs Personnalisés
</h3>
<div className="grid grid-cols-1 gap-4">
@@ -414,20 +414,20 @@ const WorldBuilder: React.FC<WorldBuilderProps> = ({ entities, onCreate, onUpdat
return (
<div key={field.id}>
<label className="block text-xs font-semibold text-slate-500 mb-1">{field.label}</label>
<label className="block text-xs font-semibold text-theme-muted mb-1">{field.label}</label>
{field.type === 'textarea' ? (
<textarea
value={value}
onChange={(e) => updateCustomValue(field.id, e.target.value)}
className="w-full p-2 bg-[#eef2ff] border border-slate-300 rounded text-sm outline-none focus:border-indigo-400"
className="w-full p-2 bg-theme-bg border border-theme-border rounded text-sm outline-none focus:border-indigo-400"
placeholder={field.placeholder}
/>
) : field.type === 'select' ? (
<select
value={value}
onChange={(e) => updateCustomValue(field.id, e.target.value)}
className="w-full p-2 bg-[#eef2ff] border border-slate-300 rounded text-sm outline-none focus:border-indigo-400"
className="w-full p-2 bg-theme-bg border border-theme-border rounded text-sm outline-none focus:border-indigo-400"
>
<option value="">Sélectionner...</option>
{field.options?.map(opt => (
@@ -440,16 +440,16 @@ const WorldBuilder: React.FC<WorldBuilderProps> = ({ entities, onCreate, onUpdat
type="checkbox"
checked={!!value}
onChange={(e) => updateCustomValue(field.id, e.target.checked)}
className="w-4 h-4 text-indigo-600 rounded border-slate-300 focus:ring-indigo-500"
className="w-4 h-4 text-indigo-600 rounded border-theme-border focus:ring-indigo-500"
/>
<span className="text-sm text-slate-700">Activé / Oui</span>
<span className="text-sm text-theme-text">Activé / Oui</span>
</label>
) : (
<input
type={field.type === 'number' ? 'number' : 'text'}
value={value}
onChange={(e) => updateCustomValue(field.id, e.target.value)}
className="w-full p-2 bg-[#eef2ff] border border-slate-300 rounded text-sm outline-none focus:border-indigo-400"
className="w-full p-2 bg-theme-bg border border-theme-border rounded text-sm outline-none focus:border-indigo-400"
placeholder={field.placeholder}
/>
)}
@@ -465,29 +465,29 @@ const WorldBuilder: React.FC<WorldBuilderProps> = ({ entities, onCreate, onUpdat
const template = templates.find(t => t.entityType === activeTemplateType) || { entityType: activeTemplateType, fields: [] };
return (
<div className="flex-1 bg-white rounded-xl shadow-lg border border-slate-200 p-8 overflow-y-auto">
<div className="flex-1 bg-theme-panel rounded-xl shadow-lg border border-theme-border p-8 overflow-y-auto">
<div className="flex justify-between items-start mb-6">
<div>
<h2 className="text-2xl font-bold text-slate-800 flex items-center gap-2">
<h2 className="text-2xl font-bold text-theme-text flex items-center gap-2">
<Layout size={24} className="text-indigo-600" /> Éditeur de Modèles
</h2>
<p className="text-slate-500 text-sm mt-1">
<p className="text-theme-muted text-sm mt-1">
Configurez les champs personnalisés pour chaque type de fiche.
</p>
</div>
<button onClick={() => setMode('entities')} className="p-2 text-slate-500 hover:bg-slate-100 rounded-full">
<button onClick={() => setMode('entities')} className="p-2 text-theme-muted hover:bg-theme-border rounded-full">
<X size={20} />
</button>
</div>
<div className="flex gap-2 mb-8 border-b border-slate-200 pb-1">
<div className="flex gap-2 mb-8 border-b border-theme-border pb-1">
{Object.values(EntityType).map(type => (
<button
key={type}
onClick={() => setActiveTemplateType(type)}
className={`px-4 py-2 text-sm font-medium rounded-t-lg transition-colors ${activeTemplateType === type
? 'bg-indigo-50 text-indigo-700 border-b-2 border-indigo-600'
: 'text-slate-500 hover:text-slate-800 hover:bg-slate-50'
? 'bg-indigo-500/10 text-indigo-700 border-b-2 border-indigo-600'
: 'text-theme-muted hover:text-theme-text hover:bg-theme-panel/50'
}`}
>
{type}
@@ -497,23 +497,23 @@ const WorldBuilder: React.FC<WorldBuilderProps> = ({ entities, onCreate, onUpdat
<div className="space-y-4">
{template.fields.map((field, idx) => (
<div key={field.id} className="bg-[#eef2ff] border border-indigo-100 rounded-lg p-4 flex gap-4 items-start group">
<div key={field.id} className="bg-theme-bg border border-theme-border rounded-lg p-4 flex gap-4 items-start group">
<div className="flex-1 grid grid-cols-2 gap-4">
<div>
<label className="block text-xs font-semibold text-slate-500 mb-1">Nom du champ</label>
<label className="block text-xs font-semibold text-theme-muted mb-1">Nom du champ</label>
<input
type="text"
value={field.label}
onChange={(e) => updateCustomField(activeTemplateType, field.id, { label: e.target.value })}
className="w-full p-2 bg-[#eef2ff] border border-slate-300 rounded text-sm"
className="w-full p-2 bg-theme-bg border border-theme-border rounded text-sm"
/>
</div>
<div>
<label className="block text-xs font-semibold text-slate-500 mb-1">Type</label>
<label className="block text-xs font-semibold text-theme-muted mb-1">Type</label>
<select
value={field.type}
onChange={(e) => updateCustomField(activeTemplateType, field.id, { type: e.target.value as CustomFieldType })}
className="w-full p-2 bg-[#eef2ff] border border-slate-300 rounded text-sm"
className="w-full p-2 bg-theme-bg border border-theme-border rounded text-sm"
>
<option value="text">Texte court</option>
<option value="textarea">Texte long</option>
@@ -524,12 +524,12 @@ const WorldBuilder: React.FC<WorldBuilderProps> = ({ entities, onCreate, onUpdat
</div>
{field.type === 'select' && (
<div className="col-span-2">
<label className="block text-xs font-semibold text-slate-500 mb-1">Options (séparées par des virgules)</label>
<label className="block text-xs font-semibold text-theme-muted mb-1">Options (séparées par des virgules)</label>
<input
type="text"
value={field.options?.join(',') || ''}
onChange={(e) => updateCustomField(activeTemplateType, field.id, { options: e.target.value.split(',').map(s => s.trim()) })}
className="w-full p-2 bg-[#eef2ff] border border-slate-300 rounded text-sm"
className="w-full p-2 bg-theme-bg border border-theme-border rounded text-sm"
placeholder="Option A, Option B, Option C"
/>
</div>
@@ -537,7 +537,7 @@ const WorldBuilder: React.FC<WorldBuilderProps> = ({ entities, onCreate, onUpdat
</div>
<button
onClick={() => deleteCustomField(activeTemplateType, field.id)}
className="p-2 text-slate-400 hover:text-red-600 hover:bg-red-50 rounded mt-5"
className="p-2 text-theme-muted hover:text-red-600 hover:bg-red-50 rounded mt-5"
>
<Trash2 size={16} />
</button>
@@ -546,7 +546,7 @@ const WorldBuilder: React.FC<WorldBuilderProps> = ({ entities, onCreate, onUpdat
<button
onClick={() => addCustomField(activeTemplateType)}
className="w-full py-3 border-2 border-dashed border-slate-300 rounded-lg text-slate-500 hover:border-indigo-400 hover:text-indigo-600 hover:bg-indigo-50 transition-all flex items-center justify-center gap-2"
className="w-full py-3 border-2 border-dashed border-theme-border rounded-lg text-theme-muted hover:border-indigo-400 hover:text-indigo-600 hover:bg-indigo-500/10 transition-all flex items-center justify-center gap-2"
>
<Plus size={20} /> Ajouter un champ
</button>
@@ -557,14 +557,14 @@ const WorldBuilder: React.FC<WorldBuilderProps> = ({ entities, onCreate, onUpdat
if (mode === 'templates') {
return (
<div className="flex h-full gap-6 p-6 bg-[#eef2ff]">
<div className="flex h-full gap-6 p-6 bg-theme-bg">
<div className="w-1/3 opacity-50 pointer-events-none filter blur-[1px]">
<div className="bg-white rounded-lg p-6 shadow-sm border border-slate-200">
<h3 className="font-bold text-slate-700 mb-4">Aperçu Fiches</h3>
<div className="bg-theme-panel rounded-lg p-6 shadow-sm border border-theme-border">
<h3 className="font-bold text-theme-text mb-4">Aperçu Fiches</h3>
<div className="space-y-2">
<div className="h-10 bg-indigo-50 rounded"></div>
<div className="h-10 bg-indigo-50 rounded"></div>
<div className="h-10 bg-indigo-50 rounded"></div>
<div className="h-10 bg-indigo-500/10 rounded"></div>
<div className="h-10 bg-indigo-500/10 rounded"></div>
<div className="h-10 bg-indigo-500/10 rounded"></div>
</div>
</div>
</div>
@@ -574,10 +574,10 @@ const WorldBuilder: React.FC<WorldBuilderProps> = ({ entities, onCreate, onUpdat
}
return (
<div className="flex h-full gap-6 p-6 bg-[#eef2ff]">
<div className="flex h-full gap-6 p-6 bg-theme-bg">
<div className="w-1/3 flex flex-col gap-4">
<div className="flex justify-between items-center px-1">
<h2 className="text-lg font-bold text-slate-700">Explorateur</h2>
<h2 className="text-lg font-bold text-theme-text">Explorateur</h2>
<button
onClick={() => setMode('templates')}
className="flex items-center gap-1.5 px-3 py-1.5 bg-indigo-100 text-indigo-700 hover:bg-indigo-200 rounded text-xs font-medium transition-colors"
@@ -589,9 +589,9 @@ const WorldBuilder: React.FC<WorldBuilderProps> = ({ entities, onCreate, onUpdat
<div className="space-y-6 overflow-y-auto pr-2 pb-4 flex-1">
{Object.values(EntityType).map(type => (
<div key={type} className="bg-white rounded-lg shadow-sm border border-slate-200 overflow-hidden">
<div className="bg-indigo-50 p-3 border-b border-indigo-100 flex justify-between items-center">
<h3 className="font-semibold text-slate-700 flex items-center gap-2">
<div key={type} className="bg-theme-panel rounded-lg shadow-sm border border-theme-border overflow-hidden">
<div className="bg-indigo-500/10 p-3 border-b border-theme-border flex justify-between items-center">
<h3 className="font-semibold text-theme-text flex items-center gap-2">
<span>{ENTITY_ICONS[type]}</span> {type}s
</h3>
<button
@@ -603,17 +603,17 @@ const WorldBuilder: React.FC<WorldBuilderProps> = ({ entities, onCreate, onUpdat
</div>
<div className="divide-y divide-slate-100">
{filterByType(type).length === 0 && (
<p className="p-4 text-sm text-slate-400 italic text-center">Aucun élément</p>
<p className="p-4 text-sm text-theme-muted italic text-center">Aucun élément</p>
)}
{filterByType(type).map(entity => (
<div
key={entity.id}
onClick={() => handleEdit(entity)}
className={`p-3 cursor-pointer hover:bg-blue-50 transition-colors flex justify-between group ${editingId === entity.id ? 'bg-blue-50 border-l-4 border-blue-500' : ''}`}
className={`p-3 cursor-pointer hover:bg-blue-500/10 transition-colors flex justify-between group ${editingId === entity.id ? 'bg-blue-500/10 border-l-4 border-blue-500' : ''}`}
>
<div>
<div className="font-medium text-slate-800">{entity.name}</div>
<div className="text-xs text-slate-500 truncate">{entity.description}</div>
<div className="font-medium text-theme-text">{entity.name}</div>
<div className="text-xs text-theme-muted truncate">{entity.description}</div>
</div>
<button
onClick={(e) => { e.stopPropagation(); handleDelete(entity.id); }}
@@ -629,7 +629,7 @@ const WorldBuilder: React.FC<WorldBuilderProps> = ({ entities, onCreate, onUpdat
</div>
</div>
<div className="flex-1 bg-white rounded-xl shadow-lg border border-slate-200 p-8 overflow-y-auto">
<div className="flex-1 bg-theme-panel rounded-xl shadow-lg border border-theme-border p-8 overflow-y-auto">
{editingId && tempEntity ? (
<div className="space-y-6 animate-in fade-in duration-200">
<div className="flex justify-between items-start">
@@ -637,12 +637,12 @@ const WorldBuilder: React.FC<WorldBuilderProps> = ({ entities, onCreate, onUpdat
<span className={`inline-block px-2 py-1 rounded text-xs font-bold uppercase tracking-wider ${ENTITY_COLORS[tempEntity.type]}`}>
{tempEntity.type}
</span>
<h2 className="text-2xl font-bold text-slate-800">
<h2 className="text-2xl font-bold text-theme-text">
{tempEntity.type === EntityType.CHARACTER ? 'Fiche Personnage' : 'Édition de la fiche'}
</h2>
</div>
<div className="flex gap-2">
<button onClick={() => setEditingId(null)} className="p-2 text-slate-500 hover:bg-slate-100 rounded-full">
<button onClick={() => setEditingId(null)} className="p-2 text-theme-muted hover:bg-theme-border rounded-full">
<X size={20} />
</button>
</div>
@@ -650,22 +650,22 @@ const WorldBuilder: React.FC<WorldBuilderProps> = ({ entities, onCreate, onUpdat
<div className="space-y-4">
<div>
<label className="block text-sm font-medium text-slate-700 mb-1">Nom</label>
<label className="block text-sm font-medium text-theme-text mb-1">Nom</label>
<input
type="text"
value={tempEntity.name}
onChange={e => setTempEntity({ ...tempEntity, name: e.target.value })}
className="w-full p-2 bg-[#eef2ff] border border-slate-300 rounded focus:ring-2 focus:ring-blue-500 outline-none font-serif text-lg"
className="w-full p-2 bg-theme-bg border border-theme-border rounded focus:ring-2 focus:ring-blue-500 outline-none font-serif text-lg"
placeholder="Ex: Gandalf le Gris"
/>
</div>
<div>
<label className="block text-sm font-medium text-slate-700 mb-1">Description Courte (pour l'IA)</label>
<label className="block text-sm font-medium text-theme-text mb-1">Description Courte (pour l'IA)</label>
<textarea
value={tempEntity.description}
onChange={e => setTempEntity({ ...tempEntity, description: e.target.value })}
className="w-full p-2 bg-[#eef2ff] border border-slate-300 rounded focus:ring-2 focus:ring-blue-500 outline-none text-sm h-20"
className="w-full p-2 bg-theme-bg border border-theme-border rounded focus:ring-2 focus:ring-blue-500 outline-none text-sm h-20"
placeholder="Un magicien puissant qui guide la communauté..."
/>
</div>
@@ -674,7 +674,7 @@ const WorldBuilder: React.FC<WorldBuilderProps> = ({ entities, onCreate, onUpdat
{renderCustomFieldsEditor()}
<div className="mt-6 border-t border-slate-100 pt-6">
<div className="mt-6 border-t border-theme-border pt-6">
<div>
<label className="block text-sm font-medium text-indigo-700 mb-1 flex items-center gap-2">
<Sparkles size={14} /> Contexte Narratif (Auto-généré)
@@ -682,17 +682,17 @@ const WorldBuilder: React.FC<WorldBuilderProps> = ({ entities, onCreate, onUpdat
<textarea
value={tempEntity.storyContext || ''}
onChange={e => setTempEntity({ ...tempEntity, storyContext: e.target.value })}
className="w-full p-2 border border-indigo-200 bg-indigo-50 rounded focus:ring-2 focus:ring-blue-500 outline-none text-sm h-24 italic text-slate-600"
className="w-full p-2 border border-indigo-200 bg-indigo-500/10 rounded focus:ring-2 focus:ring-blue-500 outline-none text-sm h-24 italic text-theme-muted"
placeholder="Les événements vécus par ce personnage apparaîtront ici..."
/>
</div>
<div className="mt-4">
<label className="block text-sm font-medium text-slate-700 mb-1">Notes & Biographie Complète</label>
<label className="block text-sm font-medium text-theme-text mb-1">Notes & Biographie Complète</label>
<textarea
value={tempEntity.details}
onChange={e => setTempEntity({ ...tempEntity, details: e.target.value })}
className="w-full p-2 bg-[#eef2ff] border border-slate-300 rounded focus:ring-2 focus:ring-blue-500 outline-none h-48 font-serif"
className="w-full p-2 bg-theme-bg border border-theme-border rounded focus:ring-2 focus:ring-blue-500 outline-none h-48 font-serif"
placeholder="Histoire détaillée, secrets, origines..."
/>
</div>
@@ -710,7 +710,7 @@ const WorldBuilder: React.FC<WorldBuilderProps> = ({ entities, onCreate, onUpdat
</div>
</div>
) : (
<div className="h-full flex flex-col items-center justify-center text-slate-400">
<div className="h-full flex flex-col items-center justify-center text-theme-muted">
<div className="text-6xl mb-4 opacity-20">🌍</div>
<p className="text-lg">Sélectionnez ou créez une fiche pour commencer.</p>
<p className="text-sm">Ces informations aideront l'IA à rester cohérente.</p>