Widget:Teste

De Wiki Gla
Revisão de 12h42min de 8 de maio de 2025 por Gurren1 (discussão | contribs)
Ir para navegação Ir para pesquisar

<style> .wiki-social-wrapper .social-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 0.75em; justify-content: center; }

@media screen and (max-width: 1024px) { .wiki-social-wrapper .social-cards { grid-template-columns: repeat(2, 1fr); gap: 0.5em; } }

.wiki-social-wrapper .social-card { position: relative; height: 4em; border-radius: 1em; overflow: hidden; cursor: pointer; margin: 0; text-decoration: none; background: rgba(20, 20, 20, 0.7); border: 1px solid rgba(255, 255, 255, 0.1); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); transition: border 0.3s ease, box-shadow 0.3s ease; display: flex; align-items: center; }

.wiki-social-wrapper .social-card:hover { border: 1px solid var(--hover-color); box-shadow: 0 0 8px var(--hover-color); }

.wiki-social-wrapper .social-card-content { position: relative; z-index: 2; display: flex; align-items: center; padding: 0 1em; width: 100%; height: 100%; color: #fff; transition: filter 0.3s ease; text-shadow: 0 1px 2px black; font-smooth: always; -webkit-font-smoothing: antialiased; transform: translateZ(0); }

.wiki-social-wrapper .social-card:hover .social-card-content { filter: brightness(1.2); }

.wiki-social-wrapper .social-icon { width: 2em; height: 2em; margin-right: 0.75em; flex-shrink: 0; filter: drop-shadow(0 1px 1px black); image-rendering: auto; transform: translateZ(0); }

.wiki-social-wrapper .social-name { font-size: 1.2em; font-weight: bold; text-decoration: none; }

.wiki-social-wrapper .sprite-hover { position: absolute; bottom: -20px; right: -10px; width: 64px; height: auto; opacity: 0; pointer-events: none; transition: opacity 0.3s ease, transform 0.3s ease; z-index: 2; }

.wiki-social-wrapper .social-card:hover .sprite-hover { opacity: 1; transform: translateY(-20px); }

.wiki-social-wrapper .social-card.discord { --hover-color: rgba(114, 137, 218, 0.85); }

.wiki-social-wrapper .social-card.tiktok { --hover-color: rgba(0, 0, 0, 0.85); }

.wiki-social-wrapper .social-card.instagram { --hover-color: rgba(193, 53, 132, 0.85); }

.wiki-social-wrapper .social-card.facebook { --hover-color: rgba(24, 119, 242, 0.85); } </style>

Disponível em “https://wiki.gla.com.br/index.php?title=Widget:Teste&oldid=32281”