Update app.py

app.py

@@ -172,7 +172,12 @@ css = """
     max-width: 520px;
 }
 """
-
+js_callback = """
+(fontSize) => {
+    document.body.style.fontSize = fontSize;
+    return "";
+}
+"""
 # --- Gradio Interface ---
 with gr.Blocks(css="""
 .user-msg { background: #e3f2fd; border-radius: 15px; padding: 10px; margin: 5px; }
@@ -184,17 +189,14 @@ with gr.Blocks(css="""
         value="Medium",
         label="Font Size"
     )
+    demo_markdown = gr.Markdown("### This text (and all other text) will change size dynamically.")
+    sample_text = gr.Textbox(label="Try typing here:", value="The quick brown fox jumps over the lazy dog.")
     font_style = gr.HTML()  # This will receive the injected CSS for font size
     font_choice.change(
         fn=get_font_size,
         inputs=font_choice,
-        outputs=[],  # no output component needed
-        _js="""
-        (fontSize) => {
-            document.body.style.fontSize = fontSize;
-            return "";
-        }
-        """
+        outputs=[],  # No output component is updated by Python.
+        js=js_callback  # This JS code runs on the client to update the page.
     )
 
     gr.Markdown("## Voice Input: Record your prompt")