From 48b97cd5a3b48d90e3cfafb44bb117310def301e Mon Sep 17 00:00:00 2001
From: Yi-Jyun Pan <pan93412@gmail.com>
Date: Thu, 24 Oct 2024 11:23:53 +0800
Subject: [PATCH 1/3] fix(overview): Leaderboard may overflow for long name

---
 assets/styles/app.scss                         | 1 +
 templates/overview/cards/leaderboard.html.twig | 2 +-
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/assets/styles/app.scss b/assets/styles/app.scss
index 488a971..9c9dd66 100644
--- a/assets/styles/app.scss
+++ b/assets/styles/app.scss
@@ -394,6 +394,7 @@ ul.credit {
       "hello-text          hello-text          hello-text   hello-text" auto
       "weekly-metrics      weekly-metrics      leaderboard  leaderboard" 1fr
       "historic-statistics historic-statistics leaderboard  leaderboard" 1fr;
+    grid-template-columns: 2fr 2fr 1fr 1fr;
   }
 
   &__hello-text {
diff --git a/templates/overview/cards/leaderboard.html.twig b/templates/overview/cards/leaderboard.html.twig
index 09f145b..a46c0fb 100644
--- a/templates/overview/cards/leaderboard.html.twig
+++ b/templates/overview/cards/leaderboard.html.twig
@@ -12,7 +12,7 @@
         <tbody>
         {% for item in leaderboard %}
             <tr>
-                <th scope="row">{{ item.user.name }}</th>
+                <th scope="row">{{ item.user.name|u.truncate(24, '…') }}</th>
                 <td>{{ item.count }}</td>
             </tr>
         {% endfor %}

From eda68d6ad1bb4902eb8e59caf7d11c0ba439fb8a Mon Sep 17 00:00:00 2001
From: Yi-Jyun Pan <pan93412@gmail.com>
Date: Thu, 24 Oct 2024 11:25:19 +0800
Subject: [PATCH 2/3] fix(overview): Limit leaderboard to show 10 users

---
 src/Controller/OverviewCardsController.php | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/Controller/OverviewCardsController.php b/src/Controller/OverviewCardsController.php
index cb26ff5..8a377c3 100644
--- a/src/Controller/OverviewCardsController.php
+++ b/src/Controller/OverviewCardsController.php
@@ -207,6 +207,7 @@ public function leaderboard(
         SolutionEventRepository $solutionEventRepository,
     ): Response {
         $leaderboard = $solutionEventRepository->listLeaderboard($user->getGroup(), '7 days');
+        $leaderboard = \array_slice($leaderboard, 0, 10);
 
         return $this->render('overview/cards/leaderboard.html.twig', [
             'leaderboard' => $leaderboard,

From def0e92908d3eaadf41802142742a4d8b5e3f2b0 Mon Sep 17 00:00:00 2001
From: Yi-Jyun Pan <pan93412@gmail.com>
Date: Thu, 24 Oct 2024 11:29:44 +0800
Subject: [PATCH 3/3] fix(overview): Bad RWD on small devices

---
 assets/styles/app.scss                         | 2 +-
 templates/overview/cards/leaderboard.html.twig | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/assets/styles/app.scss b/assets/styles/app.scss
index 9c9dd66..2d9b40a 100644
--- a/assets/styles/app.scss
+++ b/assets/styles/app.scss
@@ -389,7 +389,7 @@ ul.credit {
     "historic-statistics" auto
     "leaderboard" auto;
 
-  @media (min-width: 768px) {
+  @media (min-width: 1440px) {
     grid-template:
       "hello-text          hello-text          hello-text   hello-text" auto
       "weekly-metrics      weekly-metrics      leaderboard  leaderboard" 1fr
diff --git a/templates/overview/cards/leaderboard.html.twig b/templates/overview/cards/leaderboard.html.twig
index a46c0fb..d61a916 100644
--- a/templates/overview/cards/leaderboard.html.twig
+++ b/templates/overview/cards/leaderboard.html.twig
@@ -12,7 +12,7 @@
         <tbody>
         {% for item in leaderboard %}
             <tr>
-                <th scope="row">{{ item.user.name|u.truncate(24, '…') }}</th>
+                <th scope="row" class="text-truncate">{{ item.user.name|u.truncate(24, '…') }}</th>
                 <td>{{ item.count }}</td>
             </tr>
         {% endfor %}