From 434b3b656e8e30952789b689945bd1de85c9c9f4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Andr=C3=A9=20Silva?= <andre15andre@hotmail.com>
Date: Fri, 20 Sep 2024 14:49:42 +0200
Subject: [PATCH] model name should always appear in full

---
 webpage/src/components/LeaderboardTable.css | 34 ++++++++-------------
 webpage/src/components/LeaderboardTable.js  |  4 ++-
 2 files changed, 15 insertions(+), 23 deletions(-)

diff --git a/webpage/src/components/LeaderboardTable.css b/webpage/src/components/LeaderboardTable.css
index 705ed78c9..977319c16 100644
--- a/webpage/src/components/LeaderboardTable.css
+++ b/webpage/src/components/LeaderboardTable.css
@@ -177,38 +177,28 @@
 
 .model-name-cell {
   position: relative;
-  width: 200px; /* Adjust this value as needed */
-  overflow: hidden;
+  width: auto; /* Change from fixed width to auto */
+  min-width: 200px; /* Set a minimum width */
+  max-width: none; /* Remove max-width constraint */
+  white-space: nowrap;
+  overflow: visible; /* Change from hidden to visible */
 }
 
 .model-name-content {
   white-space: nowrap;
-  overflow-x: auto;
-  scrollbar-width: none; /* Firefox */
-  -ms-overflow-style: none; /* Internet Explorer 10+ */
-}
-
-.model-name-content::-webkit-scrollbar {
-  display: none; /* WebKit */
+  overflow: visible; /* Change from auto to visible */
 }
 
+/* Remove these styles as they're no longer needed */
 .model-name-cell:hover .model-name-content {
-  overflow-x: scroll;
-}
-
-/* Show scrollbar on hover for WebKit browsers */
-.model-name-cell:hover .model-name-content::-webkit-scrollbar {
-  display: block;
-  height: 5px;
-}
-
-.model-name-cell:hover .model-name-content::-webkit-scrollbar-thumb {
-  background-color: rgba(0, 0, 0, 0.2);
-  border-radius: 2.5px;
+  overflow-x: visible;
 }
 
+/* Remove scrollbar styles */
+.model-name-cell:hover .model-name-content::-webkit-scrollbar,
+.model-name-cell:hover .model-name-content::-webkit-scrollbar-thumb,
 .model-name-cell:hover .model-name-content::-webkit-scrollbar-track {
-  background-color: rgba(0, 0, 0, 0.1);
+  display: none;
 }
 
 .header-content {
diff --git a/webpage/src/components/LeaderboardTable.js b/webpage/src/components/LeaderboardTable.js
index d9886d7d4..e2659ae93 100644
--- a/webpage/src/components/LeaderboardTable.js
+++ b/webpage/src/components/LeaderboardTable.js
@@ -123,7 +123,9 @@ const LeaderboardTable = () => {
             <div className="model-name-content">{value}</div>
           </div>
         ),
-        disableSortBy: false
+        disableSortBy: false,
+        width: 'auto', // Allow the column to adjust its width
+        minWidth: 100, // Set a minimum width
       },
       {
         Header: `Defects4J (${bugCounts.defects4j || 0} bugs)`,