root
50 lines
2.0 KiB
TypeScript
50 lines
2.0 KiB
TypeScript
'use client'
|
|
|
|
import Link from 'next/link'
|
|
import { useAdminI18n } from '@/components/I18nProvider'
|
|
|
|
const languageMeta = {
|
|
en: { flag: '🇺🇸', shortLabel: 'EN' },
|
|
fr: { flag: '🇫🇷', shortLabel: 'FR' },
|
|
ar: { flag: '🇲🇦', shortLabel: 'AR' },
|
|
} as const
|
|
|
|
export default function PublicHeader() {
|
|
const { language } = useAdminI18n()
|
|
const currentLanguage = languageMeta[language]
|
|
const dict = {
|
|
en: {
|
|
admin: 'Admin Console',
|
|
signIn: 'Sign in',
|
|
},
|
|
fr: {
|
|
admin: 'Console admin',
|
|
signIn: 'Connexion',
|
|
},
|
|
ar: {
|
|
admin: 'لوحة الإدارة',
|
|
signIn: 'تسجيل الدخول',
|
|
},
|
|
}[language]
|
|
|
|
return (
|
|
<header className="sticky top-0 z-30 border-b border-stone-200/80 bg-white/78 backdrop-blur-xl transition-colors dark:border-blue-900 dark:bg-[#07101e]/76">
|
|
<div className="mx-auto flex max-w-6xl items-center justify-between gap-4 px-4 py-4">
|
|
<Link href="/" className="flex items-center gap-3">
|
|
<span className="text-xs font-semibold uppercase tracking-[0.24em] text-orange-700 dark:text-orange-300">RentalDriveGo</span>
|
|
<span className="hidden text-sm font-semibold text-stone-500 dark:text-stone-400 sm:inline">{dict.admin}</span>
|
|
</Link>
|
|
<nav className="flex items-center gap-2">
|
|
<span className="inline-flex min-w-[3.5rem] items-center justify-center gap-1 rounded-full border border-stone-200/80 bg-white/95 px-2.5 py-2 text-xs font-semibold text-stone-700 dark:border-blue-800 dark:bg-[#0d1b38]/85 dark:text-stone-200">
|
|
<span aria-hidden="true">{currentLanguage.flag}</span>
|
|
<span>{currentLanguage.shortLabel}</span>
|
|
</span>
|
|
<Link href="/login" className="rounded-full bg-blue-900 px-4 py-2 text-sm font-semibold text-white transition hover:bg-orange-700 dark:bg-orange-400 dark:text-white dark:hover:bg-orange-300">
|
|
{dict.signIn}
|
|
</Link>
|
|
</nav>
|
|
</div>
|
|
</header>
|
|
)
|
|
}
|