Add recommendation tooltips

This commit is contained in:
Braydon 2024-04-22 01:04:06 -04:00
parent f021eb4809
commit 3c912a4591

@ -5,6 +5,8 @@ import { ServerPlatform } from "restfulmc-lib";
import { Button } from "@/components/ui/button"; import { Button } from "@/components/ui/button";
import Image from "next/image"; import Image from "next/image";
import Link from "next/link"; import Link from "next/link";
import SimpleTooltip from "@/components/simple-tooltip";
import { capitalize } from "@/lib/string-utils";
/** /**
* The recommendations for a server. * The recommendations for a server.
@ -45,18 +47,22 @@ const ServerRecommendations = (): ReactElement => (
index: number index: number
): ReactElement => ( ): ReactElement => (
<Link key={index} href={`/server/${platform}/${hostname}`}> <Link key={index} href={`/server/${platform}/${hostname}`}>
<Button <SimpleTooltip
className="px-10 flex gap-2.5 font-semibold hover:opacity-85 transition-all transform-gpu" content={`Click to test ${capitalize(platform)} server`}
variant="outline"
> >
<Image <Button
src={`/media/platform/${platform}.png`} className="px-10 flex gap-2.5 font-semibold hover:opacity-85 transition-all transform-gpu"
alt="" variant="outline"
width={26} >
height={26} <Image
/> src={`/media/platform/${platform}.png`}
<span>{hostname}</span> alt=""
</Button> width={26}
height={26}
/>
<span>{hostname}</span>
</Button>
</SimpleTooltip>
</Link> </Link>
) )
)} )}