Something went wrong. Try again.
This repository has no description
Something went wrong. Try again.
1.3 kB · 26 lines
TSX
123456789101112131415161718192021222324252627import { useTranslation } from "react-i18next";
// Inline "stream offline" overlay rendered on top of the video element// when the streamer is not currently live. Distinct from the// page-level offline state in routes/$user.tsx (which replaces the// whole player); this is for the in-page "stream is offline, the// page is still here" case.export function UserOffline({ user }: { user: string }) { const { t } = useTranslation("common"); return ( <div className="absolute inset-0 flex items-center justify-center bg-black/55 px-4"> <div className="flex max-w-sm flex-col items-center rounded-2xl border border-white/10 bg-black/45 px-6 py-5 text-center shadow-2xl backdrop-blur-md"> <span className="mb-3 flex items-center gap-2 rounded-full border border-white/15 bg-white/8 px-2.5 py-1 text-[11px] font-semibold tracking-[0.16em] text-white/70 uppercase"> <span className="h-1.5 w-1.5 rounded-full bg-(--color-accent)" /> {t("offline")} </span> <div className="font-display text-xl font-semibold text-white/95"> {t("stream-offline")} </div> <div className="mt-1 text-sm text-white/65"> {t("user-not-streaming", { user })} </div> </div> </div> );}