Dark mode toggle hover and transparency issue

[bgorfain]

When you hover over the dark mode button when in light mode, there are two very slightly different colors: #210d26 and #000000. The dots on the light mode background are slightly lighter than the background of the button. Also, the white part of the button that sits on top of the black background that expands into dark mode when the button is pressed is slightly misaligned. I spent some time trying to fix this but I don't know anything about html or css.

[theRTC204]

I'm not following, what exactly is the issue? Perhaps providing a screenshot of what you think is wrong would help.

[bgorfain]

The dots on the button are a slightly different color that the background of the rest of the button. It's pretty insignificant, but I don't think it's meant to look like that.

Also:

There is a bit of black on the bottom right edge of the button which makes it look misaligned.

[theRTC204]

Ah, some of this appears to be the result of #237 combined with some issues from the Darkmode.js 3rd party library.

[DevSplash]

Could you provide your browser version? I can't reproduce it.

[DevSplash]

Ah, some of this appears to be the result of #237 combined with some issues from the Darkmode.js 3rd party library.

It seems unrelated, but I can fix it.

[theRTC204]

It seems unrelated, but I can fix it.

It's directly related. That PR is where the opacity was introduced, and the opacity is exactly what is causing the button color to change as you scroll the page.

[DevSplash]

It seems unrelated, but I can fix it.

It's directly related. That PR is where the opacity was introduced, and the opacity is exactly what is causing the button color to change as you scroll the page.

I tried to remove the opacity, but the problem persists. The button on the official website also have the problem when using a light background.

[theRTC204]

I'm not refering to the black edge that's peaking out. If you read my original message that you quoted, I do say the reported issues are a combination of that PR and some existing issues in the library itself.

The concerns mentioned about the background are the result of the opacity changes.

The black edge poking out is from the library.

[DevSplash]

I'm not refering to the black edge that's peaking out. If you read my original message that you quoted, I do say the reported issues are a combination of that PR and some existing issues in the library itself.

The concerns mentioned about the background are the result of the opacity changes.

The black edge poking out is from the library.

Yes, you are right. Adding background-color instead of the opacity might fix it.

[bgorfain]

Awesome!