Mudanças entre as edições de "Widget:Gb"
Ir para navegação
Ir para pesquisar
| Linha 1: | Linha 1: | ||
<div class="gb-mob-card"> | <div class="gb-mob-card-glow"> | ||
<div class="gb-mob-card-name">{{{nome}}}</div> | <div class="gb-mob-card-name">{{{nome}}}</div> | ||
<a href="{{{link}}}"> | <a href="{{{link}}}"> | ||
| Linha 8: | Linha 8: | ||
<style> | <style> | ||
.gb-mob-card { | .gb-mob-card-glow { | ||
width: | width: 160px; | ||
border-radius: | border-radius: 16px; | ||
overflow: hidden; | overflow: hidden; | ||
text-align: center; | text-align: center; | ||
font-family: Arial, sans-serif; | font-family: Arial, sans-serif; | ||
background: # | background: linear-gradient(145deg, #222, #111); | ||
color: #fff; | color: #fff; | ||
margin: | margin: 12px; | ||
box-shadow: 0 0 15px rgba(255, 87, 34, 0.5); | |||
transition: transform 0.3s, box-shadow 0.3s, filter 0.3s; | |||
border: 2px solid #ff5722; | |||
} | } | ||
.gb-mob-card:hover { | .gb-mob-card-glow:hover { | ||
transform: translateY(- | transform: translateY(-8px) scale(1.03); | ||
box-shadow: 0 | box-shadow: 0 0 25px rgba(255, 87, 34, 0.8), 0 0 40px rgba(255, 152, 0, 0.5); | ||
filter: brightness(1.1); | |||
} | } | ||
.gb-mob-card img { | .gb-mob-card-glow img { | ||
width: 100%; | width: 100%; | ||
height: | height: 130px; | ||
object-fit: cover; | object-fit: cover; | ||
display: block; | display: block; | ||
border-bottom: 2px solid #ff5722; | |||
} | } | ||
.gb-mob-card-name { | .gb-mob-card-name { | ||
font-weight: bold; | font-weight: bold; | ||
padding: | padding: 10px 0; | ||
background: # | background: linear-gradient(90deg, #ff5722, #ff9800); | ||
-webkit-background-clip: text; | |||
-webkit-text-fill-color: transparent; | |||
font-size: 16px; | |||
} | } | ||
.gb-mob-card-button { | .gb-mob-card-button { | ||
display: block; | display: block; | ||
background- | background: #ff5722; | ||
color: white; | |||
text-decoration: none; | |||
padding: 6px 0; | |||
margin: 10px; | |||
border-radius: 8px; | |||
font-weight: bold; | |||
transition: background 0.3s, transform 0.3s; | |||
} | |||
.gb-mob-card-button:hover { | |||
background: #ff9800; | |||
transform: scale(1.05); | |||
} | |||
</style> | |||
Edição das 04h53min de 27 de agosto de 2025
{{{nome}}}
<a href="{{{link}}}">
<img src="{{{imagem}}}" alt="{{{nome}}}">
</a>
<a class="gb-mob-card-button" href="{{{link}}}">Ver Página</a>
<style> .gb-mob-card-glow {
width: 160px; border-radius: 16px; overflow: hidden; text-align: center; font-family: Arial, sans-serif; background: linear-gradient(145deg, #222, #111); color: #fff; margin: 12px; box-shadow: 0 0 15px rgba(255, 87, 34, 0.5); transition: transform 0.3s, box-shadow 0.3s, filter 0.3s; border: 2px solid #ff5722;
}
.gb-mob-card-glow:hover {
transform: translateY(-8px) scale(1.03); box-shadow: 0 0 25px rgba(255, 87, 34, 0.8), 0 0 40px rgba(255, 152, 0, 0.5); filter: brightness(1.1);
}
.gb-mob-card-glow img {
width: 100%; height: 130px; object-fit: cover; display: block; border-bottom: 2px solid #ff5722;
}
.gb-mob-card-name {
font-weight: bold; padding: 10px 0; background: linear-gradient(90deg, #ff5722, #ff9800); -webkit-background-clip: text; -webkit-text-fill-color: transparent; font-size: 16px;
}
.gb-mob-card-button {
display: block; background: #ff5722; color: white; text-decoration: none; padding: 6px 0; margin: 10px; border-radius: 8px; font-weight: bold; transition: background 0.3s, transform 0.3s;
}
.gb-mob-card-button:hover {
background: #ff9800; transform: scale(1.05);
} </style>