fix: fixing the spaced classNames

This commit is contained in:
dvelo 2024-08-08 18:02:46 -05:00
parent 9303f74b1c
commit c7e14c159b
12 changed files with 99 additions and 101 deletions

@ -3,7 +3,7 @@ import FavoritesView from "@/components/FavoritesView";
export default function Favorites() { export default function Favorites() {
return ( return (
<main> <main>
<div className=" pt-[60px] p-4"> <div className="pt-[60px] p-4">
<FavoritesView /> <FavoritesView />
</div> </div>
</main> </main>

@ -40,7 +40,7 @@ export default function FavoritesView() {
if (loading) { if (loading) {
return ( return (
<> <>
<Spinner className=" flex items-center" /> <Spinner className="flex items-center" />
<br /> <br />
</> </>
); );
@ -54,7 +54,7 @@ export default function FavoritesView() {
Your favorites are empty. Maybe favorite a server! Your favorites are empty. Maybe favorite a server!
</div> </div>
)} )}
<div className=" grid sm:grid-cols-4 gap-4"> <div className="grid sm:grid-cols-4 gap-4">
{apiFavorites.map((server: ServerResponse) => ( {apiFavorites.map((server: ServerResponse) => (
<Card key={server.name}> <Card key={server.name}>
<CardHeader> <CardHeader>
@ -63,7 +63,7 @@ export default function FavoritesView() {
<Button <Button
size="icon" size="icon"
variant="secondary" variant="secondary"
className=" min-w-[128px] max-w-[328px] mb-2 h-[32px] max-md:hidden" className="min-w-[128px] max-w-[328px] mb-2 h-[32px] max-md:hidden"
onClick={() => { onClick={() => {
navigator.clipboard.writeText( navigator.clipboard.writeText(
server.name + ".mshf.minehut.gg" server.name + ".mshf.minehut.gg"
@ -79,7 +79,7 @@ export default function FavoritesView() {
<Button <Button
size="icon" size="icon"
variant="secondary" variant="secondary"
className=" w-[32px] h-[32px] mb-2 ml-2 max-md:hidden" className="w-[32px] h-[32px] mb-2 ml-2 max-md:hidden"
onClick={() => { onClick={() => {
router.push("/server/" + server.name); router.push("/server/" + server.name);
}} }}

@ -21,7 +21,7 @@ export default function IconDisplay(props: { server: any }) {
/> />
</TooltipTrigger> </TooltipTrigger>
<TooltipContent> <TooltipContent>
<div className=" font-mono"> <div className="font-mono">
{props.server.icon != null {props.server.icon != null
? props.server.icon.toLowerCase() ? props.server.icon.toLowerCase()
: "oak_sign"} : "oak_sign"}
@ -42,7 +42,7 @@ export function IconDisplayClient(props: { server: string }) {
useEffect(() => { useEffect(() => {
fetch( fetch(
"https://api.minehut.com/server/" + props.server + "?byName=true", "https://api.minehut.com/server/" + props.server + "?byName=true"
).then((b) => b.json().then((c) => setIcon(c.server.icon))); ).then((b) => b.json().then((c) => setIcon(c.server.icon)));
}, []); }, []);
@ -62,7 +62,7 @@ export function IconDisplayClient(props: { server: string }) {
/> />
</TooltipTrigger> </TooltipTrigger>
<TooltipContent> <TooltipContent>
<div className=" font-mono"> <div className="font-mono">
{icon != null ? icon.toLowerCase() : "oak_sign"} {icon != null ? icon.toLowerCase() : "oak_sign"}
</div> </div>
{icon == null && ( {icon == null && (

@ -40,13 +40,13 @@ export default function ServerCard({ b, motd }: any) {
className="min-h-[450px] max-h-[450px] mb-4 flex items-start" className="min-h-[450px] max-h-[450px] mb-4 flex items-start"
> >
<CardHeader> <CardHeader>
<CardTitle className=" m-0"> <CardTitle className="m-0">
<IconDisplay server={b} /> {b.name}{" "} <IconDisplay server={b} /> {b.name}{" "}
<Drawer> <Drawer>
<DrawerTrigger> <DrawerTrigger>
<Button <Button
size="icon" size="icon"
className=" w-[24px] h-[24px] ml-2 md:hidden" className="w-[24px] h-[24px] ml-2 md:hidden"
variant="secondary" variant="secondary"
> >
<EllipsisVertical size={16} /> <EllipsisVertical size={16} />
@ -67,7 +67,7 @@ export default function ServerCard({ b, motd }: any) {
}} }}
> >
Copy server IP Copy server IP
<Copy size={18} className=" ml-4" /> <Copy size={18} className="ml-4" />
</Button> </Button>
<Button <Button
variant="ghost" variant="ghost"
@ -81,7 +81,7 @@ export default function ServerCard({ b, motd }: any) {
</DrawerContent> </DrawerContent>
</Drawer> </Drawer>
{b.author != undefined ? ( {b.author != undefined ? (
<div className=" text-sm text-muted-foreground"> <div className="text-sm text-muted-foreground">
by {b.author} by {b.author}
</div> </div>
) : ( ) : (
@ -89,11 +89,11 @@ export default function ServerCard({ b, motd }: any) {
)} )}
<TagShower server={b} /> <TagShower server={b} />
</CardTitle> </CardTitle>
<CardDescription className=" float-left inline"> <CardDescription className="float-left inline">
<span className=" flex items-center"> <span className="flex items-center">
{b.playerData.playerCount == 0 ? ( {b.playerData.playerCount == 0 ? (
<div <div
className=" items-center border" className="items-center border"
style={{ style={{
width: ".5rem", width: ".5rem",
height: ".5rem", height: ".5rem",
@ -102,7 +102,7 @@ export default function ServerCard({ b, motd }: any) {
/> />
) : ( ) : (
<div <div
className=" items-center" className="items-center"
style={{ style={{
backgroundColor: "#0cce6b", backgroundColor: "#0cce6b",
width: ".5rem", width: ".5rem",
@ -112,7 +112,7 @@ export default function ServerCard({ b, motd }: any) {
/> />
)} )}
<span className=" pl-1"> <span className="pl-1">
{b.playerData.playerCount}{" "} {b.playerData.playerCount}{" "}
{b.playerData.playerCount == 1 ? "player" : "players"}{" "} {b.playerData.playerCount == 1 ? "player" : "players"}{" "}
currently online currently online
@ -125,7 +125,7 @@ export default function ServerCard({ b, motd }: any) {
<Button <Button
size="icon" size="icon"
variant="secondary" variant="secondary"
className=" min-w-[128px] max-w-[328px] h-[32px] mt-2 ml-2 max-md:hidden" className="min-w-[128px] max-w-[328px] h-[32px] mt-2 ml-2 max-md:hidden"
onClick={() => { onClick={() => {
navigator.clipboard.writeText( navigator.clipboard.writeText(
b.name + ".mshf.minehut.gg" b.name + ".mshf.minehut.gg"
@ -142,7 +142,7 @@ export default function ServerCard({ b, motd }: any) {
<Button <Button
size="icon" size="icon"
variant="secondary" variant="secondary"
className=" w-[32px] h-[32px] mt-2 ml-2 max-md:hidden" className="w-[32px] h-[32px] mt-2 ml-2 max-md:hidden"
> >
<Layers size={18} /> <Layers size={18} />
</Button> </Button>
@ -165,7 +165,7 @@ export default function ServerCard({ b, motd }: any) {
}} }}
> >
Copy server IP Copy server IP
<div className=" RightSlot"> <div className="RightSlot">
<Copy size={18} /> <Copy size={18} />
</div> </div>
</ContextMenuItem> </ContextMenuItem>
@ -193,7 +193,7 @@ export default function ServerCard({ b, motd }: any) {
}} }}
> >
Copy server IP Copy server IP
<div className=" RightSlot"> <div className="RightSlot">
<Copy size={18} /> <Copy size={18} />
</div> </div>
</ContextMenuItem> </ContextMenuItem>

@ -108,10 +108,10 @@ export default function ServerList() {
if (loading) { if (loading) {
return ( return (
<> <>
<Spinner className=" flex items-center" /> <Spinner className="flex items-center" />
<br /> <br />
<div <div
className=" flex justify-center" className="flex justify-center"
dangerouslySetInnerHTML={{ __html: randomText }} dangerouslySetInnerHTML={{ __html: randomText }}
></div> ></div>
</> </>
@ -120,7 +120,7 @@ export default function ServerList() {
return ( return (
<> <>
<div className=" max-lg:grid-cols-2 grid grid-cols-3 gap-4 "> <div className="max-lg:grid-cols-2 grid grid-cols-3 gap-4 ">
<Stat <Stat
title="Players online" title="Players online"
desc={serverList.getExtraData().total_players.toString()} desc={serverList.getExtraData().total_players.toString()}
@ -181,7 +181,7 @@ export default function ServerList() {
</Stat> </Stat>
<Stat <Stat
title="Current most popular server (in filter)" title="Current most popular server (in filter)"
className=" max-lg:col-span-2" className="max-lg:col-span-2"
desc={ desc={
<> <>
{serverList.currentServers[0] != undefined {serverList.currentServers[0] != undefined
@ -197,11 +197,11 @@ export default function ServerList() {
</div> </div>
<br /> <br />
<Separator /> <Separator />
<div className=" mt-3 ml-3"> <div className="mt-3 ml-3">
<Button <Button
onClick={() => events.emit("search-request-event")} onClick={() => events.emit("search-request-event")}
variant="secondary" variant="secondary"
className=" max-lg:mb-3" className="max-lg:mb-3"
> >
Search{" "} Search{" "}
<code className="ml-2 flex items-center"> <code className="ml-2 flex items-center">
@ -211,12 +211,12 @@ export default function ServerList() {
</Button> </Button>
<Popover> <Popover>
<PopoverTrigger> <PopoverTrigger>
<Button className=" ml-3" variant="secondary"> <Button className="ml-3" variant="secondary">
Filter Filter
<code className="ml-2">{filters.length}</code> <code className="ml-2">{filters.length}</code>
</Button> </Button>
</PopoverTrigger> </PopoverTrigger>
<PopoverContent className=" w-[390px] z-3"> <PopoverContent className="w-[390px] z-3">
<RadioGroup <RadioGroup
onValueChange={(v) => { onValueChange={(v) => {
toast.promise( toast.promise(
@ -351,41 +351,41 @@ export default function ServerList() {
} }
})()} })()}
> >
<div className=" items-top flex space-x-2"> <div className="items-top flex space-x-2">
<RadioGroupItem id="smaller" value="smaller" /> <RadioGroupItem id="smaller" value="smaller" />
<div className=" grid gap-1.5 leading-none"> <div className="grid gap-1.5 leading-none">
<label <label
htmlFor="smaller" htmlFor="smaller"
className=" text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70" className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
> >
Only allow smaller servers Only allow smaller servers
</label> </label>
<p className=" text-sm text-muted-foreground"> <p className="text-sm text-muted-foreground">
Server have 15-7 players, cannot be{" "} Server have 15-7 players, cannot be{" "}
<Badge variant="secondary">Always Online</Badge> <Badge variant="secondary">Always Online</Badge>
</p> </p>
</div> </div>
</div> </div>
<div className=" items-top flex space-x-2"> <div className="items-top flex space-x-2">
<RadioGroupItem id="bigger" value="bigger" /> <RadioGroupItem id="bigger" value="bigger" />
<div className=" grid gap-1.5 leading-none"> <div className="grid gap-1.5 leading-none">
<label <label
htmlFor="bigger" htmlFor="bigger"
className=" text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70" className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
> >
Only allow bigger servers Only allow bigger servers
</label> </label>
<p className=" text-sm text-muted-foreground"> <p className="text-sm text-muted-foreground">
Server has 16 players or more Server has 16 players or more
</p> </p>
</div> </div>
</div> </div>
<div className=" items-top flex space-x-2"> <div className="items-top flex space-x-2">
<RadioGroupItem id="none" value="none" /> <RadioGroupItem id="none" value="none" />
<div className=" grid gap-1.5 leading-none"> <div className="grid gap-1.5 leading-none">
<label <label
htmlFor="none" htmlFor="none"
className=" text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70" className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
> >
Custom/no requirements Custom/no requirements
</label> </label>
@ -394,13 +394,13 @@ export default function ServerList() {
</RadioGroup> </RadioGroup>
<br /> <br />
<br /> <br />
<strong className=" pb-2">Tags</strong> <strong className="pb-2">Tags</strong>
<br /> <br />
{allTags.map((tag) => ( {allTags.map((tag) => (
<div key={tag.docsName}> <div key={tag.docsName}>
{tag.docsName && tag.__filter == undefined && ( {tag.docsName && tag.__filter == undefined && (
<div className=" items-top flex space-x-2 pb-1"> <div className="items-top flex space-x-2 pb-1">
<Checkbox <Checkbox
disabled={templateFilter && tag.__disab != undefined} disabled={templateFilter && tag.__disab != undefined}
id={tag.docsName} id={tag.docsName}
@ -445,12 +445,12 @@ export default function ServerList() {
}); });
}} }}
/> />
<div className=" grid gap-1.5 leading-none"> <div className="grid gap-1.5 leading-none">
<label <label
htmlFor={tag.docsName} htmlFor={tag.docsName}
className=" text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70" className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
> >
<Badge variant={tag.role} className=" mr-1"> <Badge variant={tag.role} className="mr-1">
{tag.docsName} {tag.docsName}
</Badge> </Badge>
</label> </label>
@ -464,7 +464,7 @@ export default function ServerList() {
<br /> <br />
{allCategories.map((categorie) => ( {allCategories.map((categorie) => (
<div <div
className=" items-top flex space-x-2 pb-1" className="items-top flex space-x-2 pb-1"
key={categorie.name} key={categorie.name}
> >
<Checkbox <Checkbox
@ -508,12 +508,12 @@ export default function ServerList() {
return nameFilters["c-" + categorie.name]; return nameFilters["c-" + categorie.name];
})()} })()}
/> />
<div className=" grid gap-1.5 leading-none"> <div className="grid gap-1.5 leading-none">
<label <label
htmlFor={categorie.name} htmlFor={categorie.name}
className=" text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70" className="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
> >
<Badge variant={categorie.role} className=" mr-1"> <Badge variant={categorie.role} className="mr-1">
{categorie.name} {categorie.name}
</Badge> </Badge>
</label> </label>
@ -524,7 +524,7 @@ export default function ServerList() {
</Popover> </Popover>
<Button <Button
variant="secondary" variant="secondary"
className=" md:ml-3 " className="md:ml-3 "
onClick={() => { onClick={() => {
setRandomData(serverList.getRandomServer()); setRandomData(serverList.getRandomServer());
setRandom(true); setRandom(true);
@ -534,7 +534,7 @@ export default function ServerList() {
</Button> </Button>
<Button <Button
variant="secondary" variant="secondary"
className=" ml-3" className="ml-3"
onClick={() => { onClick={() => {
toast.promise( toast.promise(
new Promise((s, e) => { new Promise((s, e) => {
@ -585,7 +585,7 @@ export default function ServerList() {
<DialogTitle> <DialogTitle>
<IconDisplay server={randomData} /> {randomData.name} <IconDisplay server={randomData} /> {randomData.name}
{randomData.author != undefined ? ( {randomData.author != undefined ? (
<div className=" text-sm text-muted-foreground"> <div className="text-sm text-muted-foreground">
by {randomData.author} by {randomData.author}
</div> </div>
) : ( ) : (
@ -593,11 +593,11 @@ export default function ServerList() {
)} )}
<TagShower server={randomData} /> <TagShower server={randomData} />
</DialogTitle> </DialogTitle>
<DialogDescription className=" float-left inline"> <DialogDescription className="float-left inline">
<span className=" flex items-center"> <span className="flex items-center">
{randomData.playerData.playerCount == 0 ? ( {randomData.playerData.playerCount == 0 ? (
<div <div
className=" items-center border" className="items-center border"
style={{ style={{
width: ".5rem", width: ".5rem",
height: ".5rem", height: ".5rem",
@ -606,7 +606,7 @@ export default function ServerList() {
/> />
) : ( ) : (
<div <div
className=" items-center" className="items-center"
style={{ style={{
backgroundColor: "#0cce6b", backgroundColor: "#0cce6b",
width: ".5rem", width: ".5rem",
@ -616,7 +616,7 @@ export default function ServerList() {
/> />
)} )}
<span className=" pl-1"> <span className="pl-1">
{randomData.playerData.playerCount}{" "} {randomData.playerData.playerCount}{" "}
{randomData.playerData.playerCount == 1 {randomData.playerData.playerCount == 1
? "player" ? "player"
@ -628,11 +628,11 @@ export default function ServerList() {
<strong>Server IP</strong> <strong>Server IP</strong>
<br /> <br />
<br /> <br />
<code className=" border p-3 rounded"> <code className="border p-3 rounded">
{randomData.name}.mshf.minehut.gg{" "} {randomData.name}.mshf.minehut.gg{" "}
<Button <Button
size="icon" size="icon"
className=" ml-1 h-[20px]" className="ml-1 h-[20px]"
onClick={() => { onClick={() => {
setTextCopied(true); setTextCopied(true);
navigator.clipboard.writeText( navigator.clipboard.writeText(
@ -643,7 +643,7 @@ export default function ServerList() {
}} }}
> >
{textCopied ? ( {textCopied ? (
<Check size={16} className=" flex items-center" /> <Check size={16} className="flex items-center" />
) : ( ) : (
<p>Copy</p> <p>Copy</p>
)} )}
@ -676,7 +676,7 @@ export default function ServerList() {
setLoading(false); setLoading(false);
}); });
}} }}
loader={<Spinner className=" flex items-center" />} loader={<Spinner className="flex items-center" />}
endMessage={ endMessage={
<p <p
style={{ textAlign: "center" }} style={{ textAlign: "center" }}
@ -766,7 +766,7 @@ export function TagShower(props: { server: OnlineServer; className?: string }) {
</Badge> </Badge>
</TooltipTrigger> </TooltipTrigger>
<TooltipContent> <TooltipContent>
<div className=" font-normal"> <div className="font-normal">
{t.tooltip} {t.tooltip}
<br /> <br />
Click the tag to learn more about it. Click the tag to learn more about it.

@ -69,7 +69,7 @@ export default function ServerView(props: { server: string }) {
<Spinner className="flex items-center" /> <Spinner className="flex items-center" />
<br /> <br />
<div <div
className=" flex justify-center" className="flex justify-center"
dangerouslySetInnerHTML={{ __html: randomText }} dangerouslySetInnerHTML={{ __html: randomText }}
></div> ></div>
</> </>
@ -78,7 +78,7 @@ export default function ServerView(props: { server: string }) {
return ( return (
<> <>
{single.grabOnline() == undefined && ( {single.grabOnline() == undefined && (
<div className=" grid pl-4 pr-4"> <div className="grid pl-4 pr-4">
<div <div
className=" rounded p-2" className=" rounded p-2"
style={{ backgroundColor: "rgba(244, 63, 94, .16)" }} style={{ backgroundColor: "rgba(244, 63, 94, .16)" }}
@ -95,13 +95,13 @@ export default function ServerView(props: { server: string }) {
</div> </div>
)} )}
<div className=" grid p-4 sm:grid-cols-3 gap-4"> <div className="grid p-4 sm:grid-cols-3 gap-4">
<Card className=" sm:col-span-2"> <Card className="sm:col-span-2">
<BetterHeader> <BetterHeader>
<CardTitle className=" flex items-center"> <CardTitle className="flex items-center">
{single.grabOnline() == undefined ? ( {single.grabOnline() == undefined ? (
<div <div
className=" items-center mr-1" className="items-center mr-1"
style={{ style={{
width: ".75rem", width: ".75rem",
height: ".75rem", height: ".75rem",
@ -111,7 +111,7 @@ export default function ServerView(props: { server: string }) {
/> />
) : ( ) : (
<div <div
className=" items-center mr-1" className="items-center mr-1"
style={{ style={{
width: ".75rem", width: ".75rem",
height: ".75rem", height: ".75rem",

@ -10,14 +10,12 @@ export default function Component(props: {
return ( return (
<Card className={props.className}> <Card className={props.className}>
{props.children} {props.children}
<CardHeader className=" flex flex-row items-center justify-between space-y-0 pb-2"> <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
<CardTitle className=" text-sm font-medium m-0"> <CardTitle className="text-sm font-medium m-0">{props.title}</CardTitle>
{props.title} <props.icon className="h-4 w-4 text-muted-foreground" />
</CardTitle>
<props.icon className=" h-4 w-4 text-muted-foreground" />
</CardHeader> </CardHeader>
<CardContent> <CardContent>
<div className=" text-2xl font-bold">{props.desc}</div> <div className="text-2xl font-bold">{props.desc}</div>
</CardContent> </CardContent>
</Card> </Card>
); );

@ -14,17 +14,17 @@ export default function TextFromPathname() {
<> <>
{pathname == "/" && ( {pathname == "/" && (
<> <>
<BreadcrumbSeparator className=" max-sm:hidden" /> <BreadcrumbSeparator className="max-sm:hidden" />
<BreadcrumbItem className=" max-sm:hidden"> <BreadcrumbItem className="max-sm:hidden">
<BreadcrumbPage>Home</BreadcrumbPage> <BreadcrumbPage>Home</BreadcrumbPage>
</BreadcrumbItem> </BreadcrumbItem>
</> </>
)} )}
{pathname?.startsWith("/server") && ( {pathname?.startsWith("/server") && (
<> <>
<BreadcrumbSeparator className=" max-sm:hidden" /> <BreadcrumbSeparator className="max-sm:hidden" />
<BreadcrumbItem className=" max-sm:hidden">Server</BreadcrumbItem> <BreadcrumbItem className="max-sm:hidden">Server</BreadcrumbItem>
<BreadcrumbSeparator className=" max-sm:hidden" /> <BreadcrumbSeparator className="max-sm:hidden" />
<BreadcrumbItem> <BreadcrumbItem>
<BreadcrumbPage> <BreadcrumbPage>
{pathname.split("/server/")[1].split("/")[0]} {pathname.split("/server/")[1].split("/")[0]}
@ -50,7 +50,7 @@ export default function TextFromPathname() {
)} )}
{pathname == "/account/favorites" && ( {pathname == "/account/favorites" && (
<> <>
<BreadcrumbSeparator className=" max-sm:hidden" /> <BreadcrumbSeparator className="max-sm:hidden" />
<BreadcrumbItem> <BreadcrumbItem>
<BreadcrumbPage>Favorites</BreadcrumbPage> <BreadcrumbPage>Favorites</BreadcrumbPage>
</BreadcrumbItem> </BreadcrumbItem>
@ -58,7 +58,7 @@ export default function TextFromPathname() {
)} )}
{pathname == "/account/claim-account" && ( {pathname == "/account/claim-account" && (
<> <>
<BreadcrumbSeparator className=" max-sm:hidden" /> <BreadcrumbSeparator className="max-sm:hidden" />
<BreadcrumbItem> <BreadcrumbItem>
<BreadcrumbPage>Claim Minecraft Account</BreadcrumbPage> <BreadcrumbPage>Claim Minecraft Account</BreadcrumbPage>
</BreadcrumbItem> </BreadcrumbItem>
@ -66,7 +66,7 @@ export default function TextFromPathname() {
)} )}
{pathname == "/account/settings" && ( {pathname == "/account/settings" && (
<> <>
<BreadcrumbSeparator className=" max-sm:hidden" /> <BreadcrumbSeparator className="max-sm:hidden" />
<BreadcrumbItem> <BreadcrumbItem>
<BreadcrumbPage>Settings</BreadcrumbPage> <BreadcrumbPage>Settings</BreadcrumbPage>
</BreadcrumbItem> </BreadcrumbItem>
@ -74,7 +74,7 @@ export default function TextFromPathname() {
)} )}
{pathname == "/legal/external-content-agreement" && ( {pathname == "/legal/external-content-agreement" && (
<> <>
<BreadcrumbSeparator className=" max-sm:hidden" /> <BreadcrumbSeparator className="max-sm:hidden" />
<BreadcrumbItem> <BreadcrumbItem>
<BreadcrumbPage>Legal</BreadcrumbPage> <BreadcrumbPage>Legal</BreadcrumbPage>
</BreadcrumbItem> </BreadcrumbItem>

@ -9,31 +9,31 @@ export default function LoggedInPopover() {
const { user } = useUser(); const { user } = useUser();
return ( return (
<div className=" grid w-full"> <div className="grid w-full">
<strong className=" text-center">Logged in as {user?.username}</strong> <strong className="text-center">Logged in as {user?.username}</strong>
<small className=" text-center"> <small className="text-center">
Make comments about servers and favorite servers. Secured by Clerk Make comments about servers and favorite servers. Secured by Clerk
</small> </small>
<br /> <br />
<Button <Button
variant={"ghost"} variant={"ghost"}
onClick={() => router.push("/account/settings")} onClick={() => router.push("/account/settings")}
> >
<UserCog size={18} className=" mr-2" /> <UserCog size={18} className="mr-2" />
Security/Profile settings Security/Profile settings
</Button> </Button>
<Button <Button
variant={"ghost"} variant={"ghost"}
onClick={() => router.push("/account/favorites")} onClick={() => router.push("/account/favorites")}
> >
<Star size={18} className=" mr-2" /> Favorites <Star size={18} className="mr-2" /> Favorites
</Button> </Button>
<Button <Button
variant={"ghost"} variant={"ghost"}
className="text-red-500" className="text-red-500"
onClick={() => clerk.signOut()} onClick={() => clerk.signOut()}
> >
<X size={18} className=" mr-2" /> <X size={18} className="mr-2" />
Logout Logout
</Button> </Button>
</div> </div>

@ -32,8 +32,8 @@ export default function SignInPopoverButton({
</PopoverTrigger> </PopoverTrigger>
<PopoverContent className="w-full"> <PopoverContent className="w-full">
<div className=" grid w-[200px]"> <div className=" grid w-[200px]">
<strong className=" text-center">Login</strong> <strong className="text-center">Login</strong>
<small className=" text-center"> <small className="text-center">
Make comments about servers and favorite servers. Secured by Clerk Make comments about servers and favorite servers. Secured by Clerk
</small> </small>
<br /> <br />

@ -17,7 +17,7 @@ export default function TopBar({ inter }: { inter: string }) {
return ( return (
<> <>
<SignedOut> <SignedOut>
<div className=" mt-1 gap-1 grid grid-cols-5"> <div className="mt-1 gap-1 grid grid-cols-5">
<SignInPopoverButton className="col-span-2" variant="outline" /> <SignInPopoverButton className="col-span-2" variant="outline" />
<Popover> <Popover>
<PopoverTrigger> <PopoverTrigger>
@ -32,7 +32,7 @@ export default function TopBar({ inter }: { inter: string }) {
<Button variant="ghost" size="icon"> <Button variant="ghost" size="icon">
<svg <svg
viewBox="0 0 438.549 438.549" viewBox="0 0 438.549 438.549"
className=" h-[1.2rem] w-[1.2rem]" className="h-[1.2rem] w-[1.2rem]"
> >
<path <path
fill="currentColor" fill="currentColor"
@ -68,7 +68,7 @@ export default function TopBar({ inter }: { inter: string }) {
<Popover> <Popover>
<PopoverTrigger> <PopoverTrigger>
<Button size="icon" variant="ghost" className="mb-1"> <Button size="icon" variant="ghost" className="mb-1">
<InfoIcon className=" h-[1.2rem] w-[1.2rem]" /> <InfoIcon className="h-[1.2rem] w-[1.2rem]" />
</Button> </Button>
</PopoverTrigger> </PopoverTrigger>
<PopoverContent> <PopoverContent>
@ -86,7 +86,7 @@ export default function TopBar({ inter }: { inter: string }) {
> >
<svg <svg
viewBox="0 0 438.549 438.549" viewBox="0 0 438.549 438.549"
className=" h-[1.2rem] w-[1.2rem]" className="h-[1.2rem] w-[1.2rem]"
> >
<path <path
fill="currentColor" fill="currentColor"

@ -9,11 +9,11 @@ export function TextCopyComp() {
const [textCopied, setTextCopied] = useState(false); const [textCopied, setTextCopied] = useState(false);
return ( return (
<code className=" border p-3 rounded"> <code className="border p-3 rounded">
MHSFPV.minehut.gg{" "} MHSFPV.minehut.gg{" "}
<Button <Button
size="icon" size="icon"
className=" ml-1 h-[20px]" className="ml-1 h-[20px]"
onClick={() => { onClick={() => {
setTextCopied(true); setTextCopied(true);
navigator.clipboard.writeText("MHSFPV.minehut.gg"); navigator.clipboard.writeText("MHSFPV.minehut.gg");
@ -22,7 +22,7 @@ export function TextCopyComp() {
}} }}
> >
{textCopied ? ( {textCopied ? (
<Check size={16} className=" flex items-center" /> <Check size={16} className="flex items-center" />
) : ( ) : (
<p>Copy</p> <p>Copy</p>
)} )}