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

make leaderboard look better on mobile
All checks were successful
deploy / deploy (push) Successful in 58s
Details

Browse Source
This commit is contained in:
Lee 2023-10-28 18:47:05 +01:00
parent a3a09a093b
commit 7b293b3eff
1 changed files with 15 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/leaderboard/LeaderboardScore.tsx
View File

@ -24,7 +24,7 @@ export default function LeaderboardScore({
const accuracy = ((score.baseScore / leaderboard.maxScore) * 100).toFixed(2); const accuracy = ((score.baseScore / leaderboard.maxScore) * 100).toFixed(2);
return ( return (
<div className="mb-1 mt-1 grid grid-cols-[0.5fr_3fr_1.3fr] first:pt-0 last:pb-0 md:grid-cols-[1.2fr_6fr_1.3fr]"> <div className="mb-1 mt-1 grid grid-cols-[0.6fr_3fr_1.3fr] first:pt-0 last:pb-0 md:grid-cols-[1.2fr_6fr_1.3fr]">
<div className="flex flex-col items-center justify-center"> <div className="flex flex-col items-center justify-center">
<div className="flex w-fit flex-row items-center justify-center gap-1"> <div className="flex w-fit flex-row items-center justify-center gap-1">
<p>#{formatNumber(score.rank)}</p> <p>#{formatNumber(score.rank)}</p>
@ -59,9 +59,8 @@ export default function LeaderboardScore({
</Link> </Link>
</div> </div>
<div className="flex items-center justify-between p-1 md:items-start md:justify-end"> <div className="flex flex-col items-end gap-2 p-1 md:flex-row md:items-start md:justify-end">
{/* PP */} {/* PP */}
<div className="flex justify-end gap-2">
{score.pp > 0 && ( {score.pp > 0 && (
<ScoreStatLabel <ScoreStatLabel
className="bg-blue-500 text-center" className="bg-blue-500 text-center"
@ -79,6 +78,5 @@ export default function LeaderboardScore({
/> />
</div> </div>
</div> </div>
</div>
); );
} }