39 lines
1.3 KiB
TypeScript
39 lines
1.3 KiB
TypeScript
|
import { Heart } from "lucide-react";
|
||
|
|
import { Link } from "react-router-dom";
|
||
|
|
import { useI18n } from "../../i18n";
|
||
|
|
|
||
|
|
export default function Favorites() {
|
||
|
|
const { t } = useI18n();
|
||
|
|
|
||
|
|
return (
|
||
|
|
<div className="flex min-h-[60vh] flex-col items-center justify-center gap-5 px-4 py-12 text-center">
|
||
|
|
<div className="flex h-20 w-20 items-center justify-center rounded-full border border-ark-gold/30 bg-ark-gold/5">
|
||
|
|
<Heart
|
||
|
|
className="h-10 w-10 text-ark-gold/70"
|
||
|
|
strokeWidth={1.8}
|
||
|
|
aria-hidden
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<h1 className="text-2xl font-semibold text-neutral-100 md:text-3xl">
|
||
|
|
{t("favorites")}
|
||
|
|
</h1>
|
||
|
|
|
||
|
|
<p className="text-base font-medium text-ark-gold2 md:text-lg">
|
||
|
|
{t("favoritesComingSoon")}
|
||
|
|
</p>
|
||
|
|
|
||
|
|
<p className="max-w-md text-sm leading-relaxed text-neutral-400 md:text-base">
|
||
|
|
{t("favoritesComingSoonDesc")}
|
||
|
|
</p>
|
||
|
|
|
||
|
|
<Link
|
||
|
|
to="/"
|
||
|
|
className="mt-4 inline-flex h-11 items-center justify-center rounded-full border border-ark-gold/60 bg-ark-gold/10 px-6 text-sm font-medium text-ark-gold transition hover:bg-ark-gold/20 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ark-gold/80 focus-visible:ring-offset-2 focus-visible:ring-offset-ark-bg"
|
||
|
|
>
|
||
|
|
{t("backToHome")}
|
||
|
|
</Link>
|
||
|
|
</div>
|
||
|
|
);
|
||
|
|
}
|