the text color and its background color are white in Accordion component, so the text is invisible

#1
by chansung - opened

the text color and its background color are white in Accordion component, so the text is invisible

This looks like a result of the usage of the --button_secondary_text_color for accordion text in the parent Monochrome theme without the corresponding background.

At present I don't see a property to affect the accordion specifically without affecting the other buttons so you may need custom css for this.

One workaround would be to add custom css like this to change the span text color:

with gr.Blocks(theme="gstaff/xkcd",
               css="span {color: var(--block-info-text-color)}") as demo:

Hm. The css override did break the font family styling for me.
I hunted it down to a single line but the class name might be due to my layout:

.gradio-container-4-9-0 {
  color: var(--button-secondary-text-color);
}

When I disable this one rule in my browser's devtools it looks fine.

Sign up or log in to comment