Mudanças entre as edições de "Widget:Gurren"
Ir para navegação
Ir para pesquisar
m |
|||
| Linha 18: | Linha 18: | ||
margin: 0 auto 0.75em; /* centraliza e dá espaço embaixo */ | margin: 0 auto 0.75em; /* centraliza e dá espaço embaixo */ | ||
height: 3em; /* um pouco mais alto */ | height: 3em; /* um pouco mais alto */ | ||
background: url('https://i.imgur.com/ | background: url('https://i.imgur.com/3ON2kVj.gif') center/cover no-repeat; | ||
border-radius: 0.75em; | border-radius: 0.75em; | ||
text-decoration: none; | text-decoration: none; | ||
Edição das 00h14min de 23 de abril de 2025
<a
href="https://discord.gg/SEULINK" class="social-widget" target="_blank" rel="noopener"
>
<img src="https://cdn.simpleicons.org/Discord/ffffff" alt="Discord" class="social-icon" />
</a> <style>
.social-widget {
display: block;
position: relative;
width: 95%; /* um pouquinho menos largo */
margin: 0 auto 0.75em; /* centraliza e dá espaço embaixo */
height: 3em; /* um pouco mais alto */
background: url('https://i.imgur.com/3ON2kVj.gif') center/cover no-repeat;
border-radius: 0.75em;
text-decoration: none;
box-sizing: border-box;
overflow: hidden;
transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.social-widget:hover {
transform: translateY(-2px);
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}
.social-widget .social-icon {
position: absolute;
top: 50%;
left: 50%; /* centraliza o ícone */
width: 2em; /* maior */
height: 2em;
transform: translate(-50%, -50%);
}
</style>
<a
href="https://discord.gg/SEULINK" class="social-widget" target="_blank" rel="noopener"
>
<img src="https://cdn.simpleicons.org/Discord/ffffff" alt="Discord" class="social-icon" />
</a>