Buenas tardes a ustedes en la comunidad, estoy aquí para saber cómo usar el código en el contexto de localStorage. Me gustaría almacenar con el mismo uno de los diferentes temas elegidos por el usuario que luego permite aplicarlos en las diferentes páginas que visitará el usuario. ¿Cómo puedo hacer esto?

Adjunto el código HTML y los scripts:

 <footer class="center blur padding-16"> <p class="bold">NewTechSlyDev_</p> <div class="mini-grid-container" id="myThemes"> <div class="default-theme mini-polaroid circle little-resize pointer" data-tema="" title="Default"></div> <div class="dark-theme mini-polaroid circle little-resize pointer" data-tema="dark" title="Dark"></div> <div class="transparent-theme mini-polaroid circle little-resize pointer" data-tema="transparent" title="Transparent"></div> <div class="apricot-theme mini-polaroid circle little-resize pointer" data-tema="apricot" title="Apricot"></div> <div class="past-theme mini-polaroid circle little-resize pointer" data-tema="past" title="Past"></div> <div class="panorama-theme mini-polaroid circle little-resize pointer" data-tema="panorama" title="Panorama"></div> <div class="blank-theme mini-polaroid circle little-resize pointer" data-tema="blank" title="Blank"></div> <div class="slimanoworld-theme mini-polaroid circle little-resize pointer" data-tema="slimanoworld" title="SlimanoWorld"></div> </div> <script> function scegliTema(tema) { const body = document.body; if (body.dataset.tema) body.classList.remove(body.dataset.tema); body.dataset.tema = tema; if (tema) body.classList.add(tema); } (() => { const elementi = document.querySelectorAll('#myThemes > div'); for (let i = 0; i < elementi.length; ++i) { const el = elementi[i]; const nomeTema = el.dataset.tema ? el.dataset.tema + '-theme' : ''; elementi[i].addEventListener('click', function() { scegliTema(nomeTema) }); } })(); </script> </footer>