added background

app.py

@@ -4,83 +4,14 @@ import requests
 import pandas as pd
 from apscheduler.schedulers.background import BackgroundScheduler
 
+background_url2 = 'https://media.discordapp.net/attachments/1294437373773484093/1305702292774719569/80-_.png?ex=6733fd85&is=6732ac05&hm=f94d26610cc6c9d39318a102fb2484eae6ab83a64226eba3af81fbe305245fc2&=&format=webp&quality=lossless&width=717&height=414'
+background_url  = 'https://media.discordapp.net/attachments/1294437373773484093/1299205237877510184/p7zQRQMPb8W1qitaFl_C9_c6ef80e2981d4a27a53c3708de43bb44.jpg?ex=67336cea&is=67321b6a&hm=aaa1d39210d631d9f800802da8a869c71e395802574ae61bee6030671f53ef3c&=&format=webp'
 # Enhanced Custom CSS
-custom_css = """
-.gradio-container {
-    max-width: 1200px !important;
-    margin: auto;
-    background-color: #1a1a1a;
-}
-
-.title {
-    text-align: center;
-    margin-bottom: 2rem;
-    padding: 2rem 0;
-    background: linear-gradient(90deg, #FF4B1F 0%, #FF9068 100%);
-    border-radius: 10px;
-    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
-}
-
-.title h1 {
-    color: white;
-    font-size: 2.5rem;
-    margin: 0;
-    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
-}
-
-.title p {
-    color: rgba(255, 255, 255, 0.9);
-    font-size: 1.1rem;
-    margin: 0.5rem 0 0 0;
-}
-
-/* Style the tabs */
-.tabs {
-    margin-top: 1rem;
-}
-
-/* Style the DataFrame */
-.dataframe {
-    border-radius: 8px;
-    overflow: hidden;
-    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
-}
-
-/* Style the refresh button */
-.refresh-btn {
-    background: linear-gradient(90deg, #FF4B1F 0%, #FF9068 100%);
-    border: none;
-    padding: 10px 20px;
-    border-radius: 5px;
-    color: white;
-    font-weight: bold;
-    cursor: pointer;
-    transition: transform 0.2s;
-}
-
-.refresh-btn:hover {
-    transform: translateY(-2px);
-}
-
-/* Status message styling */
-.status-msg {
-    color: #888;
-    font-style: italic;
-    margin-top: 1rem;
-}
-
-/* Custom styling for API status indicators */
-.api-status {
-    font-size: 1.2em;
-}
-
-.api-up {
-    color: #00ff00;
-}
-
-.api-down {
-    color: #ff0000;
-}
+custom_css = f"""
+.gradio-container {{
+    background: url('{background_url2}') no-repeat center center fixed !important;
+    background-size: cover !important;
+}}
 """
 
 # Add error handling for bittensor initialization
@@ -173,23 +104,16 @@ def get_validator_data() -> pd.DataFrame:
     df['VTrust'] = df['VTrust'].round(4)
     return df.sort_values('Step', ascending=False)[['Name', 'UID', 'Axon', 'API', 'Step', 'Recent Bits', 'Updated', 'VTrust']]
 
-# Create the Gradio interface
+# Create the Gradio interface with custom theme
 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; }
-    """
+    css=custom_css,
+    theme=gr.themes.Default()
 )
 
 # Update the HTML template
 header_html = """
-<div style="text-align: center; max-width: 100%; padding: 1rem; background-color: #FF5733; border-radius: 1rem;">
+<div style="text-align: center; max-width: 100%; padding: 1rem; background-color: #1f2937; 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>
@@ -266,5 +190,7 @@ with app:
     
     setup_auto_refresh()
 
-# Launch the interface
-app.launch()
+# Launch the interface with file serving enabled
+app.launch(
+    share=False
+)