Make text in "Eleven Labs Supported Languages" section smaller

This commit also introduces another chagne in gooey_ui that accepts
props for `caption` and `expander` as kwargs.

daras_ai_v2/text_to_speech_settings_widgets.py

@@ -270,9 +270,16 @@ def text_to_speech_settings():
                     key="elevenlabs_similarity_boost",
                 )
 
-            with st.expander("Eleven Labs Supported Languages"):
-                st.caption("With Multilingual V2 voice model")
-                st.caption(", ".join(ELEVEN_LABS_SUPPORTED_LANGS))
+            with st.expander(
+                "Eleven Labs Supported Languages",
+                style={"fontSize": "0.9rem", "textDecoration": "underline"},
+            ):
+                st.caption(
+                    "With Multilingual V2 voice model", style={"fontSize": "0.8rem"}
+                )
+                st.caption(
+                    ", ".join(ELEVEN_LABS_SUPPORTED_LANGS), style={"fontSize": "0.8rem"}
+                )
 
 
 @st.cache_data()

gooey_ui/components.py

@@ -131,7 +131,8 @@ def success(body: str, icon: str = "✅", *, unsafe_allow_html=False):
 
 
 def caption(body: str, **props):
-    markdown(body, style={"fontSize": "0.9rem"}, className="text-muted", **props)
+    style = props.setdefault("style", {"fontSize": "0.9rem"})
+    markdown(body, className="text-muted", **props)
 
 
 def option_menu(*args, options, **kwargs):
@@ -391,12 +392,13 @@ def button(
 form_submit_button = button
 
 
-def expander(label: str, *, expanded: bool = False):
+def expander(label: str, *, expanded: bool = False, **props):
     node = state.RenderTreeNode(
         name="expander",
         props=dict(
             label=dedent(label),
             open=expanded,
+            **props,
         ),
     )
     node.mount()