const toggleButton = document.getElementById('modeToggle');
function setMode(mode) {
if (mode === 'dark') {
document.body.classList.add('dark-mode');
toggleButton.textContent = '☀️';
} else {
document.body.classList.remove('dark-mode');
toggleButton.textContent = '🌙';
}
}
const storedMode = localStorage.getItem('theme');
if (storedMode) setMode(storedMode);
toggleButton.addEventListener('click', () => {
const isDark = document.body.classList.toggle('dark-mode');
localStorage.setItem('theme', isDark ? 'dark' : 'light');
toggleButton.textContent = isDark ? '☀️' : '🌙';
});
< button id="languageToggle" >🌐</button>
< h2 class="titulo-centrado" data-key="title3"> </h2 >
const translations = {
es: { title3: "Proyecto" },
en: { title3: "Project" }
};
function setLanguage(lang) {
localStorage.setItem("lang", lang);
document.querySelectorAll("[data-key]").forEach(el => {
const key = el.getAttribute("data-key");
if (translations[lang][key]) {
el.textContent = translations[lang][key];
}
});
}
document.addEventListener("DOMContentLoaded", () => {
const currentLang = localStorage.getItem("lang") || "es";
setLanguage(currentLang);
document.getElementById("languageToggle").addEventListener("click", () => {
const newLang = currentLang === "es" ? "en" : "es";
setLanguage(newLang);
});
});
@media (min-width: 768px) {
.profile {
flex-direction: row;
justify-content: center;
text-align: left;
}
}
Github.
