Save local changes before pull

app.py

@@ -1,282 +1,92 @@
 import gradio as gr
-from chatbot import respond
+from chatbot import respond  # Assuming this is correctly defined elsewhere
 
-# Ultra-unique travel-themed CSS
-custom_css = """
-.gradio-container {
-    font-family: 'Cinzel', serif; /* Vintage explorer font */
-    background: url('https://www.transparenttextures.com/patterns/old-map.png') repeat, linear-gradient(135deg, #2b2d42 0%, #8d5524 50%, #d4a017 100%); /* Map texture + earthy tones */
-    color: #ffffff;
-    padding: 50px;
-    min-height: 100vh;
-    position: relative;
-    overflow: hidden;
-    animation: windBlow 25s infinite ease-in-out;
-}
-
-/* Compass and travel artifacts */
-.gradio-container::before {
-    content: '';
-    position: absolute;
-    top: 10%;
-    left: 5%;
-    width: 120px;
-    height: 120px;
-    background: url('https://img.icons8.com/?size=100&id=10447&format=png&color=000000') no-repeat center;
-    opacity: 0.4;
-    animation: compassSpin 20s infinite linear;
-}
-.gradio-container::after {
-    content: '';
-    position: absolute;
-    bottom: 5%;
-    right: 5%;
-    width: 100px;
-    height: 100px;
-    background: url('https://img.icons8.com/?size=100&id=98766&format=png&color=000000') no-repeat center; /* Suitcase */
-    opacity: 0.3;
-    animation: suitcaseBounce 10s infinite ease-in-out;
-}
-
-/* Chat container with parchment vibe */
-.chatbot {
-    background: rgba(245, 245, 220, 0.9); /* Parchment-like */
-    border-radius: 20px;
-    padding: 30px;
-    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5), inset 0 0 10px rgba(139, 69, 19, 0.3);
-    border: 3px solid #8d5524; /* Leather-brown border */
-    transition: all 0.5s ease;
-    width: 90%;
-    max-width: 900px;
-    height: 1000px; /* Matches your increased height */
-    overflow-y: auto;
-}
-.chatbot:hover {
-    border-color: #d4a017; /* Golden highlight */
-    box-shadow: 0 15px 50px rgba(212, 160, 23, 0.4);
-}
-
-/* Messages with travel flair */
-.chatbot .message {
-    border-radius: 15px;
-    padding: 20px 25px;
-    margin: 15px 0;
-    max-width: 75%;
-    font-size: 18px;
-    animation: messageFade 0.6s ease-out;
-    border: none !important;
-    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
-}
-.chatbot .message.bot {
-    background: linear-gradient(135deg, #87cefa 0%, #4682b4 100%); /* Ocean breeze */
-    color: #ffffff;
-}
-.chatbot .message.user {
-    background: linear-gradient(135deg, #deb887 0%, #cd853f 100%); /* Sandy desert */
-    color: #2b2d42;
-    margin-left: auto;
-}
-
-/* Textbox with explorer’s journal style */
-.textbox {
-    background: rgba(245, 245, 220, 0.7);
-    border: 3px solid #8d5524;
-    border-radius: 20px;
-    color: #2b2d42;
-    padding: 15px 30px;
-    font-size: 18px;
-    transition: all 0.4s ease;
-    box-shadow: 0 3px 15px rgba(0, 0, 0, 0.2);
-}
-.textbox:focus {
-    border-color: #d4a017;
-    background: rgba(245, 245, 220, 0.9);
-    box-shadow: 0 0 25px rgba(212, 160, 23, 0.7);
-}
-
-/* Button with adventure flair */
-.button {
-    background: linear-gradient(135deg, #d4a017 0%, #8d5524 100%); /* Gold to leather */
-    color: #ffffff;
-    border-radius: 20px;
-    padding: 15px 40px;
-    font-size: 18px;
-    font-weight: 700;
-    transition: all 0.3s ease;
-    position: relative;
-    overflow: hidden;
-    box-shadow: 0 5px 20px rgba(139, 69, 19, 0.4);
-}
-.button:hover {
-    transform: translateY(-4px);
-    box-shadow: 0 10px 30px rgba(212, 160, 23, 0.6);
-}
-.button::after {
-    content: '';
-    position: absolute;
-    width: 120px;
-    height: 120px;
-    background: rgba(255, 255, 255, 0.4);
-    border-radius: 50%;
-    transform: scale(0);
-    animation: ripple 0.6s linear;
-    pointer-events: none;
-}
-.button:active::after {
-    animation: ripple 0.6s linear;
-}
-
-/* Title and subheader with explorer’s charm */
-h1 {
-    font-size: 3.5em;
-    text-align: center;
-    color: #d4a017; /* Golden */
-    text-shadow: 4px 4px 12px rgba(0, 0, 0, 0.5);
-    margin-bottom: 10px;
-    animation: titleReveal 2s ease-in-out;
-}
-h3 {
-    text-align: center;
-    color: #ffffff;
-    font-size: 1.6em;
-    margin-bottom: 30px;
-    animation: fadeIn 2.5s ease-in-out;
-    font-style: italic;
-}
-
-/* Animations */
-@keyframes windBlow {
-    0% { background-position: 0 0; }
-    50% { background-position: 100px 100px; }
-    100% { background-position: 0 0; }
-}
-@keyframes compassSpin {
-    0% { transform: rotate(0deg); }
-    100% { transform: rotate(360deg); }
-}
-@keyframes suitcaseBounce {
-    0%, 100% { transform: translateY(0); }
-    50% { transform: translateY(-25px); }
-}
-@keyframes messageFade {
-    0% { opacity: 0; transform: translateX(-20px); }
-    100% { opacity: 1; transform: translateX(0); }
-}
-@keyframes titleReveal {
-    0% { opacity: 0; transform: scale(0.9); }
-    60% { opacity: 1; transform: scale(1.05); }
-    100% { opacity: 1; transform: scale(1); }
-}
-@keyframes fadeIn {
-    0% { opacity: 0; }
-    100% { opacity: 1; }
-}
-@keyframes ripple {
-    0% { transform: scale(0); opacity: 1; }
-    100% { transform: scale(4); opacity: 0; }
-}
-
-/* Slider with travel aesthetic */
-.slider {
-    --track-color: #8d5524;
-    --thumb-color: #d4a017;
-    transition: all 0.3s ease;
-}
-.slider:hover {
-    --thumb-color: #ffffff;
-}
-
-/* Footer */
-.footer {
-    text-align: center;
-    color: #ffffff !important;
-    font-size: 1em;
-    margin-top: 2em;
-    animation: fadeIn 3s ease-in-out;
-    text-shadow: 2px 2px 6px rgba(0, 0, 0, 0.3);
-}
-"""
-
-# Enhanced travel-themed respond function
-def enhanced_respond(message, history, system_message, max_tokens, temperature=0.7, top_p=0.95):
+# Travel-themed response function with a fun twist
+def travel_respond(message, history, system_message, max_tokens, temperature=0.7, top_p=0.95):
     response = respond(message, history, system_message, max_tokens, temperature, top_p)
     if "❌" in response or "not found" in response.lower():
-        response += "\n\n🧭 **Explorer’s Hint:** Chart a course with 'Flights from London to Tokyo in May' or 'Hidden gems in Barcelona from March 10 2025 to March 15 2025'! ✈️"
+        response = "🌍 Oops, let’s chart a new course! Try something like 'Flights to Rome next month' or 'Hidden gems in Thailand'."
     else:
-        response = f"🗺️ {response} 🌍 Where will your compass point next, adventurer? ✈️"
+        response = f"✈️ {response} 🌴 Ready to pack your bags? What’s your next stop?"
     return history + [[message, response]], ""  # Clears textbox
 
-# Ultimate travel interface
-with gr.Blocks(css=custom_css) as demo:
+# Attractive, travel-inspired interface with highlighted Travelo
+with gr.Blocks(
+    theme=gr.themes.Soft(primary_hue="blue", secondary_hue="teal"),
+    title="Travelo - Your Journey Starts Here",
+    css="""
+        .header { text-align: center; font-family: 'Arial', sans-serif; color: #1a3c6d; }
+        .header h1 { font-size: 3em; font-weight: bold; text-shadow: 2px 2px 4px #4682b4; }
+        .chatbot { border: 2px solid #1a3c6d; border-radius: 15px; background: #f0f8ff; }
+        .textbox { border-radius: 10px; }
+        .button { background: #1a3c6d; color: white; border-radius: 10px; font-weight: bold; }
+        .footer { text-align: center; color: #4682b4; font-size: 0.9em; margin-top: 20px; }
+        body { background: url('https://www.transparenttextures.com/patterns/paper-fibers.png'); }
+    """
+) as demo:
+    # Bold, highlighted Travelo header
     gr.Markdown(
         """
-        <div style="color: white !important;">
-            🗺️ Forged by Travelo LLC | Unravel the globe’s wonders, one tale at a time! ✈️
-        </div>
+        # ✈️ Travelo 🌍  
+        ### Your Passport to Adventure Awaits!  
+        Plan your dream trip with me – let’s explore the world!
         """,
-        elem_classes=["footer"]
-    )
-
-    gr.Markdown(
-        """
-        # ✈️ Travelo - The Explorer’s Chronicle 🧭
-        ### Embark on Epic Quests with Your Trusty Guide!
-        """,
-        elem_classes=["title"]
+        elem_classes=["header"]
     )
 
+    # Chatbot with a travel flair
     chatbot = gr.Chatbot(
-        height=800,  # Kept your increased height
-        label="Travelo’s Logbook",
-        bubble_full_width=False,
+        height=600,
+        bubble_full_width=True,
         avatar_images=(
-            "https://img.icons8.com/?size=100&id=98766&format=png&color=000000",  # Suitcase
-            "https://img.icons8.com/?size=100&id=124350&format=png&color=000000"  # Airplane
+            "https://img.icons8.com/?size=100&id=124349&format=png&color=000000",  # Backpack for user
+            "https://img.icons8.com/?size=100&id=124350&format=png&color=1a3c6d"   # Colored airplane for Travelo
         ),
-        placeholder="🗺️ Begin your epic tale here, weary traveler..."
+        placeholder="🌴 Where’s your next adventure? Ask me anything!",
+        elem_classes=["chatbot"]
     )
 
+    # Input area with a vibrant, compact design
     with gr.Row(variant="compact"):
         textbox = gr.Textbox(
-            placeholder="Seek your destiny! (e.g., 'Secret trails in Patagonia')",
+            placeholder="Dream big! (e.g., 'Best hikes in Patagonia' or 'Flights to Santorini')",
             lines=1,
             elem_classes=["textbox"],
             autofocus=True
         )
-        submit_btn = gr.Button("✈️ Set Sail", elem_classes=["button"])
-
-    with gr.Accordion("🧭 Explorer’s Gear", open=False):
-        max_tokens = gr.Slider(
-            minimum=1,
-            maximum=2048,
-            value=512,
-            step=1,
-            label="Legend Length",
-            info="How vast shall your travel saga be?"
-        )
+        submit_btn = gr.Button("🌍 Explore", elem_classes=["button"])
 
+    # Hidden settings for a seamless experience
     system_message = gr.Textbox(
-        value="You are an AI-powered travel assistant named Travelo. You are developed by Travelo LLC. Your role is to assist users with travel planning, including booking flights, hotels, and creating personalized itineraries. Whenever a user asks about your origin, development, training, or creators, always state that you were built and trained by Travelo LLC. Do not mention OpenAI or any third-party AI providers. Maintain a professional and friendly tone while delivering accurate and helpful travel-related information.",
+        value="You are Travelo, a travel assistant built by Travelo LLC. Help users plan trips, book flights, find hotels, and create itineraries with a fun, friendly tone. If asked about your origins, say you were built by Travelo LLC. Inspire travel excitement!",
+        visible=False
+    )
+    max_tokens = gr.Slider(
+        minimum=1,
+        maximum=1024,
+        value=256,
+        step=1,
         visible=False
     )
 
+    # Playful footer with a travel quote
     gr.Markdown(
         """
-        🗺️ Forged by Travelo LLC | Unravel the globe’s wonders, one tale at a time! ✈️
+        🌴 *“The world is full of magic – let’s find it together!”* – Travelo LLC
         """,
         elem_classes=["footer"]
     )
 
     # Event triggers
     textbox.submit(
-        enhanced_respond,
+        travel_respond,
         inputs=[textbox, chatbot, system_message, max_tokens],
         outputs=[chatbot, textbox]
     )
     submit_btn.click(
-        enhanced_respond,
+        travel_respond,
         inputs=[textbox, chatbot, system_message, max_tokens],
         outputs=[chatbot, textbox]
     )
 
-demo.launch()
+demo.launch(share=True)  # Public link enabled