mirrors/smov
mirrors/smov
1
0
Fork 0
mirror of https://github.com/sussy-code/smov.git synced 2024-12-20 14:37:43 +01:00
Code Issues Wiki Activity

Use useIsMobile to only show the text on large displays

Browse source
This commit is contained in:
Cooper Ransom 2024-03-26 13:14:57 -04:00
parent 657b63858c
commit cfd43c789d
1 changed files with 10 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
src/components/layout/BrandPill.tsx
View file

@ -2,13 +2,14 @@ import classNames from "classnames";
import { useTranslation } from "react-i18next"; import { useTranslation } from "react-i18next";
import { Icon, Icons } from "@/components/Icon"; import { Icon, Icons } from "@/components/Icon";
import { useIsMobile } from "@/hooks/useIsMobile";
export function BrandPill(props: { export function BrandPill(props: {
clickable?: boolean; clickable?: boolean;
// hideTextOnMobile?: boolean;
backgroundClass?: string; backgroundClass?: string;
}) { }) {
const { t } = useTranslation(); const { t } = useTranslation();
const isMobile = useIsMobile();
return ( return (
<div <div
@ -21,6 +22,14 @@ export function BrandPill(props: {
)} )}
> >
<Icon className="text-2xl" icon={Icons.MOVIE_WEB} /> <Icon className="text-2xl" icon={Icons.MOVIE_WEB} />
<span
className={[
"font-semibold text-white",
isMobile ? "hidden sm:block" : "",
].join(" ")}
>
{t("global.name")}
</span>
</div> </div>
); );
} }