[DOUBT] Buttons are not visible in light mode

[dhruv-ahuja]

Hey I was trying out the theme today (looks really clean by the way :D) and saw that the light mode hides the buttons. I wanted to know whether this is intentional or not as they are visible with the dark theme.

I switched between the themes by manually setting the default value in the partials/header.html file.

Light Mode:

Dark Mode:

[dhruv-ahuja]

Okay so I've figured out what the issue was. Disabling or moving this piece of code to dark.scss file fixes the issue:

@media (prefers-color-scheme: dark) {
  .social > img {
    filter: invert(1);
  }
}

Not sure why but this property is being applied even when we set "light" as the theme value.

I removed the @media call and just added the rest of the code as it is into the root element and that worked.

[not-matthias]

Thanks for investigating this! Feel free to create a pull request with the changes.

[dhruv-ahuja]

Cool, will do that! Also, I had forked the repo to make some other modifications to the theme as per my liking, one of which is adding a toggle button, similar to the one in Archie-zola. I have used the icon logic from there but the underlying theme selection code is different. Would you be interested in having this functionality in the Apollo theme? If so, I can create a PR with this logic in place, else I can make the PR with just the changes for the icon visibility.

Here's the link to my fork's branch with the code.

Here's screenshots of the toggle button: light theme:

dark theme:

Thanks!

[dhruv-ahuja]

hey, any update regarding this?

[not-matthias]

Sorry, didn't see the message and was busy with university. I'd love to have a theme toggle button! :D

[dhruv-ahuja]

created the PR 👍