From 32b8c13747892be431d0837f80040a669651cf01 Mon Sep 17 00:00:00 2001
From: Yashaswini K P <yashaswinikpyashu@gmail.com>
Date: Thu, 4 Jun 2026 11:26:01 +0530
Subject: [PATCH 1/2] feat: display totalSolved in leaderboard UI

---
 frontend/leaderboard.html | 12 ++++++++++++
 frontend/styles/main.css  | 21 +++++++++++++++------
 2 files changed, 27 insertions(+), 6 deletions(-)

diff --git a/frontend/leaderboard.html b/frontend/leaderboard.html
index 242c6f83..64d3a100 100644
--- a/frontend/leaderboard.html
+++ b/frontend/leaderboard.html
@@ -96,6 +96,7 @@ <h1 class="page-title">Leaderboard</h1>
             <div class="easy">Easy</div>
             <div class="medium">Medium</div>
             <div class="hard">Hard</div>
+            <div class="total">Total</div>
             <div class="score-header">
               Score
               <div class="tooltip-container">
@@ -404,6 +405,7 @@ <h1 class="page-title">Leaderboard</h1>
                     <div class="easy">${user.data.easySolved}</div>
                     <div class="medium">${user.data.mediumSolved}</div>
                     <div class="hard">${user.data.hardSolved}</div>
+                    <div class="total">${user.data.totalSolved}</div>
                     <div class="mobile-score tooltip-score">
                             <span>${user.score}</span>
                              <span class="score-caret"></span>
@@ -417,6 +419,9 @@ <h1 class="page-title">Leaderboard</h1>
                             <div>
                                 Hard: ${user.data.hardSolved} × ${hardPoints} = ${hardScore}
                             </div>
+                            <div>
+                              Questions Solved: ${user.data.totalSolved}
+                            </div>
                             <hr>
                             <div>
                                 <strong>Total: ${user.score}</strong>
@@ -444,6 +449,9 @@ <h1 class="page-title">Leaderboard</h1>
                                 <div>
                                     Hard: ${user.data.hardSolved} × ${hardPoints} = ${hardScore}
                                 </div>
+                                <div>
+                                  Questions Solved: ${user.data.totalSolved}
+                                </div>
                                 <hr>
                                 <div>
                                     <strong>Total: ${user.score}</strong>
@@ -476,6 +484,10 @@ <h1 class="page-title">Leaderboard</h1>
                             <div class="mobile-stat-number hard">${user.data.hardSolved}</div>
                             <div class="mobile-stat-label">Hard</div>
                         </div>
+                        <div class="mobile-stat">
+                            <div class="mobile-stat-number total">${user.data.totalSolved}</div>
+                            <div class="mobile-stat-label">Total</div>
+                        </div>
                     </div>
                 `;
           mobileCards.appendChild(card);
diff --git a/frontend/styles/main.css b/frontend/styles/main.css
index 34aba592..0bfb180d 100644
--- a/frontend/styles/main.css
+++ b/frontend/styles/main.css
@@ -818,7 +818,7 @@ body::after {
 
 .leaderboard-header {
   display: grid;
-  grid-template-columns: 55px 1fr 170px 65px 65px 65px 85px;
+  grid-template-columns: 55px 1fr 170px 65px 65px 65px 85px 85px;
   padding: 0.7rem 1.25rem;
   background: var(--bg-raised);
   font-weight: 700;
@@ -832,9 +832,9 @@ body::after {
   z-index: 99;
 }
 
-.leaderboard-row {
+.leaderboard-row{
   display: grid;
-  grid-template-columns: 55px 1fr 170px 65px 65px 65px 85px;
+  grid-template-columns: 55px 1fr 170px 65px 65px 65px 85px 85px;
   padding: 0.6rem 1.25rem;
   border-bottom: 1px solid var(--border);
   transition: background 0.1s ease;
@@ -1008,6 +1008,7 @@ body::after {
   justify-content: space-between;
   align-items: center;
   margin-bottom: 0.5rem;
+  gap:12px;
 }
 
 .mobile-rank {
@@ -1021,6 +1022,11 @@ body::after {
   font-weight: 700;
   color: var(--amber);
   text-shadow: 0 0 6px rgba(255, 176, 0, 0.3);
+  white-space: nowrap !important;
+  display: inline-flex;
+  align-items: center;
+  justify-content: flex-end;
+  gap:6px;
 }
 
 .mobile-name {
@@ -1028,6 +1034,8 @@ body::after {
   font-weight: 600;
   margin-bottom: 0.2rem;
   color: var(--text);
+  word-break: break-word;
+  overflow-wrap:break-word;
 }
 
 .mobile-username {
@@ -1622,8 +1630,8 @@ body::after {
 
 @media (max-width: 768px) {
   .score-tooltip {
-    left: auto;
-    right: 0;
+    left: auto !important;
+    right: -10px !important;
     /* left: 50%; */
     transform: translateX(0%);
     white-space: normal;
@@ -2183,7 +2191,7 @@ body::-webkit-scrollbar-thumb {
 .tooltip-score {
   position: relative;
   cursor: pointer;
-  display: inline-flex;
+  display: inline-flex !important;
   /* key fix */
   width: fit-content;
   align-items: center;
@@ -2192,6 +2200,7 @@ body::-webkit-scrollbar-thumb {
   color: #ffffff;
   font-weight: 700;
   text-shadow: 0 0 8px rgba(255, 255, 255, 0.25);
+  flex-shrink: 0;
 }
 
 .score-tooltip {

From 6af19b0205f1b1d63f3e5f7a5a1de8a54932cb30 Mon Sep 17 00:00:00 2001
From: Yashaswini K P <yashaswinikpyashu@gmail.com>
Date: Thu, 4 Jun 2026 11:30:46 +0530
Subject: [PATCH 2/2] formatting

---
 frontend/styles/main.css | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/frontend/styles/main.css b/frontend/styles/main.css
index 0bfb180d..96f0d552 100644
--- a/frontend/styles/main.css
+++ b/frontend/styles/main.css
@@ -832,7 +832,7 @@ body::after {
   z-index: 99;
 }
 
-.leaderboard-row{
+.leaderboard-row {
   display: grid;
   grid-template-columns: 55px 1fr 170px 65px 65px 65px 85px 85px;
   padding: 0.6rem 1.25rem;
@@ -1008,7 +1008,7 @@ body::after {
   justify-content: space-between;
   align-items: center;
   margin-bottom: 0.5rem;
-  gap:12px;
+  gap: 12px;
 }
 
 .mobile-rank {
@@ -1026,7 +1026,7 @@ body::after {
   display: inline-flex;
   align-items: center;
   justify-content: flex-end;
-  gap:6px;
+  gap: 6px;
 }
 
 .mobile-name {
@@ -1035,7 +1035,7 @@ body::after {
   margin-bottom: 0.2rem;
   color: var(--text);
   word-break: break-word;
-  overflow-wrap:break-word;
+  overflow-wrap: break-word;
 }
 
 .mobile-username {