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

Edição das 23h50min de 23 de dezembro de 2024

<style>

.dropdown { border: 1px solid #ccc; display: none; position: absolute; background-color: #fff; max-height: 150px; overflow-y: auto; max-width: 30; /* Ajusta a largura mínima */ box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Adiciona uma sombra sutil */ }

   .image-container {
       display: flex;
       flex-direction: column;
       align-items: center;
       justify-content: center;
   }
   .image-item { 
       margin-bottom: 1em; 
       text-align: center;
   }
   .image-item img {
       display: block;
       margin: 0 auto;
   }

   .variations-container {
       display: flex;
       flex-wrap: wrap;
       justify-content: center;
       margin-top: 1em;
   }

   .variation-item {
       width: 35%;
       box-sizing: border-box;
       margin: 5px;
       text-align: center;
       border: 1px solid ;
       padding: 10px;
   }

   .variation-item img {
       display: block;
       margin: 0 auto 10px;
   }

   .swap-button { 
       margin-top: 10px;
       cursor: pointer;
       width: 15px;
       height: 15px;
       background: url('https://wiki.pokexgames.com/images/f/fb/SwapButtonAddons.png') no-repeat center;
       background-size: contain;
       display: block;
       margin: 0 auto;
   }

.input-group {

   display: flex;
   justify-content: center;
   position: relative;
   margin-bottom: 1em;

}

.dropdown-item {

   padding: 10px;
   cursor: pointer;
   display: flex;
   align-items: center;
   justify-content: center;

}

.dropdown-item:hover {

   background-color: #f2e8f8; 
   border-color: #d1c1e0;

} .dropdown-item:focus {

   border-color: #d1c1e0;

}

.dropdown-item img {

   margin-right: 10px;

} </style>

@@ Linha 1: / Linha 1: @@
 <style>
-    .input-group { margin-bottom: 1em; position: relative; text-align: center; }
 .dropdown {
 border: 1px solid #ccc;
@@ Linha 60: / Linha 59: @@
      }
-#imageSearch {
+.input-group {
-    width: 30%;
+     display: flex;
-    padding: 12px 15px; /* Aumenta o tamanho do campo */
+     justify-content: center;
-    font-size: 18px; /* Tamanho da fonte mais legível */
+     position: relative;
-    border-radius: 14px; /* Bordas arredondadas */
+     margin-bottom: 1em;
-    border: 1px solid #ccc; /* Borda suave */
-    background-color: #f9f9f9; /* Cor de fundo mais clara */
-    transition: all 0.3s ease; /* Transição suave para foco */
-}
-#imageSearch:focus {
-    border-color: #d1c1e0; /* Borda azul quando em foco */
-    background-color: #f2e8f8; /* Cor de fundo ao focar */
-    outline: none; /* Remove o contorno padrão */
-}
-#dropdown {
-    position: absolute;
-    top: 100%; /* Coloca o dropdown abaixo do input */
-    left: 50%; /* Alinha o centro do dropdown com o centro do campo de entrada */
-    transform: translateX(-50%); /* Ajusta para que o centro do dropdown esteja alinhado com o campo de entrada */
-    width: 30%; /* Faz o dropdown ter a mesma largura do input */
-    max-height: 300px;
-    overflow-y: auto;
-    background-color: white;
-    border-radius: 14px;
-    border: 1px solid #ccc;
-     display: none; /* Inicialmente invisível */
-     box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
-     z-index: 10;
-     text-align: center;
 }

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

Edição das 23h50min de 23 de dezembro de 2024

Menu de navegação

Pesquisa