From 1aa8630db0689e79c64edaa71d70e8335559f502 Mon Sep 17 00:00:00 2001
From: Liam <liam@fascinated.cc>
Date: Sun, 5 Nov 2023 14:31:09 +0000
Subject: [PATCH] fix mobile support on leaderboards

---
 src/components/leaderboard/Leaderboard.tsx      | 6 +++---
 src/components/leaderboard/LeaderboardScore.tsx | 4 ++--
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/components/leaderboard/Leaderboard.tsx b/src/components/leaderboard/Leaderboard.tsx
index 0133efb..bb053a0 100644
--- a/src/components/leaderboard/Leaderboard.tsx
+++ b/src/components/leaderboard/Leaderboard.tsx
@@ -96,9 +96,9 @@ export default function Leaderboard({ id, page }: LeaderboardProps) {
 
   return (
     <Container>
-      <div className="mt-2 flex flex-col gap-2 md:flex-row">
-        <Card outerClassName="h-fit" className="mt-2 flex">
-          <div className="flex min-w-[300px] flex-wrap justify-between gap-2 md:justify-start">
+      <div className="mt-2 flex flex-col gap-2 xl:flex-row">
+        <Card outerClassName="h-fit pt-3" className="flex">
+          <div className="flex min-w-[320px] flex-wrap justify-between gap-2 md:justify-start">
             <div className="flex gap-2">
               <Image
                 src={coverImage}
diff --git a/src/components/leaderboard/LeaderboardScore.tsx b/src/components/leaderboard/LeaderboardScore.tsx
index 9e7abd7..7c6906a 100644
--- a/src/components/leaderboard/LeaderboardScore.tsx
+++ b/src/components/leaderboard/LeaderboardScore.tsx
@@ -21,14 +21,14 @@ export default function LeaderboardScore({
   const accuracy = ((score.baseScore / leaderboard.maxScore) * 100).toFixed(2);
 
   return (
-    <div className="mb-1 mt-1 grid grid-cols-[0.6fr_3fr_1.3fr] first:pt-0 last:pb-0 md:grid-cols-[1.28fr_6fr_1.3fr]">
+    <div className="mb-1 mt-1 grid grid-cols-[1.28fr_3fr_1.3fr] first:pt-0 last:pb-0 md:grid-cols-[1.28fr_6fr_1.3fr]">
       <div className="flex flex-col items-center justify-center">
         <div className="flex w-fit flex-row items-center justify-center gap-1">
           <p>#{formatNumber(score.rank)}</p>
         </div>
         <Tooltip>
           <TooltipTrigger>
-            <p className="hidden text-sm text-gray-200 md:block">
+            <p className="block text-sm text-gray-200">
               {formatTimeAgo(score.timeSet)}
             </p>
           </TooltipTrigger>