Skip Navigation

User banner

Wren

@ WrenHavoc @lemmy.dbzer0.com

Posts
1
Comments
3
Joined
2 yr. ago

I'm Wren (they/them). I'm a programmer and cybersecurity researcher. I have a blog I don't update enough.

  • Problems with dark-theme toggle

    Jump

  • Thanks, it's working perfectly!

  • Problems with dark-theme toggle

    Jump

  • I already have a dark theme set, I'm using catppuccin's colors What I'm trying to have it do is when a button is pressed, it switches to the light version of it

    currently my code looks something like this: 

     
        
#theme-toggle:checked ~ body {
  background-color: #eff1f5;
  color: #fff;
}

#theme-toggle:checked ~ html {
  background-color: #eff1f5;
}

#theme-toggle:checked ~ .content {
  background-color: #eff1f5;
}

    the button itself is a checkbox that has display set to none and the label set as an svg so when you click the icon, it gets checked.

     
        
<input style="display: none;" type="checkbox" id="theme-toggle">
                <label for="theme-toggle" class="theme-button">
                    <img class="theme-button-svg" src="./icons/half-moon.svg">
                </label>

    I used a similar strategy when making the menu for the site so I know it should work