Update TypeScript build information.

This commit is contained in:
2026-03-02 14:46:19 -03:00
parent 420003f2d5
commit fe730998a9
6 changed files with 181 additions and 91 deletions
+4 -4
View File
@@ -46,18 +46,18 @@ export default function AppHeader() {
<div className="flex items-center gap-4"> <div className="flex items-center gap-4">
<nav className="hidden md:flex items-center gap-8 mr-4" aria-label="Navegación principal"> <nav className="hidden md:flex items-center gap-8 mr-4" aria-label="Navegación principal">
<Link href="/" className="nav-link-standard text-slate-600 dark:text-gray-400 hover:text-gray-900 dark:hover:text-white"> <Link href="/" className="flex items-center gap-2 text-base font-black uppercase tracking-wider transition-colors text-slate-800 dark:text-gray-200 hover:text-gray-900 dark:hover:text-white">
{t('nav.catalog')} {t('nav.catalog')}
</Link> </Link>
<Link href="/my-learning" className="nav-link-standard text-slate-600 dark:text-gray-400 hover:text-gray-900 dark:hover:text-white"> <Link href="/my-learning" className="flex items-center gap-2 text-base font-black uppercase tracking-wider transition-colors text-slate-800 dark:text-gray-200 hover:text-gray-900 dark:hover:text-white">
{t('nav.myLearning')} {t('nav.myLearning')}
</Link> </Link>
<Link href="/bookmarks" className="nav-link-standard text-slate-600 dark:text-gray-400 hover:text-gray-900 dark:hover:text-white"> <Link href="/bookmarks" className="flex items-center gap-2 text-base font-black uppercase tracking-wider transition-colors text-slate-800 dark:text-gray-200 hover:text-gray-900 dark:hover:text-white">
{t('nav.bookmarks')} {t('nav.bookmarks')}
</Link> </Link>
{user && ( {user && (
<Link href={`/profile/${user.id}`} className="nav-link-standard text-blue-600 dark:text-blue-400 hover:text-blue-700 dark:hover:text-blue-300"> <Link href={`/profile/${user.id}`} className="flex items-center gap-2 text-base font-black uppercase tracking-wider transition-colors text-blue-600 dark:text-blue-400 hover:text-blue-700 dark:hover:text-blue-300">
MI PORTAFOLIO MI PORTAFOLIO
</Link> </Link>
)} )}
+3 -3
View File
@@ -43,9 +43,9 @@ export default function AdminLayout({ children }: { children: React.ReactNode })
<Link <Link
key={item.href} key={item.href}
href={item.href} href={item.href}
className={`flex items-center gap-3 px-4 py-3 rounded-xl font-bold text-sm transition-all ${pathname === item.href className={`flex items-center gap-3 px-4 py-3 rounded-xl font-black text-base transition-all ${pathname === item.href
? "bg-indigo-600 text-white shadow-lg shadow-indigo-500/30" ? "bg-indigo-600 text-white shadow-lg shadow-indigo-500/30"
: "text-slate-500 hover:text-slate-900 dark:text-gray-400 dark:hover:text-white hover:bg-slate-100 dark:hover:bg-white/5 border border-transparent" : "text-slate-600 hover:text-slate-900 dark:text-gray-200 dark:hover:text-white hover:bg-slate-100 dark:hover:bg-white/5 border border-transparent"
}`} }`}
> >
<item.icon size={18} /> <item.icon size={18} />
@@ -57,7 +57,7 @@ export default function AdminLayout({ children }: { children: React.ReactNode })
<div className="pt-6 border-t border-slate-200 dark:border-white/5"> <div className="pt-6 border-t border-slate-200 dark:border-white/5">
<Link <Link
href="/" href="/"
className="flex items-center gap-2 text-xs font-black uppercase tracking-widest text-slate-400 dark:text-gray-600 hover:text-slate-900 dark:hover:text-white transition-colors" className="flex items-center gap-2 text-sm font-bold uppercase tracking-widest text-slate-400 dark:text-gray-600 hover:text-slate-900 dark:hover:text-white transition-colors"
> >
<ArrowLeft size={14} /> <ArrowLeft size={14} />
Back to Studio Back to Studio
+2 -2
View File
@@ -239,7 +239,7 @@ export default function CourseEditor({ params }: { params: { id: string } }) {
</h1> </h1>
<div className="flex items-center gap-3 mt-1"> <div className="flex items-center gap-3 mt-1">
<p className="text-gray-600 dark:text-gray-400">Design your course structure and lesson content for {course?.title}</p> <p className="text-gray-600 dark:text-gray-400">Design your course structure and lesson content for {course?.title}</p>
<span className={`text-[10px] uppercase font-bold px-2 py-0.5 rounded ${course?.pacing_mode === 'instructor_led' ? 'bg-purple-500/10 dark:bg-purple-500/20 text-purple-600 dark:text-purple-400' : 'bg-green-500/10 dark:bg-green-500/20 text-green-600 dark:text-green-400'}`}> <span className={`text-xs uppercase font-bold px-2 py-0.5 rounded ${course?.pacing_mode === 'instructor_led' ? 'bg-purple-500/10 dark:bg-purple-500/20 text-purple-600 dark:text-purple-400' : 'bg-green-500/10 dark:bg-green-500/20 text-green-600 dark:text-green-400'}`}>
{course?.pacing_mode?.replace('_', ' ') || 'Self Paced'} {course?.pacing_mode?.replace('_', ' ') || 'Self Paced'}
</span> </span>
</div> </div>
@@ -392,7 +392,7 @@ export default function CourseEditor({ params }: { params: { id: string } }) {
> >
{lesson.title} {lesson.title}
</span> </span>
<div className="flex items-center gap-3 text-[10px] text-gray-500 uppercase mt-0.5 font-semibold"> <div className="flex items-center gap-3 text-xs text-gray-500 uppercase mt-0.5 font-bold">
<span>{lesson.content_type}</span> <span>{lesson.content_type}</span>
{lesson.due_date && ( {lesson.due_date && (
<div className="flex items-center gap-1 text-orange-600 dark:text-orange-400"> <div className="flex items-center gap-1 text-orange-600 dark:text-orange-400">
+132 -31
View File
@@ -3,61 +3,162 @@
import React from "react"; import React from "react";
import Link from "next/link"; import Link from "next/link";
import { useParams } from "next/navigation"; import { useParams } from "next/navigation";
import { Layout, CheckCircle2, Calendar, BarChart2, Settings, Folder, GraduationCap, Megaphone, Users, Award, Video } from "lucide-react"; import {
Layout, CheckCircle2, BarChart2, Settings, Folder,
GraduationCap, Megaphone, Users, Award, Video,
BookOpen, ShieldCheck, Radio, TrendingUp
} from "lucide-react";
type TabKey =
| "outline"
| "grading"
| "rubrics"
| "calendar"
| "analytics"
| "settings"
| "files"
| "grades"
| "announcements"
| "team"
| "peer-reviews"
| "students"
| "sessions";
interface CourseEditorLayoutProps { interface CourseEditorLayoutProps {
children: React.ReactNode; children: React.ReactNode;
activeTab: "outline" | "grading" | "rubrics" | "calendar" | "analytics" | "settings" | "files" | "grades" | "announcements" | "team" | "peer-reviews" | "students" | "sessions"; activeTab: TabKey;
}
interface Tab {
key: TabKey;
label: string;
icon: React.ElementType;
href: string;
}
interface Group {
key: string;
label: string;
icon: React.ElementType;
tabs: Tab[];
} }
export default function CourseEditorLayout({ children, activeTab }: CourseEditorLayoutProps) { export default function CourseEditorLayout({ children, activeTab }: CourseEditorLayoutProps) {
const { id } = useParams() as { id: string }; const { id } = useParams() as { id: string };
const tabs = [ const groups: Group[] = [
{ key: "outline", label: "Outline", icon: Layout, href: `/courses/${id}` }, {
{ key: "grading", label: "Grading Policy", icon: CheckCircle2, href: `/courses/${id}/grading` }, key: "content",
{ key: "rubrics", label: "Rubrics", icon: Layout, href: `/courses/${id}/rubrics` }, label: "Contenido",
{ key: "team", label: "Team", icon: GraduationCap, href: `/courses/${id}/team` }, icon: BookOpen,
{ key: "students", label: "Students & Groups", icon: Users, href: `/courses/${id}/students` }, tabs: [
{ key: "grades", label: "Gradebook", icon: GraduationCap, href: `/courses/${id}/grades` }, { key: "outline", label: "Outline", icon: Layout, href: `/courses/${id}` },
{ key: "peer-reviews", label: "Peer Reviews", icon: Award, href: `/courses/${id}/peer-reviews` }, { key: "files", label: "Archivos", icon: Folder, href: `/courses/${id}/files` },
{ key: "sessions", label: "Live Sessions", icon: Video, href: `/courses/${id}/sessions` }, { key: "sessions", label: "Sesiones en Vivo", icon: Video, href: `/courses/${id}/sessions` },
{ key: "announcements", label: "Announcements", icon: Megaphone, href: `/courses/${id}/announcements` }, ],
{ key: "calendar", label: "Calendar", icon: Calendar, href: `/courses/${id}/calendar` }, },
{ key: "analytics", label: "Analytics", icon: BarChart2, href: `/courses/${id}/analytics` }, {
{ key: "files", label: "Files & Uploads", icon: Folder, href: `/courses/${id}/files` }, key: "assessment",
{ key: "settings", label: "Settings", icon: Settings, href: `/courses/${id}/settings` }, label: "Evaluación",
icon: CheckCircle2,
tabs: [
{ key: "grading", label: "Política de Notas", icon: CheckCircle2, href: `/courses/${id}/grading` },
{ key: "rubrics", label: "Rúbricas", icon: Award, href: `/courses/${id}/rubrics` },
{ key: "grades", label: "Libro de Notas", icon: GraduationCap, href: `/courses/${id}/grades` },
{ key: "peer-reviews", label: "Revisión entre Pares", icon: ShieldCheck, href: `/courses/${id}/peer-reviews` },
],
},
{
key: "people",
label: "Personas",
icon: Users,
tabs: [
{ key: "team", label: "Equipo", icon: Users, href: `/courses/${id}/team` },
{ key: "students", label: "Estudiantes y Grupos", icon: GraduationCap, href: `/courses/${id}/students` },
],
},
{
key: "communication",
label: "Comunicación",
icon: Radio,
tabs: [
{ key: "announcements", label: "Anuncios", icon: Megaphone, href: `/courses/${id}/announcements` },
{ key: "calendar", label: "Calendario", icon: Radio, href: `/courses/${id}/calendar` },
],
},
{
key: "admin",
label: "Administración",
icon: TrendingUp,
tabs: [
{ key: "analytics", label: "Analíticas", icon: BarChart2, href: `/courses/${id}/analytics` },
{ key: "settings", label: "Configuración", icon: Settings, href: `/courses/${id}/settings` },
],
},
]; ];
// Find which group contains the active tab
const activeGroup = groups.find((g) => g.tabs.some((t) => t.key === activeTab));
const subTabs = activeGroup?.tabs ?? [];
return ( return (
<div className="space-y-8"> <div className="space-y-0">
{/* Tabs Navigation */} {/* PRIMARY GROUP NAV */}
<nav className="glass p-1 bg-black/[0.02] dark:bg-white/[0.02] border border-black/5 dark:border-white/5 rounded-xl" aria-label="Course editor tabs"> <nav
<ul className="flex border-b border-black/5 dark:border-white/10 overflow-x-auto scrollbar-thin scrollbar-thumb-black/10 dark:scrollbar-thumb-white/10 scrollbar-track-transparent"> className="bg-white dark:bg-black/20 border border-black/8 dark:border-white/8 rounded-t-xl overflow-hidden"
{tabs.map((tab) => { aria-label="Grupos del editor de cursos"
const Icon = tab.icon; >
const isActive = tab.key === activeTab; <ul className="flex border-b border-black/8 dark:border-white/8">
{groups.map((group) => {
const Icon = group.icon;
const isGroupActive = group.key === activeGroup?.key;
// When clicking a group, go to its first tab
const groupHref = group.tabs[0].href;
return ( return (
<li key={tab.key} className="flex-shrink-0"> <li key={group.key} className="flex-shrink-0">
<Link <Link
href={tab.href} href={groupHref}
aria-current={isActive ? "page" : undefined} className={`flex items-center gap-2 px-6 py-3 text-sm font-black uppercase tracking-wider transition-all border-b-2 whitespace-nowrap ${isGroupActive
className={`nav-link-standard px-4 py-3 border-b-2 whitespace-nowrap ${isActive ? "border-blue-600 dark:border-blue-400 text-blue-600 dark:text-blue-400 bg-blue-50 dark:bg-blue-900/10"
? "border-blue-600 dark:border-blue-500 text-blue-600 dark:text-white" : "border-transparent text-slate-500 dark:text-gray-400 hover:text-slate-800 dark:hover:text-gray-100 hover:bg-slate-50 dark:hover:bg-white/5"
: "border-transparent text-slate-600 dark:text-gray-400 hover:text-gray-900 dark:hover:text-white"
}`} }`}
> >
<Icon className="w-4 h-4 flex-shrink-0" aria-hidden="true" /> <Icon className="w-4 h-4 flex-shrink-0" aria-hidden="true" />
{tab.label} {group.label}
</Link> </Link>
</li> </li>
); );
})} })}
</ul> </ul>
{/* SECONDARY SUB-TAB NAV */}
{subTabs.length > 1 && (
<ul className="flex bg-slate-50 dark:bg-white/[0.03] border-b border-black/5 dark:border-white/5 px-2 gap-1" aria-label="Sub-secciones">
{subTabs.map((tab) => {
const Icon = tab.icon;
const isActive = tab.key === activeTab;
return (
<li key={tab.key} className="flex-shrink-0">
<Link
href={tab.href}
aria-current={isActive ? "page" : undefined}
className={`flex items-center gap-1.5 px-4 py-2 my-1 text-xs font-bold uppercase tracking-wider rounded-lg transition-all whitespace-nowrap ${isActive
? "bg-blue-600 text-white shadow-sm shadow-blue-500/30"
: "text-slate-500 dark:text-gray-400 hover:text-slate-800 dark:hover:text-gray-100 hover:bg-black/5 dark:hover:bg-white/5"
}`}
>
<Icon className="w-3.5 h-3.5 flex-shrink-0" aria-hidden="true" />
{tab.label}
</Link>
</li>
);
})}
</ul>
)}
</nav> </nav>
{/* Content */} {/* Content */}
<div className="space-y-6"> <div className="pt-6 space-y-6">
{children} {children}
</div> </div>
</div> </div>
+39 -50
View File
@@ -9,6 +9,12 @@ import { useTheme } from '@/context/ThemeContext';
import { getImageUrl } from '@/lib/api'; import { getImageUrl } from '@/lib/api';
import Image from 'next/image'; import Image from 'next/image';
// Clase base para TODOS los links de nav — idéntica para todos
const NAV_LINK = "flex items-center gap-2 text-sm font-bold uppercase tracking-wide transition-colors text-slate-700 dark:text-gray-300 hover:text-blue-600 dark:hover:text-blue-400";
// Admin variant — mismo tamaño pero con acento añil
const NAV_LINK_ADMIN = "flex items-center gap-2 text-sm font-bold uppercase tracking-wide transition-colors text-indigo-600 dark:text-indigo-400 hover:text-indigo-500 dark:hover:text-indigo-300";
export function Navbar() { export function Navbar() {
const { t, language, setLanguage } = useTranslation(); const { t, language, setLanguage } = useTranslation();
const { user, logout } = useAuth(); const { user, logout } = useAuth();
@@ -20,6 +26,8 @@ export function Navbar() {
return ( return (
<nav className="fixed top-0 w-full z-50 glass border-b border-black/5 dark:border-white/10 bg-gray-50/70 dark:bg-black/40 backdrop-blur-xl"> <nav className="fixed top-0 w-full z-50 glass border-b border-black/5 dark:border-white/10 bg-gray-50/70 dark:bg-black/40 backdrop-blur-xl">
<div className="max-w-7xl mx-auto px-4 h-16 flex items-center justify-between"> <div className="max-w-7xl mx-auto px-4 h-16 flex items-center justify-between">
{/* Logo */}
<Link href="/" className="flex items-center gap-2 md:gap-4 group" aria-label={`${platformName} Studio - Dashboard`}> <Link href="/" className="flex items-center gap-2 md:gap-4 group" aria-label={`${platformName} Studio - Dashboard`}>
<div className={`rounded-lg md:rounded-xl bg-blue-600 flex items-center justify-center font-black text-white shadow-lg shadow-blue-500/20 group-hover:scale-105 transition-all overflow-hidden relative border border-white/5 ${branding?.logo_variant === 'wide' ? 'w-32 h-8 md:w-48 md:h-10 px-2 bg-white' : 'w-8 h-8 md:w-10 md:h-10'}`}> <div className={`rounded-lg md:rounded-xl bg-blue-600 flex items-center justify-center font-black text-white shadow-lg shadow-blue-500/20 group-hover:scale-105 transition-all overflow-hidden relative border border-white/5 ${branding?.logo_variant === 'wide' ? 'w-32 h-8 md:w-48 md:h-10 px-2 bg-white' : 'w-8 h-8 md:w-10 md:h-10'}`}>
{branding?.logo_url ? ( {branding?.logo_url ? (
@@ -35,88 +43,71 @@ export function Navbar() {
<span className="font-black text-sm md:text-lg tracking-tighter text-gray-900 dark:text-white leading-none"> <span className="font-black text-sm md:text-lg tracking-tighter text-gray-900 dark:text-white leading-none">
{platformName.toUpperCase()} {platformName.toUpperCase()}
</span> </span>
<span className="text-[8px] md:text-[10px] font-black tracking-widest text-blue-600 dark:text-blue-500 uppercase">STUDIO</span> <span className="text-[10px] font-black tracking-widest text-blue-600 dark:text-blue-500 uppercase">STUDIO</span>
</div> </div>
)} )}
</Link> </Link>
{/* Primary Navigation */}
<div className="flex items-center gap-6"> <div className="flex items-center gap-6">
<div className="flex items-center gap-4"> <div className="flex items-center gap-5">
<Link
href="/" <Link href="/" className={NAV_LINK}>
className="nav-link-standard text-slate-600 dark:text-gray-400 hover:text-blue-600 dark:hover:text-blue-400" <LayoutDashboard className="w-4 h-4 shrink-0" />
>
<LayoutDashboard className="w-4 h-4" />
{t('nav.courses')} {t('nav.courses')}
</Link> </Link>
<Link <Link href="/library/assets" className={NAV_LINK}>
href="/library/assets" <Library className="w-4 h-4 shrink-0" aria-hidden="true" />
className="nav-link-standard text-slate-600 dark:text-gray-400 hover:text-blue-600 dark:hover:text-blue-400"
>
<Library className="w-4 h-4" aria-hidden="true" />
{t('nav.library') || 'Library'} {t('nav.library') || 'Library'}
</Link> </Link>
{user?.role === 'admin' && ( {user?.role === 'admin' && (
<> <>
{user.organization_id === '00000000-0000-0000-0000-000000000001' && ( {user.organization_id === '00000000-0000-0000-0000-000000000001' && (
<Link <Link href="/admin" className={NAV_LINK_ADMIN}>
href="/admin" <ShieldCheck className="w-4 h-4 shrink-0" aria-hidden="true" />
className="text-sm font-black text-indigo-400 hover:text-indigo-300 transition-colors flex items-center gap-2 bg-indigo-500/10 px-3 py-1.5 rounded-lg border border-indigo-500/20 shadow-glow-sm uppercase tracking-wider"
>
<ShieldCheck className="w-4 h-4" aria-hidden="true" />
{t('nav.globalControl')} {t('nav.globalControl')}
</Link> </Link>
)} )}
<Link <Link href="/settings/webhooks" className={NAV_LINK}>
href="/settings/webhooks" <Webhook className="w-4 h-4 shrink-0" />
className="nav-link-standard text-slate-600 dark:text-gray-400 hover:text-blue-400"
>
<Webhook className="w-4 h-4" />
{t('nav.webhooks')} {t('nav.webhooks')}
</Link> </Link>
<Link <Link href="/profile" className={NAV_LINK}>
href="/profile" <Settings className="w-4 h-4 shrink-0" />
className="nav-link-standard text-slate-600 dark:text-gray-400 hover:text-blue-400"
>
<Settings className="w-4 h-4" />
{t('nav.profile')} {t('nav.profile')}
</Link> </Link>
</> </>
)} )}
<Link <Link href="/settings" className={NAV_LINK}>
href="/settings" <Settings className="w-4 h-4 shrink-0" />
className="nav-link-standard text-slate-600 dark:text-gray-400 hover:text-blue-400" {t('nav.settings') || 'Settings'}
>
<Settings className="w-4 h-4" />
Settings
</Link> </Link>
</div> </div>
<div className="h-6 w-px bg-white/10 mx-2" /> <div className="h-6 w-px bg-black/10 dark:bg-white/10 mx-1" />
{/* Theme Toggle */} {/* Theme Toggle */}
<button <button
onClick={toggleTheme} onClick={toggleTheme}
className="p-2 hover:bg-white/5 rounded-lg text-gray-400 hover:text-white transition-all" className="p-2 hover:bg-black/5 dark:hover:bg-white/5 rounded-lg text-slate-500 hover:text-slate-900 dark:text-gray-400 dark:hover:text-white transition-all"
title={theme === 'dark' ? 'Switch to Light Mode' : 'Switch to Dark Mode'} title={theme === 'dark' ? 'Cambiar a Modo Claro' : 'Cambiar a Modo Oscuro'}
aria-label={theme === 'dark' ? 'Switch to Light Mode' : 'Switch to Dark Mode'} aria-label={theme === 'dark' ? 'Cambiar a Modo Claro' : 'Cambiar a Modo Oscuro'}
> >
{theme === 'dark' ? <Sun className="w-4 h-4" /> : <Moon className="w-4 h-4" />} {theme === 'dark' ? <Sun className="w-4 h-4" /> : <Moon className="w-4 h-4" />}
</button> </button>
<div className="h-6 w-px bg-white/10 mx-2" /> {/* Language */}
<div className="flex items-center gap-2"> <div className="flex items-center gap-1.5">
<Globe className="w-4 h-4 text-gray-500" aria-hidden="true" /> <Globe className="w-4 h-4 text-gray-500" aria-hidden="true" />
<select <select
id="studio-language-selector" id="studio-language-selector"
value={language} value={language}
onChange={(e) => setLanguage(e.target.value)} onChange={(e) => setLanguage(e.target.value)}
aria-label={t('nav.selectLanguage') || 'Select Language'} aria-label={t('nav.selectLanguage') || 'Select Language'}
className="bg-transparent text-[10px] font-black uppercase tracking-widest text-gray-400 hover:text-white transition-colors focus:outline-none cursor-pointer" className="bg-transparent text-xs font-bold uppercase tracking-widest text-slate-600 dark:text-gray-400 hover:text-slate-900 dark:hover:text-white transition-colors focus:outline-none cursor-pointer"
> >
<option value="en" className="bg-white dark:bg-gray-900">EN</option> <option value="en" className="bg-white dark:bg-gray-900">EN</option>
<option value="es" className="bg-white dark:bg-gray-900">ES</option> <option value="es" className="bg-white dark:bg-gray-900">ES</option>
@@ -124,17 +115,18 @@ export function Navbar() {
</select> </select>
</div> </div>
<div className="h-6 w-px bg-white/10 mx-2" /> <div className="h-6 w-px bg-black/10 dark:bg-white/10 mx-1" />
{/* User info */}
{user ? ( {user ? (
<div className="flex items-center gap-4"> <div className="flex items-center gap-3">
<div className="flex flex-col items-end"> <div className="flex flex-col items-end">
<span className="text-xs font-medium text-gray-900 dark:text-white">{user.full_name}</span> <span className="text-sm font-bold text-gray-900 dark:text-white leading-tight">{user.full_name}</span>
<span className="text-[10px] text-gray-500 uppercase tracking-wider">{user.role}</span> <span className="text-xs text-slate-500 dark:text-gray-500 uppercase tracking-widest font-bold">{user.role}</span>
</div> </div>
<button <button
onClick={logout} onClick={logout}
className="p-2 hover:bg-red-500/10 hover:text-red-600 dark:hover:text-red-400 rounded-lg transition-all text-gray-500" className="p-2 hover:bg-red-500/10 hover:text-red-600 dark:hover:text-red-400 rounded-lg transition-all text-gray-400"
title={t('nav.signOut') || "Sign Out"} title={t('nav.signOut') || "Sign Out"}
aria-label={t('nav.signOut') || "Sign Out"} aria-label={t('nav.signOut') || "Sign Out"}
> >
@@ -142,10 +134,7 @@ export function Navbar() {
</button> </button>
</div> </div>
) : ( ) : (
<Link <Link href="/auth/login" className="text-sm font-bold text-blue-600 hover:text-blue-500 transition-colors">
href="/auth/login"
className="text-sm font-medium text-blue-400 hover:text-blue-300 transition-colors"
>
Sign In Sign In
</Link> </Link>
)} )}
File diff suppressed because one or more lines are too long