Widget:Test: mudanças entre as edições

Widget:Test (ver código-fonte)

Edição das 21h57min de 16 de outubro de 2024

266 bytes adicionados , 16 outubro

sem sumário de edição

Renee

Administradores

5 667

edições

@@ Linha 61: / Linha 61: @@
          .variation-item img {
-            width: 100px;
-            height: 100px;
              display: block;
              margin: 0 auto 10px;
@@ Linha 104: / Linha 102: @@
                          },
                          additionalImages: [
-                             'https://wiki.pokexgames.com/images/d/dd/Squirtle_Purple_Ninja_Pack_Frente.png',  // Frente
+                             { url: 'https://wiki.pokexgames.com/images/d/dd/Squirtle_Purple_Ninja_Pack_Frente.png', width: 30 }, // Frente
-                             'https://wiki.pokexgames.com/images/5/50/Squirtle_Purple_Ninja_Pack_Esquerda.png',   // Lado Esquerdo
+                             { url: 'https://wiki.pokexgames.com/images/5/50/Squirtle_Purple_Ninja_Pack_Esquerda.png', width: 30 }, // Lado Esquerdo
-                             'https://wiki.pokexgames.com/images/a/af/Squirtle_Purple_Ninja_Pack_Direita.png',   // Costas
+                             { url: 'https://wiki.pokexgames.com/images/a/af/Squirtle_Purple_Ninja_Pack_Direita.png', width: 30 }, // Costas
-                             'https://wiki.pokexgames.com/images/5/5d/Squirtle_Purple_Ninja_Pack_Costas.png'   // Lado Direito
+                             { url: 'https://wiki.pokexgames.com/images/5/5d/Squirtle_Purple_Ninja_Pack_Costas.png', width: 30 }  // Lado Direito
                          ]
                      },
@@ Linha 118: / Linha 116: @@
                          },
                          additionalImages: [
-                             'https://wiki.pokexgames.com/images/1/13/Squirtle_Red_Ninja_Pack_Frente.png',  // Frente
+                             { url: 'https://wiki.pokexgames.com/images/1/13/Squirtle_Red_Ninja_Pack_Frente.png', width: 30 }, // Frente
-                             'https://wiki.pokexgames.com/images/1/1e/Squirtle_Red_Ninja_Pack_Esquerda.png',   // Lado Esquerdo
+                             { url: 'https://wiki.pokexgames.com/images/1/1e/Squirtle_Red_Ninja_Pack_Esquerda.png', width: 30 }, // Lado Esquerdo
-                             'https://wiki.pokexgames.com/images/0/01/Squirtle_Red_Ninja_Pack_Costas.png',   // Costas
+                             { url: 'https://wiki.pokexgames.com/images/0/01/Squirtle_Red_Ninja_Pack_Costas.png', width: 30 }, // Costas
-                             'https://wiki.pokexgames.com/images/f/fd/Squirtle_Red_Ninja_Pack_Direita.png'   // Lado Direito
+                             { url: 'https://wiki.pokexgames.com/images/f/fd/Squirtle_Red_Ninja_Pack_Direita.png', width: 30 }  // Lado Direito
                          ]
                      }
@@ Linha 181: / Linha 179: @@
                  imagesHtml += `
                      <div class="variation-item">
-                         <img src="${variation.additionalImages[0]}" alt="Variation Image" class="variation-image" data-variation-index="${index}">
+                         <img src="${variation.additionalImages[0].url}" alt="Variation Image" class="variation-image" data-variation-index="${index}" style="width: ${variation.additionalImages[0].width}px;">
-                           <div class="swap-button" data-variation-index="${index}"></div>
+                        <div class="swap-button" data-variation-index="${index}"></div>
                          <div class="image-info">
                              <b>Nome do Addon</b>: ${variation.description}
@@ Linha 207: / Linha 205: @@
                      currentImageIndex = (currentImageIndex + 1) % variation.additionalImages.length;
                      const variationImage = button.previousElementSibling;
-                     variationImage.src = variation.additionalImages[currentImageIndex];
+                     variationImage.src = variation.additionalImages[currentImageIndex].url;
+                    variationImage.style.width = `${variation.additionalImages[currentImageIndex].width}px`;
                  });
              });