Fix: darker dark mode colors for badges and sections

This commit is contained in:
2026-04-20 03:21:43 -03:00
parent 1b9814b770
commit f94d401d57
2 changed files with 13 additions and 13 deletions
+12 -12
View File
@@ -280,11 +280,11 @@ export function HistoriaClinica({
<div className="space-y-2">
<div className="flex flex-wrap gap-2">
<Badge variant="outline" className="text-sm px-3 py-1 bg-green-50 text-green-700 dark:bg-green-950 dark:text-green-300">
<Badge variant="outline" className="text-sm px-3 py-1 bg-green-50 text-green-700 dark:bg-green-900 dark:text-green-300 dark:border-green-700">
{paciente.fechaNacimiento ? calcularEdad(paciente.fechaNacimiento) + ' años' : ''}
</Badge>
<Badge variant="outline" className="text-sm px-3 py-1 bg-blue-50 text-blue-700 border-blue-200 dark:bg-blue-950 dark:text-blue-300">
<Badge variant="outline" className="text-sm px-3 py-1 bg-blue-50 text-blue-700 border-blue-200 dark:bg-blue-900 dark:text-blue-300 dark:border-blue-700">
DNI: {paciente.dni}
</Badge>
@@ -946,7 +946,7 @@ function SeccionLaboratorios({ lab, patientId, add, update, del, addAcidoBase }:
<div className="flex-1"><Label>Hora</Label><Input type="time" value={hora} onChange={e => setHora(e.target.value)} /></div>
</div>
<div className="bg-purple-50 dark:bg-purple-900/30 p-3 rounded-lg border border-purple-200 dark:border-purple-700">
<div className="bg-purple-50 dark:bg-purple-900 p-3 rounded-lg border border-purple-200 dark:border-purple-700">
<p className="text-sm font-bold text-purple-800 mb-3">Hemograma</p>
<div className="grid grid-cols-4 gap-2">
<div><Label className="text-xs">Hto</Label><Input placeholder="%" value={hto} onChange={e => setHto(e.target.value)} /></div>
@@ -956,7 +956,7 @@ function SeccionLaboratorios({ lab, patientId, add, update, del, addAcidoBase }:
</div>
</div>
<div className="bg-green-50 dark:bg-green-900/30 p-3 rounded-lg border border-green-200 dark:border-green-700">
<div className="bg-green-50 dark:bg-green-900 p-3 rounded-lg border border-green-200 dark:border-green-700">
<p className="text-sm font-bold text-green-800 mb-3">Química</p>
<div className="grid grid-cols-3 gap-2">
<div><Label className="text-xs">Gluc</Label><Input placeholder="mg/dL" value={gluc} onChange={e => setGluc(e.target.value)} /></div>
@@ -965,7 +965,7 @@ function SeccionLaboratorios({ lab, patientId, add, update, del, addAcidoBase }:
</div>
</div>
<div className="bg-green-50 dark:bg-green-900/30 p-3 rounded-lg border border-green-200 dark:border-green-700">
<div className="bg-green-50 dark:bg-green-900 p-3 rounded-lg border border-green-200 dark:border-green-700">
<p className="text-sm font-bold text-green-800 mb-3">Ionograma</p>
<div className="grid grid-cols-3 gap-2">
<div><Label className="text-xs">Na+</Label><Input placeholder="mEq/L" value={na} onChange={e => setNa(e.target.value)} /></div>
@@ -974,7 +974,7 @@ function SeccionLaboratorios({ lab, patientId, add, update, del, addAcidoBase }:
</div>
</div>
<div className="bg-green-50 dark:bg-green-900/30 p-3 rounded-lg border border-green-200 dark:border-green-700">
<div className="bg-green-50 dark:bg-green-900 p-3 rounded-lg border border-green-200 dark:border-green-700">
<p className="text-sm font-bold text-green-800 mb-3">Hepatograma</p>
<div className="grid grid-cols-4 gap-2">
<div><Label className="text-xs">Bt</Label><Input placeholder="mg/dL" value={bt} onChange={e => setBt(e.target.value)} /></div>
@@ -984,7 +984,7 @@ function SeccionLaboratorios({ lab, patientId, add, update, del, addAcidoBase }:
</div>
</div>
<div className="bg-cyan-50 dark:bg-cyan-900/30 p-3 rounded-lg border border-cyan-200 dark:border-cyan-700">
<div className="bg-cyan-50 dark:bg-cyan-900 p-3 rounded-lg border border-cyan-200 dark:border-cyan-700">
<p className="text-sm font-bold text-cyan-800 mb-3">Coagulograma</p>
<div className="grid grid-cols-3 gap-2">
<div><Label className="text-xs">TP</Label><Input placeholder="seg" value={tp} onChange={e => setTp(e.target.value)} /></div>
@@ -1364,7 +1364,7 @@ function SeccionEvoluciones({ evos, internacionId, add, update, del }: {
<div><Label>Fecha *</Label><Input type="date" value={fecha} onChange={e => setFecha(e.target.value)} /></div>
<div><Label>Hora *</Label><Input type="time" value={hora} onChange={e => setHora(e.target.value)} /></div>
</div>
<div className="bg-blue-50 dark:bg-blue-950/50 p-3 rounded-lg border border-blue-200 dark:border-blue-700">
<div className="bg-blue-50 dark:bg-blue-900 p-3 rounded-lg border border-blue-200 dark:border-blue-700">
<p className="text-sm font-bold text-blue-800 mb-3 flex items-center gap-2"><Activity className="h-4 w-4" />Signos Vitales</p>
<div className="grid grid-cols-2 sm:grid-cols-3 gap-4">
<div><Label className="flex items-center gap-1"><Heart className="h-4 w-4" />TAS</Label><Input type="number" value={presionSistolica} onChange={e => setPresionSistolica(e.target.value)} placeholder="120" /></div>
@@ -1375,7 +1375,7 @@ function SeccionEvoluciones({ evos, internacionId, add, update, del }: {
<div><Label className="flex items-center gap-1"><Droplets className="h-4 w-4" />SatO2</Label><Input type="number" value={saturacionO2} onChange={e => setSaturacionO2(e.target.value)} placeholder="98" /></div>
</div>
</div>
<div className="bg-green-50 dark:bg-green-900/30 p-3 rounded-lg border border-green-200 dark:border-green-700">
<div className="bg-green-50 dark:bg-green-900 p-3 rounded-lg border border-green-200 dark:border-green-700">
<p className="text-sm font-bold text-green-800 mb-3 flex items-center gap-2"><FileText className="h-4 w-4" />Examen Físico</p>
<div className="grid grid-cols-1 sm:grid-cols-2 gap-4">
<div><Label>SNC</Label><textarea className="w-full p-2 border rounded-md text-sm min-h-[60px]" value={snc} onChange={e => setSnc(e.target.value)} placeholder="Estado neurológico" /></div>
@@ -1413,7 +1413,7 @@ function SeccionEvoluciones({ evos, internacionId, add, update, del }: {
</div>
{svText && <div className="bg-blue-50 p-2 rounded-lg"><p className="text-sm font-medium text-blue-800 flex items-center gap-2"><Activity className="h-4 w-4" />Signos Vitales: {svText}</p></div>}
{isExpanded && <>
{e.examenFisico && <div className="bg-green-50 dark:bg-green-900/30 p-3 rounded-lg border border-green-200 dark:border-green-700"><p className="text-sm font-medium text-green-800 mb-2">Examen Físico:</p><div className="grid grid-cols-2 sm:grid-cols-4 gap-2 text-xs">
{e.examenFisico && <div className="bg-green-50 dark:bg-green-900 p-3 rounded-lg border border-green-200 dark:border-green-700"><p className="text-sm font-medium text-green-800 mb-2">Examen Físico:</p><div className="grid grid-cols-2 sm:grid-cols-4 gap-2 text-xs">
{e.examenFisico.SNC && <div><span className="font-medium">SNC:</span> {e.examenFisico.SNC}</div>}
{e.examenFisico.Cardiovascular && <div><span className="font-medium">CV:</span> {e.examenFisico.Cardiovascular}</div>}
{e.examenFisico.Respiratorio && <div><span className="font-medium">Resp:</span> {e.examenFisico.Respiratorio}</div>}
@@ -1910,7 +1910,7 @@ function SeccionCultivos({ cults, patient, add, update, del }: {
</div>
)}
{c.estado === 'Negativo' && (
<div className="bg-green-50 dark:bg-green-900/30 p-3 rounded-lg border border-green-200 dark:border-green-700">
<div className="bg-green-50 dark:bg-green-900 p-3 rounded-lg border border-green-200 dark:border-green-700">
<p className="text-sm font-medium text-green-800 flex items-center gap-2"><CheckCircle2 className="h-4 w-4" />Sin crecimiento de microorganismos</p>
{c.fechaResultado && <p className="text-xs text-green-600 mt-1">Resultado: {c.fechaResultado}</p>}
</div>
@@ -2211,7 +2211,7 @@ function SeccionInterconsultas({ interconsultas, pacienteId, internacionId, add,
{ic.respuestaInterconsulta && (
<>
{ic.respuestaFecha && (
<Badge variant="outline" className="mt-2 bg-green-50 text-green-700 border-green-200 dark:bg-green-950 dark:text-green-300 dark:border-green-800">
<Badge variant="outline" className="mt-2 bg-green-50 text-green-700 border-green-200 dark:bg-green-900 dark:text-green-300 dark:border-green-700">
<CheckCircle2 className="h-3 w-3 mr-1" />
Respondido: {ic.respuestaFecha}
</Badge>