From 43b6b9bbe2d5f42c74d61e1ab196c1684f4733d1 Mon Sep 17 00:00:00 2001
From: danil_sitdikov <quadrad4@gmail.com>
Date: Fri, 28 Feb 2025 19:23:46 +0600
Subject: [PATCH 1/2] Fix table and add mobile view

---
 frontend/src/App.css                     | 1 -
 frontend/src/components/Chain/Chain.css  | 7 +------
 frontend/src/components/Chain/Header.css | 3 +--
 frontend/src/components/Chains.css       | 1 -
 frontend/src/components/List/List.css    | 2 ++
 frontend/src/components/Map/Map.css      | 1 -
 6 files changed, 4 insertions(+), 11 deletions(-)

diff --git a/frontend/src/App.css b/frontend/src/App.css
index 6145afa90..c96d6c8ed 100644
--- a/frontend/src/App.css
+++ b/frontend/src/App.css
@@ -20,7 +20,6 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.
   text-align: left;
   font-family: Roboto, Helvetica, Arial, sans-serif;
   font-size: 16px;
-  min-width: 1318px;
 }
 
 .App-no-telemetry {
diff --git a/frontend/src/components/Chain/Chain.css b/frontend/src/components/Chain/Chain.css
index 8cc19ea45..7c3fe1b66 100644
--- a/frontend/src/components/Chain/Chain.css
+++ b/frontend/src/components/Chain/Chain.css
@@ -17,16 +17,11 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.
 */
 
 .Chain-content-container {
-  position: absolute;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  top: 148px;
+  position: relative;
 }
 
 .Chain-content {
   width: 100%;
-  min-width: 1350px;
   min-height: 100%;
   background: #2c2b2b;
   color: #fff;
diff --git a/frontend/src/components/Chain/Header.css b/frontend/src/components/Chain/Header.css
index 20d06cb53..5a5519879 100644
--- a/frontend/src/components/Chain/Header.css
+++ b/frontend/src/components/Chain/Header.css
@@ -18,11 +18,10 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.
 
 .Header {
   width: 100%;
-  height: 108px;
+  min-height: 108px;
   overflow: hidden;
   background: #fff;
   color: #000;
-  min-width: 1350px;
   position: relative;
   background: linear-gradient(0deg, rgba(0,0,0,0.2) 0%, rgb(255, 255, 255) 17%), white;
 }
diff --git a/frontend/src/components/Chains.css b/frontend/src/components/Chains.css
index 48b91717e..359afd202 100644
--- a/frontend/src/components/Chains.css
+++ b/frontend/src/components/Chains.css
@@ -21,7 +21,6 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.
   color: #000;
   padding: 0 76px 0 16px;
   height: 40px;
-  min-width: 1350px;
   position: relative;
 }
 
diff --git a/frontend/src/components/List/List.css b/frontend/src/components/List/List.css
index ae616948c..61109a2f4 100644
--- a/frontend/src/components/List/List.css
+++ b/frontend/src/components/List/List.css
@@ -20,6 +20,7 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.
   /* Prevents the list from auto-scrolling while cascading node
    * updates on new block, which helps with performance. */
   overflow-anchor: none;
+  overflow-x: auto;
 }
 
 .List-no-nodes {
@@ -36,6 +37,7 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.
 
 .List--table {
   width: 100%;
+  min-width: 1200px;
   border-spacing: 0;
   font-family: monospace, sans-serif;
 }
diff --git a/frontend/src/components/Map/Map.css b/frontend/src/components/Map/Map.css
index 7cd54d024..4f98a11a4 100644
--- a/frontend/src/components/Map/Map.css
+++ b/frontend/src/components/Map/Map.css
@@ -17,7 +17,6 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.
 */
 
 .Map {
-  min-width: 1350px;
   background: url('../../assets/world-map.svg') no-repeat;
   background-size: contain;
   background-position: center;

From 03aed125563c150649902ead9a63a81670f0a088 Mon Sep 17 00:00:00 2001
From: danil_sitdikov <quadrad4@gmail.com>
Date: Tue, 11 Mar 2025 17:32:33 +0600
Subject: [PATCH 2/2] Use min height for the table

---
 frontend/src/components/List/List.css | 1 +
 frontend/src/components/List/List.tsx | 3 ++-
 2 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/frontend/src/components/List/List.css b/frontend/src/components/List/List.css
index 61109a2f4..cb0a35f99 100644
--- a/frontend/src/components/List/List.css
+++ b/frontend/src/components/List/List.css
@@ -21,6 +21,7 @@ along with this program. If not, see <https://www.gnu.org/licenses/>.
    * updates on new block, which helps with performance. */
   overflow-anchor: none;
   overflow-x: auto;
+  min-height: 150px;
 }
 
 .List-no-nodes {
diff --git a/frontend/src/components/List/List.tsx b/frontend/src/components/List/List.tsx
index a80c62dbc..54f3ba541 100644
--- a/frontend/src/components/List/List.tsx
+++ b/frontend/src/components/List/List.tsx
@@ -25,6 +25,7 @@ import { viewport } from '../../utils';
 const HEADER = 148;
 const TH_HEIGHT = 35;
 const TR_HEIGHT = 31;
+const BOTTOM_PADDING = 40;
 const ROW_MARGIN = 5;
 
 import './List.css';
@@ -102,7 +103,7 @@ export class List extends React.Component<ListProps> {
 
     return (
       <>
-        <div className="List" style={{ height }}>
+        <div className="List" style={{ height: height + BOTTOM_PADDING }}>
           <table className="List--table">
             <THead columns={selectedColumns} sortBy={sortBy} />
             <tbody>