secondaryTextColor

Using Streamlit
1

Hi,
in config.toml we have options backgroundColor & secondaryBackgroundColor.
But only textColor. Which means 1 text color for 2 backgrounds.

Which limits the “pretty” combinations of colors.
For example, text=black, background=white, secondary=black. Has good display in main page, but bad display in sidebar.

So would be possible to add the option secondaryTextColor in “config.toml”?

thanks

2

Hi @iuiu,

Thanks for posting!

Are you looking to change the colors of the text?

If yes, this might be of help:

Colored text, using the syntax :color[text to be colored], where color needs to be replaced with any of the following supported colors: blue, green, orange, red, violet.

import streamlit as st

st.markdown('Streamlit is **_really_ cool**.')
st.markdown("This text is :red[colored red], and this is **:blue[colored]** and bold.")
st.markdown(":green[$\sqrt{x^2+y^2}=1$] is a Pythagorean identity. :pencil:")

732×159 12.9 KB

If this is not what you’re looking for, please provide more explanation and example.

3

hi tony,
thanks for the hack & quick response.

Pitty is the “:color[txt]” doesn’t accept black or white, which is the usual color text.

To put an example, i want, a black sideBar with white text. And white main page with black text.

To achieve this with a typical sideBar with buttons, text-input, etc. you need to go very low lvl with css.

That’s why, i think a “secondaryText” in config.toml would make more sense.

Another option, not so clean, but effective, would be to add black & white as options to “:color[txt]”

1 Like
4

Yes, for now, the hacky way is to use CSS with st.markdown to edit the sidebar as needed. Let me know if you run into any issues building that part.

5

i’m using css, but code now is less accessible for “only python” users. Having secondaryText or “:white[text]” would be preferable

that said, i’m stucked on making " st.checkbox" white (White text in config.toml is black).
Cause the css class for text (As far as i understand) is .stMarkdownContainer (and not .stCheckBox)

so
.stCheckbox > label {
color: white;
}
doesn’t work. and
.stMarkdownContainer > label {
color: white;
}
makes a lot of widgets in the main page go with white text

thanks

6

This topic was automatically closed 180 days after the last reply. New replies are no longer allowed.