my dark-mode keeps going off after refreshing page

Question

hello I am having trouble by keeping the dark-mode on when I switch pages or I refresh . I tried to play with java codes with no luck does anyone know what code should I add over my js so the it saves my theme ?? this is my code thanks in advance https://codepen.io/wissambattlaxe/pen/xxOvbmL

let button = document.querySelector('.onoffswitch-checkbox')

        button.addEventListener('click', ()=>{
          document.documentElement.classList.toggle('dark-mode')
        })

and this is the website : http://zabri.atwebpages.com/index

Answer 1

In order to persist the chosen theme, you will have to save the user's choice somewhere. Possible options are:

1. Inside the URL
2. In a cookie
3. In localStorage

Then, upon every page load, you will have lookup the saved choice and apply it.

To learn more about using localStorage, the MDN web docs are a great place to start.