Editor toolbox icons not visible when selected while using dark app theme color on dark mode

[reddexx]

Describe the Bug

In Edit Mode Right Side

Steps to Reproduce

Go To Edit Mod with Dark Mode

Expected Behaviour

Empty Icon see

Screenshots or Additional Context

No response

Browser Details

Chrome

Exact BookStack Version

23.10

[ssddanbrown]

Thanks for reporting @reddexx.
I'm assuming you have a dark primary app color (header bar color) set for dark mode?

I've used the primary color here but the link color may be more appropriate instead.

[reddexx]

yes is the Primary Color

[reddexx]

I have change this CSS

.floating-toolbox .tabs-inner>button:hover, .floating-toolbox.open .tabs-inner>button.active {
background-color: var(--color-primary-light);
color: #fff9f9;
border-bottom: 1px solid #000;
border-top: 1px solid #000;
}

unfortunately the declaration is often bound with many ID, see GIF

[reddexx]

@ssddanbrown this Working

.floating-toolbox .tabs-inner>button:active, .floating-toolbox.open .tabs-inner>button.active {
background-color: var(--color-primary-light);
color: #fff9f9;
border-bottom: 1px solid #000;
border-top: 1px solid #000;
}

[ssddanbrown]

yes is the Primary Color

Thanks for confirming. I've assigned to the next patch release, with an aim to just use the link color instead of the primary app color (Or a lighter grey as demoed above if that does not suit).

[ssddanbrown]

This has now been addressed within 02d1401, to be part of the next patch release.

Thanks again for reporting @reddexx!