Customizing css variables of theme.css seems to have no impact for some variables.

[SebastianJL]

I am trying to customize some of the colors of my website. To this end I try using css variables as outlined here:
https://pydata-sphinx-theme.readthedocs.io/en/latest/user_guide/customizing.html#css-theme-variables

I run the following pydata-sphinx-theme version:

(zfit) johannes@phoenix (add_minimizers *+ u+1):~/projects/zfit/docs$ pip list | grep pydata
pydata-sphinx-theme           0.5.0

And I have the following custom.css:

:root {
    --pst-color-navbar-link: 0, 0, 255;
    --pst-color-navbar-link-active: 255, 0, 0;

    --pst-color-sidebar-link: 0, 0, 255;
}

I choose the colors to clearly demonstrate my point. Now as you can see in the screenshot below
--pst-color-navbar-link-active and --pst-color-sidebar-link seem to work while --pst-color-navbar-link seems to have no effect.

Can you explain to me what I am doing wrong or fix it in case it is a bug?

[SebastianJL]

I searched a bit for the reason.
What I could find is that most of the css variables where introduced in the following commit:
ce4712d#diff-fc866547e42836e02e369ac0a0c084aa77e4311390d76f50ff41a4e43212c789

As it turns out the variables

• --color-navbar-link
• --color-navbar-link-hover
• possibly others?

where defined in this commit but not actually used to define the color of the navbar links.

[jorisvandenbossche]

where defined in this commit but not actually used to define the color of the navbar links.

Yes, indeed, it seems we missed that in the PR. Only --pst-color-navbar-link-active is actually used at the moment:

pydata-sphinx-theme/src/scss/_navbar.scss

Lines 31 to 40 in b5351c5

	.navbar-nav {
	li a {
	padding: 0 15px;
	}
	> .active > .nav-link {
	font-weight: 600;
	color: rgba(var(--pst-color-navbar-link-active), 1);
	}
	}

We should add the main color and hover color there as well.

It seems that for the left sidebar and the right TOC, we correctly used all three variables.

Thanks for the catch!

[SebastianJL]

@jorisvandenbossche
Thanks a lot for fixing this so fast. 😍