|
|
Linha 5: |
Linha 5: |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | | <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
| <title>Busca de Imagens por Nome</title> | | <title>Busca de Imagens por Nome</title> |
| <style>
| | |
| .input-group { margin-bottom: 1em; position: relative; }
| |
| .dropdown {
| |
| border: 1px solid #ccc;
| |
| display: none;
| |
| position: absolute;
| |
| background-color: #fff;
| |
| z-index: 1000;
| |
| max-height: 150px;
| |
| overflow-y: auto;
| |
| width: 100%;
| |
| }
| |
| .dropdown-item {
| |
| padding: 8px;
| |
| cursor: pointer;
| |
| display: flex;
| |
| align-items: center;
| |
| }
| |
| .dropdown-item img {
| |
| margin-right: 10px;
| |
| }
| |
| .dropdown-item:hover {
| |
| background-color: #f0f0f0;
| |
| }
| |
| .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;
| |
| }
| |
| </style>
| |
| </head> | | </head> |
| <body> | | <body> |