Update app.py

app.py

@@ -98,49 +98,65 @@ def gradio_fn(message, history):
     )
 
 with gr.Blocks(css="""
-    /* page */
-    html, body { height: 100%; overflow-y: hidden; }
-
-    /* app container should always be visible & above images */
-    .gradio-container {
-        max-width: 600px;
-        margin: auto;
-        padding: 20px;
-        font-family: sans-serif;
-        position: relative;
-        min-height: 100vh;      /* ensures layout space */
-        z-index: 10;            /* sit above corner images */
-    }
-
-    .chatbot { height: 500px !important; overflow-y: auto; }
-
-    /* corner images */
-    .corner { position: fixed; pointer-events: none; z-index: 5; }  /* < z-index of container */
-    #left  { left: 8px;  bottom: 8px; }
-    #right { right: 8px; bottom: 100px; }  /* lift Krishna a bit */
-
-    .corner img {
-        height: min(70vh, 900px);   /* bigger but responsive */
-        width: auto;
-        display: block;
-    }
+    .gradio-container { 
+        max-width: 600px; 
+        margin: auto; 
+        padding: 20px; 
+        font-family: sans-serif; 
+        position: relative; 
+    } 
+    .chatbot { 
+        height: 500px !important; 
+        overflow-y: auto; 
+    } 
+    .corner { 
+        position: fixed; 
+        bottom: 2px; 
+        z-index: 9999; 
+        pointer-events: none; 
+    } 
+    #left { 
+        left: 2px; 
+    } 
+    #right { 
+        right: 2px; 
+    } 
+    .corner img { 
+        height: 500px; /* fixed height */ 
+        width: auto; /* auto to keep aspect ratio */ 
+    } 
 """) as demo:
-    gr.Markdown(...)
+    
+    gr.Markdown(
+        """
+        <div style='text-align: center; padding: 10px;'>
+            <h1 style='font-size: 2.2em; margin-bottom: 0.2em;'><span style='color: #4F46E5;'>kRISHNA.ai</span></h1>
+            <p style='font-size: 1.1em; color: #555;'>5000-Years of Ancient WISDOM with Modern AI ✨</p>
+        </div>
+        """,
+        elem_id="header"
+    )
+
     chat = gr.ChatInterface(
         fn=gradio_fn,
-        examples=[...],
+        examples=[
+            "Hello!",
+            "How can I overcome fear of failure?",
+            "How do I forgive someone who hurt me deeply?",
+            "What can I do to stop overthinking?"
+        ],
         chatbot=gr.Chatbot(type="messages", elem_classes="chatbot"),
         type="messages",
     )
+
     gr.HTML("""
-      <div id="left" class="corner">
-        <img src="https://huggingface.co/spaces/JDhruv14/gita/resolve/main/arjuna.png" alt="Arjun">
-      </div>
-      <div id="right" class="corner">
-        <img src="https://huggingface.co/spaces/JDhruv14/gita/resolve/main/krishna.png" alt="Krishna">
-      </div>
+        <div id="left" class="corner">
+            <img src="https://i.ibb.co/FhLg2yH/arjuna.png" alt="Arjun">
+        </div>
+        <div id="right" class="corner">
+            <img src="https://i.ibb.co/3sSDC6S/krishna.png" alt="Krishna">
+        </div>
     """)
 
-
 if __name__ == "__main__":
-    demo.launch()
+    demo.launch()