From 283925d038fe80399982c206870274d5f2749681 Mon Sep 17 00:00:00 2001
From: Corwin Smith <cssmittys@gmail.com>
Date: Tue, 7 Dec 2021 08:43:16 -0700
Subject: [PATCH 1/2] fix: contributors only display on 1 row for mobile, and
 show all languages for a contributor on TranslationLeaderboard

---
 src/components/TranslationLeaderboard.js           | 14 +++++++++++---
 .../translation-program/contributors.js            |  4 ++++
 2 files changed, 15 insertions(+), 3 deletions(-)

diff --git a/src/components/TranslationLeaderboard.js b/src/components/TranslationLeaderboard.js
index 6a0f050fa50..f8a8154b076 100644
--- a/src/components/TranslationLeaderboard.js
+++ b/src/components/TranslationLeaderboard.js
@@ -83,6 +83,12 @@ const Avatar = styled.img`
   }
 `
 
+const NameContainer = styled.div`
+  @media (max-width: ${(props) => props.theme.breakpoints.s}) {
+    max-width: 100px;
+  }
+`
+
 const Width40 = styled.div`
   width: 40px;
 `
@@ -197,10 +203,12 @@ const TranslationLeaderboard = () => {
                   )}
                   <TextContainer>
                     <Avatar src={user.avatarUrl} />
-                    <div>
+                    <NameContainer>
                       {user.username}
-                      <Language>{languages[0]?.name || ""}</Language>
-                    </div>
+                      <Language>
+                        {languages.map((language) => language.name).join(", ")}
+                      </Language>
+                    </NameContainer>
                   </TextContainer>
                 </Flex>
                 <WordsContainer>
diff --git a/src/pages/contributing/translation-program/contributors.js b/src/pages/contributing/translation-program/contributors.js
index cbd29b72eed..6b9fa3dafd1 100644
--- a/src/pages/contributing/translation-program/contributors.js
+++ b/src/pages/contributing/translation-program/contributors.js
@@ -36,6 +36,10 @@ const HorizontalUl = styled.ul`
   @media (max-width: ${(props) => props.theme.breakpoints.m}) {
     grid-template-columns: 1fr 1fr;
   }
+
+  @media (max-width: ${(props) => props.theme.breakpoints.s}) {
+    grid-template-columns: 1fr;
+  }
 `
 
 const Contributors = ({ location }) => {

From 210cef7c1d68c2714505eb4d411f02d42318e5a9 Mon Sep 17 00:00:00 2001
From: Paul Wackerow <54227730+wackerow@users.noreply.github.com>
Date: Thu, 9 Dec 2021 19:07:31 -0800
Subject: [PATCH 2/2] limit to 3 languages/user for leaderboard

---
 src/components/TranslationLeaderboard.js | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/src/components/TranslationLeaderboard.js b/src/components/TranslationLeaderboard.js
index f8a8154b076..c398a76a145 100644
--- a/src/components/TranslationLeaderboard.js
+++ b/src/components/TranslationLeaderboard.js
@@ -206,7 +206,10 @@ const TranslationLeaderboard = () => {
                     <NameContainer>
                       {user.username}
                       <Language>
-                        {languages.map((language) => language.name).join(", ")}
+                        {languages
+                          .slice(0, 3)
+                          .map((language) => language.name)
+                          .join(", ")}
                       </Language>
                     </NameContainer>
                   </TextContainer>