Fascinated/scoresaber-reloaded-v2
1
2
Fork 0
Code Issues 1 Pull Requests 10 Actions Activity

fix button alignment on score
Some checks failed
deploy / deploy (push) Failing after 36s
Details

Browse Source
This commit is contained in:
Lee 2023-11-24 21:00:50 +00:00
parent 4c0775b000
commit b5629c0169
1 changed files with 49 additions and 46 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

95
src/components/player/score/MapButtons.tsx
View File

@ -30,9 +30,10 @@ export default function MapButtons({ leaderboard }: MapButtonsProps) {
return; return;
} }
const json = await beatSaberMap.json(); const json = await beatSaberMap.json();
if (json.maps[hash] !== null || json.maps[hash] !== undefined) { if (json.maps[hash] == null || json.maps[hash] == undefined) {
return; return;
} }
console.log(json);
setMapId(json.maps[hash].id); setMapId(json.maps[hash].id);
}, [hash]); }, [hash]);
@ -41,55 +42,57 @@ export default function MapButtons({ leaderboard }: MapButtonsProps) {
}, [getMapId]); }, [getMapId]);
return ( return (
<div className="hidden flex-col items-center justify-between gap-1 p-1 md:flex md:items-start md:justify-end"> <div className="hidden flex-col items-center gap-2 p-1 md:flex md:items-start">
{mapId && ( {mapId && (
<div className="flex gap-1"> <>
<Tooltip> <div className="flex gap-2">
<TooltipTrigger> <Tooltip>
<Link <TooltipTrigger>
href={`https://beatsaver.com/maps/${mapId}`} <Link
target="_blank" href={`https://beatsaver.com/maps/${mapId}`}
> target="_blank"
<Button
className="h-[30px] w-[30px] bg-neutral-700 p-1"
variant={"secondary"}
> >
<BeatSaverLogo size={20} /> <Button
</Button> className="h-[30px] w-[30px] bg-neutral-700 p-1"
</Link> variant={"secondary"}
</TooltipTrigger> >
<TooltipContent> <BeatSaverLogo size={20} />
<p>Click to open the map page</p> </Button>
</TooltipContent> </Link>
</Tooltip> </TooltipTrigger>
<TooltipContent>
<p>Click to open the map page</p>
</TooltipContent>
</Tooltip>
<CopyBsrButton mapId={mapId} /> <CopyBsrButton mapId={mapId} />
</div> </div>
<div className="flex gap-2">
<Tooltip>
<TooltipTrigger>
<Link
href={`${songNameToYouTubeLink(
leaderboard.songName,
leaderboard.songSubName,
leaderboard.songAuthorName,
)}`}
target="_blank"
>
<Button
className="h-[30px] w-[30px] bg-neutral-700 p-1"
variant={"secondary"}
>
<YouTubeLogo size={20} />
</Button>
</Link>
</TooltipTrigger>
<TooltipContent>
<p>Click to view the song on YouTube</p>
</TooltipContent>
</Tooltip>
</div>
</>
)} )}
<div className="flex gap-1">
<Tooltip>
<TooltipTrigger>
<Link
href={`${songNameToYouTubeLink(
leaderboard.songName,
leaderboard.songSubName,
leaderboard.songAuthorName,
)}`}
target="_blank"
>
<Button
className="h-[30px] w-[30px] bg-neutral-700 p-1"
variant={"secondary"}
>
<YouTubeLogo size={20} />
</Button>
</Link>
</TooltipTrigger>
<TooltipContent>
<p>Click to view the song on YouTube</p>
</TooltipContent>
</Tooltip>
</div>
</div> </div>
); );
} }