Mudanças entre as edições de "Widget:Droflax"

De Wiki Gla
Ir para navegação Ir para pesquisar
Linha 18: Linha 18:
   document.querySelectorAll('.skill-icon').forEach(icon => {
   document.querySelectorAll('.skill-icon').forEach(icon => {
     const idx = icon.dataset.index;
     const idx = icon.dataset.index;
     const desc = icon.dataset['desc-' + lang] || icon.dataset['desc-pt'];
 
     // Selección de idioma usando camelCase dataset
    let desc = icon.dataset.descPt; // fallback
    switch(lang) {
      case 'pt': desc = icon.dataset.descPt; break;
      case 'es': desc = icon.dataset.descEs; break;
      case 'en': desc = icon.dataset.descEn; break;
      case 'pl': desc = icon.dataset.descPl; break;
    }
 
     const descBox = document.querySelector('.skill-desc[data-index="' + idx + '"]');
     const descBox = document.querySelector('.skill-desc[data-index="' + idx + '"]');
     if(descBox) descBox.textContent = desc;
     if(descBox) descBox.textContent = desc;

Edição das 17h34min de 27 de agosto de 2025

 <a href="?lang=pt" title="Português">
   <img src="https://upload.wikimedia.org/wikipedia/en/0/05/Flag_of_Brazil.svg" width="32" height="24">
 </a>
 <a href="?lang=es" title="Español">
   <img src="https://upload.wikimedia.org/wikipedia/en/9/9a/Flag_of_Spain.svg" width="32" height="24">
 </a>
 <a href="?lang=en" title="English">
   <img src="https://upload.wikimedia.org/wikipedia/en/a/a4/Flag_of_the_United_States.svg" width="32" height="24">
 </a>
 <a href="?lang=pl" title="Polski">
   <img src="https://upload.wikimedia.org/wikipedia/en/1/12/Flag_of_Poland.svg" width="32" height="24">
 </a>

<script> function setLang(lang) {

 document.querySelectorAll('.skill-icon').forEach(icon => {
   const idx = icon.dataset.index;
   // Selección de idioma usando camelCase dataset
   let desc = icon.dataset.descPt; // fallback
   switch(lang) {
     case 'pt': desc = icon.dataset.descPt; break;
     case 'es': desc = icon.dataset.descEs; break;
     case 'en': desc = icon.dataset.descEn; break;
     case 'pl': desc = icon.dataset.descPl; break;
   }
   const descBox = document.querySelector('.skill-desc[data-index="' + idx + '"]');
   if(descBox) descBox.textContent = desc;
 });

}

// Inicializa idioma por defecto setLang('pt');

// Selector de banderas document.querySelectorAll('.language-switch img').forEach(img => {

 img.addEventListener('click', e => {
   e.preventDefault();
   const lang = img.parentElement.getAttribute('href').replace('?lang=',);
   setLang(lang);
 });

}); </script>

<style> .language-switch {

 display: flex;
 gap: 6px;
 margin: 8px 0;

} .language-switch img {

 border: 1px solid #ccc;
 border-radius: 6px;
 cursor: pointer;
 transition: transform 0.2s ease, border-color 0.2s ease;

} .language-switch img:hover {

 transform: scale(1.1);
 border-color: #333;

} </style>