feat: localize various UI texts and labels to Spanish across application pages and interactive components.

This commit is contained in:
2026-01-16 23:25:36 -03:00
parent 2cfd1f204b
commit ffbef17396
19 changed files with 178 additions and 181 deletions
+13 -13
View File
@@ -30,35 +30,35 @@ export default function CourseOutlinePage({ params }: { params: { id: string } }
);
}
if (!courseData) return <div className="text-center py-20 text-gray-500">Course not found.</div>;
if (!courseData) return <div className="text-center py-20 text-gray-500">Curso no encontrado.</div>;
return (
<div className="max-w-4xl mx-auto px-6 py-20">
<div className="mb-16">
<div className="flex items-center gap-2 mb-6 text-blue-500 font-bold text-xs uppercase tracking-widest">
<Link href="/" className="hover:text-white transition-colors">Catalog</Link>
<Link href="/" className="hover:text-white transition-colors">Catálogo</Link>
<ChevronRight size={14} className="text-gray-600" />
<span>Course Details</span>
<span>Detalles del Curso</span>
</div>
<h1 className="text-5xl font-black tracking-tighter mb-6">{courseData.title}</h1>
<p className="text-gray-400 text-lg leading-relaxed max-w-2xl mb-10">
{courseData.description || "Master the core principles and advanced techniques in this structured curriculum. Each module is designed to provide actionable insights and hands-on experience."}
{courseData.description || "Domina los principios básicos y las técnicas avanzadas en este plan de estudios estructurado. Cada módulo está diseñado para proporcionar conocimientos prácticos y experiencia práctica."}
</p>
<div className="flex flex-wrap items-center gap-4 mb-10">
<div className={`flex items-center gap-2 px-4 py-2 rounded-full border text-xs font-bold uppercase tracking-widest ${courseData.pacing_mode === 'instructor_led' ? 'bg-purple-500/10 border-purple-500/30 text-purple-400' : 'bg-blue-500/10 border-blue-500/30 text-blue-400'
}`}>
{courseData.pacing_mode === 'instructor_led' ? <Clock size={14} /> : <Info size={14} />}
{courseData.pacing_mode === 'instructor_led' ? 'Instructor-Led' : 'Self-Paced'}
{courseData.pacing_mode === 'instructor_led' ? 'Dirigido por un Instructor' : 'A tu Ritmo'}
</div>
{courseData.pacing_mode === 'instructor_led' && (courseData.start_date || courseData.end_date) && (
<div className="flex items-center gap-4 text-xs font-bold text-gray-500 uppercase tracking-widest">
<Calendar size={14} />
<span>
{courseData.start_date ? new Date(courseData.start_date).toLocaleDateString() : 'TBD'}
{courseData.start_date ? new Date(courseData.start_date).toLocaleDateString() : 'Por Determinar'}
<span className="mx-2 text-gray-700"></span>
{courseData.end_date ? new Date(courseData.end_date).toLocaleDateString() : 'TBD'}
{courseData.end_date ? new Date(courseData.end_date).toLocaleDateString() : 'Por Determinar'}
</span>
</div>
)}
@@ -67,12 +67,12 @@ export default function CourseOutlinePage({ params }: { params: { id: string } }
<div className="flex items-center justify-between">
<div className="flex items-center gap-8">
<div className="flex flex-col">
<span className="text-[10px] font-black uppercase tracking-widest text-gray-600 mb-1">Modules</span>
<span className="text-[10px] font-black uppercase tracking-widest text-gray-600 mb-1">Módulos</span>
<span className="text-xl font-bold text-white">{courseData.modules.length}</span>
</div>
<div className="w-px h-8 bg-white/10" />
<div className="flex flex-col">
<span className="text-[10px] font-black uppercase tracking-widest text-gray-600 mb-1">Total Lessons</span>
<span className="text-[10px] font-black uppercase tracking-widest text-gray-600 mb-1">Lecciones Totales</span>
<span className="text-xl font-bold text-white">
{courseData.modules.reduce((acc, m) => acc + m.lessons.length, 0)}
</span>
@@ -82,12 +82,12 @@ export default function CourseOutlinePage({ params }: { params: { id: string } }
<div className="flex gap-2">
<Link href={`/courses/${params.id}/calendar`}>
<button className="px-6 py-3 glass hover:border-blue-500/50 transition-all font-bold text-xs uppercase tracking-widest flex items-center gap-3 active:scale-95">
<Calendar size={16} /> Timeline
<Calendar size={16} /> Cronología
</button>
</Link>
<Link href={`/courses/${params.id}/progress`}>
<button className="px-8 py-3 glass hover:border-blue-500/50 transition-all font-bold text-xs uppercase tracking-widest flex items-center gap-3 active:scale-95">
📊 Progress
📊 Progreso
</button>
</Link>
</div>
@@ -120,14 +120,14 @@ export default function CourseOutlinePage({ params }: { params: { id: string } }
<div>
<h3 className="text-sm font-bold text-gray-200 group-hover:text-white transition-colors">{lesson.title}</h3>
<span className="text-[10px] font-bold uppercase tracking-widest text-gray-500">
{lesson.content_type === 'activity' ? 'Interactive Activity' : 'Video Lesson'}
{lesson.content_type === 'activity' ? 'Actividad Interactiva' : 'Lección en Video'}
</span>
</div>
</div>
<div className="flex items-center gap-6">
{lesson.due_date && (
<div className="text-right hidden sm:block">
<div className="text-[9px] font-black uppercase tracking-widest text-gray-600">Deadline</div>
<div className="text-[9px] font-black uppercase tracking-widest text-gray-600">Vencimiento</div>
<div className={`text-[10px] font-bold ${new Date(lesson.due_date) < new Date() ? 'text-red-400' : 'text-blue-400'}`}>
{new Date(lesson.due_date).toLocaleDateString()}
</div>