Discourse's CSS variables aren't set

No matter what theme I’m using, all menus and popup alerts / dialogs show with transparent background color !!

looks like maybe you do not have a color palette assigned to the theme? you need to assign color palettes to a theme. there should be a drop down field to select one at the top of the theme page in admin-customize-themes. did the color palette for that theme get removed?

There is a color pallete assigned to the theme … I can easily for example change the background color to #ffffff using the custom css section but this only works with default theme …

Is this an error or something I should report ?

This doesn’t look like the default theme, is it a custom theme that made the old dropdown menu transparent by mistake?


yea it’s odd to see the transparent elements. you kinda have to do that on purpose so i wonder if there’s some code from another theme in there or something. i use semi transparent stuff on our site but i code all that in. looks like corners have been rounded a bit too so there’s some customization there i think. did you copy some code or adapt this from another theme? did you edit or add any CSS recently?

i would view your forum in safe mode and go from there.

No, this happend even before installing any theme … I assume it was using a defaulkt theme or something as shown from the admin / settings …

None, I’m still trying toi figure out … this is supposed to be a fresh install of discourse / docker …
I’m using the main branch … could this be too early to use or something … I can;t even see anyone has reported such case

there some coding going on there, the avatar and menus have rounded corners and the transparency looks suspicious. what is in common CSS and desktop CSS?

do you have theme components intalled? have you run in safe mode?

It seems you are not using the default theme. Is the theme public? Did you do customization on it?

Also, I see on your forum that you miss the color definitions.

There is an asasy color scheme that you’re using, but it’s empty. I’m not sure how it’s even possible.

Try to change the color scheme to the default one?

1 Like

I did … same thing
I disabled everything

This is what I got first time I run the system … using the default theme … then I tried to install other themes … but same issue …

The point I forgot to mention, the database was running on old discourse … so this happened after upgrading the latest version …

When you go there:

Do you see, for example, the “mint-light” color scheme?

(On your forum, the color definitions are empty as well).

Yes I see it … I can;t change it directly so I clonded it … changed all colors and used the new color pallete for the theme … same issue …

In case the related theme tables in database (example: theme_fields) … I found some old stuff from the previous vertsion of discourse … I’m wonsdering if that would cause the issue … can I reset this table ?

Even if you change the color scheme in your preferences?

Yes … even if I did that …
Also, whenever I use a dark color pallette … and I refresh the page, I see a dark screen then I switches to light mode after … I’m afraid my theme tables are messed up !!

Notice when I inspect the page for the menu div section style … I found this

the secondary variable is calculated as rgba(0,0,0,0) … I don’t know from where this coming


those rgba(xxx) codes are making everything transparent. that is exactly what i was talking about.

What you see is the default values.

The issue is that the generated color definitions CSS is empty for some reason.
If you look at the file, there is nothing inside.

Even with the default theme/color scheme, do you still have the issue?


If you say so, I’m unsure what your issue would be.

1 Like