Update app.py

app.py

@@ -22,10 +22,13 @@ def generate_table(number):
         return "<h3 style='color:red;'>⚠️ Please enter a valid number!</h3>"
 
 # Gradio interface
-title = "<span style='color:purple;'>🌟 Multiplication Table Chatbot for Kids 🌟</span>"
+title = """
+<h1 style='color:purple; text-shadow: 2px 2px 4px #FFA500;'>🌟 Multiplication Table Chatbot for Kids 🌟</h1>
+"""
+
 description = """
-<h3 style='color:orange;'>🎨 Welcome to the fun and colorful multiplication chatbot for kids! 🎨</h3>
-<ul style="color:darkblue; font-size: 16px;">
+<h3 style='color:orange; text-shadow: 1px 1px 2px #FF6347;'>🎨 Welcome to the fun and colorful multiplication chatbot for kids! 🎨</h3>
+<ul style="color:darkblue; font-size: 18px; font-family: Comic Sans MS;">
     <li>Type a number to see its vibrant multiplication table!</li>
     <li>Type <b>0</b> to exit.</li>
 </ul>
@@ -38,9 +41,15 @@ with gr.Blocks() as interface:
     
     with gr.Row():
         with gr.Column():
-            input_box = gr.Number(label="<span style='color:teal;'>Enter a number</span> 🎲", elem_id="input-box")
+            input_box = gr.Number(
+                label="<span style='color:teal; font-size: 18px;'>Enter a number</span> 🎲", 
+                elem_id="input-box"
+            )
         with gr.Column():
-            output_box = gr.HTML(label="<span style='color:crimson;'>Your Colorful Multiplication Table</span>", elem_id="output-box")
+            output_box = gr.HTML(
+                label="<span style='color:crimson; font-size: 18px;'>Your Colorful Multiplication Table</span>",
+                elem_id="output-box"
+            )
     
     generate_button = gr.Button("🎉 Generate Table 🎉", elem_id="generate-button")
     exit_message = gr.HTML(elem_id="exit-message")