HideSidebar: Not light mode compatible.
Closed this issue · 2 comments
Possible solution:
.hide-sidebar-btn {
color: var(--interactive-normal);
background-color: var(--background-secondary);
transition: background-color .15s ease-out,color .15s ease-out;
}
.hide-sidebar-btn:hover {
color: #fff;
background-color: var(--brand-experiment);
}
At first, I wanted it to look the same as the original but I thought it may be a better idea to replicate the colors of the Discord button and server icons.
The text color is a bit lighter than the original in dark mode but I'm maybe you could find another variable you could use.
The background color I changed to blue just like the Discord button and servers without explicit icons.
The transition used is the same as the transition on the Discord button and server icons.
The hover color and background color are also the same as on the Discord button and servers.
Note that putting the CSS in the custom CSS editor may not work just because of the specificity in CSS. Putting e.g. body
(notice there's a space right after it) before the 1st and 8th line (both starting with a dot) should make it work there