feat: add Habbo pixel font to logo generator, revert site-header toggle
This commit is contained in:
1 parent
4f79d5a0ae
commit
98506fea1e
3 files changed
+19
-45
No files matched your search
@@ -14,8 +14,9 @@ import { ContentCard } from "@/components/public/ui";
|
|||||||
|
|
||||||
type FontOption = { label: string; stack: string };
|
type FontOption = { label: string; stack: string };
|
||||||
|
|
||||||
// ~6 fun, broadly-available stacks (web-safe + a Google-ish first pick).
|
// ~8 fun, broadly-available stacks (web-safe + a Google-ish first pick).
|
||||||
const FONTS: FontOption[] = [
|
const FONTS: FontOption[] = [
|
||||||
|
{ label: "Habbo pixel", stack: "var(--font-pixel), 'Courier New', monospace" },
|
||||||
{ label: "Poppins (rounded)", stack: "'Poppins', 'Trebuchet MS', sans-serif" },
|
{ label: "Poppins (rounded)", stack: "'Poppins', 'Trebuchet MS', sans-serif" },
|
||||||
{ label: "Comic Sans (playful)", stack: "'Comic Sans MS', 'Comic Sans', cursive" },
|
{ label: "Comic Sans (playful)", stack: "'Comic Sans MS', 'Comic Sans', cursive" },
|
||||||
{ label: "Georgia (classic serif)", stack: "Georgia, 'Times New Roman', serif" },
|
{ label: "Georgia (classic serif)", stack: "Georgia, 'Times New Roman', serif" },
|
||||||
|
|||||||
@@ -1,42 +0,0 @@
|
|||||||
"use client";
|
|
||||||
|
|
||||||
import { useState } from "react";
|
|
||||||
import Link from "next/link";
|
|
||||||
|
|
||||||
interface SiteHeaderTitleProps {
|
|
||||||
hotelName: string;
|
|
||||||
logo: string;
|
|
||||||
}
|
|
||||||
|
|
||||||
export function SiteHeaderTitle({ hotelName, logo }: SiteHeaderTitleProps) {
|
|
||||||
const [showLogo, setShowLogo] = useState(!!logo);
|
|
||||||
|
|
||||||
return (
|
|
||||||
<Link
|
|
||||||
href="/"
|
|
||||||
className="transition-transform duration-300 hover:scale-105 mb-8 block"
|
|
||||||
onClick={(e) => {
|
|
||||||
if (logo) {
|
|
||||||
e.preventDefault();
|
|
||||||
setShowLogo((prev) => !prev);
|
|
||||||
}
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{showLogo && logo ? (
|
|
||||||
<img className="drop-shadow-2xl block mx-auto" src={logo} alt={hotelName} style={{ maxHeight: 120 }} />
|
|
||||||
) : (
|
|
||||||
<h1
|
|
||||||
className="text-center font-extrabold tracking-tight leading-none text-white"
|
|
||||||
style={{
|
|
||||||
fontSize: "clamp(2.5rem, 7vw, 4.5rem)",
|
|
||||||
textShadow: "0 2px 20px rgba(0,0,0,0.4), 0 8px 40px rgba(0,0,0,0.2)",
|
|
||||||
letterSpacing: "-0.02em",
|
|
||||||
fontFamily: "var(--font-pixel), monospace",
|
|
||||||
}}
|
|
||||||
>
|
|
||||||
{hotelName} - Hotel
|
|
||||||
</h1>
|
|
||||||
)}
|
|
||||||
</Link>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
@@ -1,8 +1,8 @@
|
|||||||
import { getTranslations } from "next-intl/server";
|
import { getTranslations } from "next-intl/server";
|
||||||
|
import Link from "next/link";
|
||||||
import { auth } from "@/lib/auth";
|
import { auth } from "@/lib/auth";
|
||||||
import { prisma } from "@/lib/prisma";
|
import { prisma } from "@/lib/prisma";
|
||||||
import { siteSettings } from "@/lib/services/site-settings";
|
import { siteSettings } from "@/lib/services/site-settings";
|
||||||
import { SiteHeaderTitle } from "@/components/site-header-title";
|
|
||||||
|
|
||||||
export async function SiteHeader() {
|
export async function SiteHeader() {
|
||||||
const t = await getTranslations("header");
|
const t = await getTranslations("header");
|
||||||
@@ -44,7 +44,22 @@ export async function SiteHeader() {
|
|||||||
|
|
||||||
{/* Content */}
|
{/* Content */}
|
||||||
<div className="relative flex flex-col items-center justify-center px-4 py-12 min-h-[18rem]">
|
<div className="relative flex flex-col items-center justify-center px-4 py-12 min-h-[18rem]">
|
||||||
<SiteHeaderTitle hotelName={hotelName ?? "Atom"} logo={logo ?? ""} />
|
<Link href="/" className="transition-transform duration-300 hover:scale-105 mb-8">
|
||||||
|
{logo ? (
|
||||||
|
<img className="drop-shadow-2xl block" src={logo} alt={hotelName ?? "Hotel"} style={{ maxHeight: 120 }} />
|
||||||
|
) : (
|
||||||
|
<h1
|
||||||
|
className="text-center font-extrabold tracking-tight leading-none text-white"
|
||||||
|
style={{
|
||||||
|
fontSize: "clamp(2.5rem, 7vw, 4.5rem)",
|
||||||
|
textShadow: "0 2px 20px rgba(0,0,0,0.4), 0 8px 40px rgba(0,0,0,0.2)",
|
||||||
|
letterSpacing: "-0.02em",
|
||||||
|
}}
|
||||||
|
>
|
||||||
|
{hotelName} - Hotel
|
||||||
|
</h1>
|
||||||
|
)}
|
||||||
|
</Link>
|
||||||
|
|
||||||
{/* Online badge */}
|
{/* Online badge */}
|
||||||
<div
|
<div
|
||||||
|
|||||||
Reference in new issue
Block a user