Add top bar with hotel logo, language switcher, and theme toggle
This commit is contained in:
1 parent
4457117fa9
commit
a82cf7d2a1
1 file changed
+29
@@ -74,6 +74,35 @@ export default async function Home() {
|
||||
return (
|
||||
<div className="flex flex-col gap-10 pb-14">
|
||||
|
||||
{/* ── Top Bar ── */}
|
||||
<Reveal>
|
||||
<div className="relative flex items-center justify-between rounded-xl border px-5 py-3" style={{
|
||||
background: "color-mix(in srgb, var(--color-surface) 60%, transparent)",
|
||||
backdropFilter: "blur(14px)",
|
||||
WebkitBackdropFilter: "blur(14px)",
|
||||
borderColor: "color-mix(in srgb, var(--color-text-muted) 8%, transparent)",
|
||||
}}>
|
||||
<div className="flex items-center gap-3">
|
||||
<Image
|
||||
src="/assets/images/icons/navigation/home.png"
|
||||
alt={hotelName}
|
||||
width={28}
|
||||
height={28}
|
||||
className="shrink-0"
|
||||
unoptimized
|
||||
/>
|
||||
<span className="text-sm font-extrabold uppercase tracking-wide" style={{ color: "var(--color-text-readable)" }}>
|
||||
{hotelName}
|
||||
</span>
|
||||
</div>
|
||||
<div className="flex items-center gap-1">
|
||||
<LanguageSwitcher />
|
||||
<div className="w-px h-5 mx-1" style={{ background: "color-mix(in srgb, var(--color-text-muted) 12%, transparent)" }} />
|
||||
<ThemeSwitcher />
|
||||
</div>
|
||||
</div>
|
||||
</Reveal>
|
||||
|
||||
{/* ── Hero ── */}
|
||||
<Reveal>
|
||||
<div
|
||||
|
||||
Reference in new issue
Block a user