fixed size error

app.py

@@ -174,25 +174,36 @@ def get_validator_data() -> pd.DataFrame:
     return df.sort_values('Step', ascending=False)[['Name', 'UID', 'Axon', 'API', 'Step', 'Recent Bits', 'Updated', 'VTrust']]
 
 # Create the Gradio interface
-app = gr.Blocks(css=custom_css)
+app = gr.Blocks(
+    title="SN36 Validator Leaderboard",
+    css="""
+        #component-0 { height: 100vh !important; }
+        .gradio-container { height: 100vh !important; }
+        .contain { height: 100vh !important; }
+        .main { height: 100% !important; }
+        .tabs { height: calc(100% - 100px) !important; }
+        .tab-panel { height: 100% !important; }
+        #leaderboard-table { height: calc(100% - 80px) !important; }
+    """
+)
 
 # Update the HTML template
 header_html = """
-<div class="title">
-    <h1> SN36 Validator Leaderboard</h1>
-    <p>Real-time tracking of validator performance and bits</p>
+<div style="text-align: center; max-width: 100%; padding: 1rem; background-color: #FF5733; border-radius: 1rem;">
+    <h1 style="color: white;">SN36 Validator Leaderboard</h1>
+    <p style="color: white;">Real-time tracking of validator performance and bits</p>
 </div>
 """
 
 with app:
     gr.HTML(header_html)
     
-    with gr.Tabs() as tabs:
-        with gr.Tab("📊 Leaderboard"):
+    with gr.Tabs(elem_id="main-tabs"):
+        with gr.Tab("📊 Leaderboard", elem_id="leaderboard-tab"):
             leaderboard = gr.DataFrame(
-                headers=['Name', 'UID', 'Axon', 'API', 'Step', 'Range', 'Updated', 'VTrust'],
-                datatype=['str', 'number', 'str', 'html', 'str', 'str', 'str', 'str'],  # Changed API to html
-                interactive=False,
+                headers=["Name", "UID", "Axon", "API", "Step", "Recent Bits", "Updated", "VTrust"],
+                datatype=["str", "number", "str", "str", "number", "str", "number", "number"],
+                elem_id="leaderboard-table"
             )
             
             with gr.Row(equal_height=True):