Mudanças entre as edições de "Widget:Teste2"

De Wiki Gla
Ir para navegação Ir para pesquisar
Linha 1: Linha 1:
<a href="LINK_DA_PAGINA" class="news-card-link">
<div class="minimal-changelog-widget">
<div class="news-card">
<div class="changelog-item">
<div class="news-image-container">
<img src="URL_DO_ICONE" class="changelog-icon">
<img src="https://wiki.gla.com.br/images/f/fb/Guiainiciante_card.png" class="news-image">
<div class="changelog-info">
<div class="changelog-header">
<div class="changelog-title">Informativos</div>
<div class="changelog-date">21.04.2025</div>
</div>
</div>
<div class="news-info">
<p class="changelog-desc">
<div class="news-header">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse vel justo quis arcu faucibus
<div class="news-title">Informativos</div>
aliquet.
<span class="news-date">21.04.2025</span>
</div>
<p class="news-desc">
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
</p>
</p>
</div>
</div>
</div>
</div>
</a>


<a href="LINK_DA_PAGINA" class="news-card-link">
<div class="changelog-item">
<div class="news-card">
<img src="URL_DO_ICONE" class="changelog-icon">
<div class="news-image-container">
<div class="changelog-info">
<img src="https://wiki.gla.com.br/images/f/fb/Guiainiciante_card.png" class="news-image">
<div class="changelog-header">
</div>
<div class="changelog-title">Ranqueada</div>
<div class="news-info">
<div class="changelog-date">20.04.2025</div>
<div class="news-header">
<div class="news-title">Informativos</div>
<span class="news-date">21.04.2025</span>
</div>
</div>
<p class="news-desc">
<p class="changelog-desc">
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Nova temporada disponível a partir de 10/04 com medalhas exclusivas e ícones especiais.
</p>
</p>
</div>
</div>
</div>
</div>
</a>


<a href="LINK_DA_PAGINA" class="news-card-link">
<div class="changelog-item">
<div class="news-card">
<img src="URL_DO_ICONE" class="changelog-icon">
<div class="news-image-container">
<div class="changelog-info">
<img src="https://wiki.gla.com.br/images/f/fb/Guiainiciante_card.png" class="news-image">
<div class="changelog-header">
</div>
<div class="changelog-title">Evento Temporário</div>
<div class="news-info">
<div class="changelog-date">19.04.2025</div>
<div class="news-header">
<div class="news-title">Informativos</div>
<span class="news-date">21.04.2025</span>
</div>
</div>
<p class="news-desc">
<p class="changelog-desc">
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Fist of Love: evento de 11 a 24 de abril para enfrentar um poderoso herói da Marinha.
</p>
</p>
</div>
</div>
</div>
</div>
</a>
 
</div>


<style>
<style>
.news-card-link {
.minimal-changelog-widget {
text-decoration: none;
font-family: sans-serif;
color: inherit;
display: block;
max-width: 600px;
max-width: 600px;
margin: 0 auto;
margin: 0 auto;
Linha 60: Linha 50:
}
}


.news-card-link:hover,
.changelog-item {
.news-card-link:focus,
display: flex;
.news-card-link:active,
align-items: flex-start;
.news-card-link * {
padding: 8px 0;
text-decoration: none !important;
border-bottom: 1px solid #eee;
}
}


.news-card {
.changelog-item:last-of-type {
border: 1px solid #ddd;
border-bottom: none;
border-radius: 6px;
margin-bottom: 16px;
overflow: hidden;
background: #fff;
box-sizing: border-box;
}
}


.news-image-container {
.changelog-icon {
width: 100%;
width: 32px;
height: 120px;
height: 32px;
overflow: hidden;
margin-right: 10px;
position: relative;
flex-shrink: 0;
}
}


.news-image {
.changelog-info {
width: 100%;
flex: 1;
height: 100%;
object-fit: cover;
display: block;
transition: 0.4s ease-out;
}
}


.news-card-link:hover .news-image {
.changelog-header {
transform: scale(1.05);
}
 
.news-info {
padding: 10px 14px;
box-sizing: border-box;
}
 
.news-header {
display: flex;
display: flex;
align-items: center;
align-items: center;
justify-content: space-between;
justify-content: space-between;
margin-bottom: 4px;
}
}


.news-title {
.changelog-title {
font-size: 1em;
font-size: 1.1em;
font-weight: bold;
font-weight: bold;
color: #333;
color: #333;
Linha 114: Linha 85:
}
}


.news-date {
.changelog-date {
font-size: 0.9em;
font-size: 0.9em;
color: #888;
color: #888;
Linha 120: Linha 91:
}
}


.news-desc {
/* Descrição */
.changelog-desc {
margin: 4px 0 0 0;
font-size: 0.9em;
font-size: 0.9em;
color: #555;
color: #555;
line-height: 1.4;
line-height: 1.4;
margin: 0;
}
}
</style>
</style>

Edição das 01h26min de 13 de abril de 2025

<img src="URL_DO_ICONE" class="changelog-icon">

Informativos
21.04.2025

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse vel justo quis arcu faucibus aliquet.

<img src="URL_DO_ICONE" class="changelog-icon">

Ranqueada
20.04.2025

Nova temporada disponível a partir de 10/04 com medalhas exclusivas e ícones especiais.

<img src="URL_DO_ICONE" class="changelog-icon">

Evento Temporário
19.04.2025

Fist of Love: evento de 11 a 24 de abril para enfrentar um poderoso herói da Marinha.

<style> .minimal-changelog-widget { font-family: sans-serif; max-width: 600px; margin: 0 auto; box-sizing: border-box; }

.changelog-item { display: flex; align-items: flex-start; padding: 8px 0; border-bottom: 1px solid #eee; }

.changelog-item:last-of-type { border-bottom: none; }

.changelog-icon { width: 32px; height: 32px; margin-right: 10px; flex-shrink: 0; }

.changelog-info { flex: 1; }

.changelog-header { display: flex; align-items: center; justify-content: space-between; }

.changelog-title { font-size: 1.1em; font-weight: bold; color: #333; margin: 0; }

.changelog-date { font-size: 0.9em; color: #888; margin-left: 10px; }

/* Descrição */ .changelog-desc { margin: 4px 0 0 0; font-size: 0.9em; color: #555; line-height: 1.4; } </style>

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