<h1>En vanlig rubrik</h1>
<p>Li Europan lingues es membres del sam familie. Lor separat existentie es un myth.</p>
<div>
  <button id="togglesomething" onClick="minFunktion();">toggle something on/off</button>
body.toggled {
  background-image: linear-gradient( #e66465 0%, #9198e5 100%);
  background-repeat:no-repeat;
}

#togglesomething {border-radius:5px;padding:1em}
    // hämta body elementet och spara i en variabel
    var b = document.body;

    // när sidan laddas:
    // finns redan en sparad inställning för dark mode?
    if (!localStorage.getItem('darkmode') ) {
      // om inte, skapa ny data punkt och spara grundinställningen "off" --> avstängd i localStorage
      localStorage.setItem('darkmode', 'off');
    } else {
      // annars ladda inställningen och applicera den genom att tillhörande function utförs
      if(localStorage.getItem('darkmode') === "on") {
        // sätt på dark darkmode
        darkModeOn();
      }
      // annars behöver du inte göra något, då grundinställningen är "false" / av
    }

    // funktion för att hantera knapp tryck
    function minFunktion() {
      // hämta nuvarande inställning ur localStorage
      var darkmode = localStorage.getItem('darkmode');
      // villkorsats - om darkmode är avstängd, sätt på nu genom att anropa korrekt funktion
      if (darkmode == "off") {
        // sätt på
        darkModeOn();
      } else {
        // stäng av
        darkModeOff();
      }
    }

    // funktion för att sätta på 
    function darkModeOn() {
      // toggle klass - lägg till
      b.classList.toggle('toggled');
      // spara ny inställning till localStorage
      localStorage.setItem('darkmode', "on");
    }

    // funktion för att stänga av
    function darkModeOff() {
      // toggle klass - ta bort
      b.classList.toggle('toggled');
      // spara ny inställning till localStorage
      localStorage.setItem('darkmode', "off");
    }

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.