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

De Wiki Gla
Ir para navegação Ir para pesquisar
Linha 1: Linha 1:
<div class="changelog-container">
<div class="changelog-container">
<div class="changelog-card">
<div class="change-item">
<div class="card-header">
<div class="change-header">
<span class="card-date">08/04/2025 - Evento</span>
<span class="change-title">RANQUEADA</span>
<span class="change-date">08/04/2025</span>
</div>
</div>
<h2 class="card-title">Fist of Love</h2>
<hr>
<p class="card-desc">
<p class="change-text">Nova temporada disponível 10/04</p>
Participe deste evento temporário de 11 a 24 de abril e enfrente um poderoso herói da Marinha!
<a href="LINK_DA_RANQUEADA" target="_blank">
</p>
<img src="URL_DO_ICONE" class="change-image">
<a href="LINK_DO_DISCORD_OU_WIKI" class="card-link" target="_blank">Confira detalhes</a>
</a>
</div>
</div>


<div class="changelog-card">
<div class="change-item">
<div class="card-header">
<div class="change-header">
<span class="card-date">09/04/2025 - Ranqueada</span>
<span class="change-title">EVENTO TEMPORÁRIO</span>
<span class="change-date">09/04/2025</span>
</div>
</div>
<h2 class="card-title">Nova Temporada</h2>
<hr>
<p class="card-desc">
<p class="change-text">Fist of Love: de 11 a 24 de abril</p>
Temporada inicia em 10/04, conquiste medalhas de diamante e um ícone de perfil exclusivo!
<a href="LINK_DO_EVENTO" target="_blank">
</p>
<img src="URL_DO_ICONE_EVENTO" class="change-image">
<a href="LINK_DO_DISCORD" class="card-link" target="_blank">Veja mais</a>
</a>
</div>
</div>


<div class="changelog-card">
<div class="change-item">
<div class="card-header">
<div class="change-header">
<span class="card-date">09/04/2025 - Informativos</span>
<span class="change-title">INFORMATIVOS</span>
<span class="change-date">09/04/2025</span>
</div>
</div>
<h2 class="card-title">Ajustes Gerais</h2>
<hr>
<p class="card-desc">
<p class="change-text">Ranqueada, records e ajustes</p>
Saiba sobre a reta final da temporada de records, novas skins, e mudanças de poções de EXP.
<a href="LINK_DOS_INFORMATIVOS" target="_blank">
</p>
<img src="URL_DO_ICONE_INFORMATIVOS" class="change-image">
<a href="LINK_DO_DISCORD" class="card-link" target="_blank">Leia mais</a>
</a>
</div>
</div>
</div>
</div>


<style>
<style>
.changelog-container {
.changelog-container {
display: grid;
display: flex;
grid-template-columns: repeat(2, 1fr);
flex-wrap: nowrap;
gap: 10px;
gap: 10px;
max-height: 500px;
overflow-x: auto;
overflow-y: auto;
padding: 10px;
margin: 0;
padding: 0;
box-sizing: border-box;
box-sizing: border-box;
}
}


@media (max-width: 600px) {
.change-item {
.changelog-container {
flex: 0 0 auto;
grid-template-columns: 1fr;
min-width: 300px;
max-height: none;
box-sizing: border-box;
}
}
}


.changelog-card {
.change-header {
background: #fff;
border: 1px solid #ddd;
border-radius: 6px;
padding: 12px;
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
display: flex;
display: flex;
flex-direction: column;
justify-content: space-between;
justify-content: flex-start;
align-items: center;
box-sizing: border-box;
}
}


.card-header {
.change-title {
margin-bottom: 4px;
font-size: 1.1em;
font-weight: bold;
color: #000;
}
}


.card-date {
.change-date {
font-size: 80%;
font-size: 0.9em;
color: #888;
color: #888;
}
}


.card-title {
.change-item hr {
font-size: 100%;
margin: 4px 0;
margin: 4px 0;
font-weight: bold;
border: none;
border-top: 1px solid #ccc;
}
 
.change-text {
font-size: 0.9em;
line-height: 1.4;
color: #333;
color: #333;
margin-bottom: 6px;
}
}


.card-desc {
.change-image {
font-size: 90%;
display: block;
color: #555;
width: 300px;
margin-bottom: 8px;
height: 90px;
/* truncar texto:
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
*/
}
}


.card-link {
@media (max-width: 600px) {
font-size: 90%;
.changelog-container {
color: #007bff;
display: grid;
text-decoration: none;
grid-template-columns: repeat(2, 1fr);
font-weight: bold;
gap: 10px;
overflow-x: visible;
padding: 10px;
}
 
.change-item {
min-width: auto;
}
}


.card-link:hover {
.change-image {
text-decoration: underline;
width: 100%;
height: auto;
}
}
}
</style>
</style>

Edição das 22h14min de 12 de abril de 2025

RANQUEADA 08/04/2025

Nova temporada disponível 10/04

<a href="LINK_DA_RANQUEADA" target="_blank"> <img src="URL_DO_ICONE" class="change-image"> </a>

EVENTO TEMPORÁRIO 09/04/2025

Fist of Love: de 11 a 24 de abril

<a href="LINK_DO_EVENTO" target="_blank"> <img src="URL_DO_ICONE_EVENTO" class="change-image"> </a>

INFORMATIVOS 09/04/2025

Ranqueada, records e ajustes

<a href="LINK_DOS_INFORMATIVOS" target="_blank"> <img src="URL_DO_ICONE_INFORMATIVOS" class="change-image"> </a>

<style> .changelog-container { display: flex; flex-wrap: nowrap; gap: 10px; overflow-x: auto; padding: 10px; box-sizing: border-box; }

.change-item { flex: 0 0 auto; min-width: 300px; box-sizing: border-box; }

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

.change-title { font-size: 1.1em; font-weight: bold; color: #000; }

.change-date { font-size: 0.9em; color: #888; }

.change-item hr { margin: 4px 0; border: none; border-top: 1px solid #ccc; }

.change-text { font-size: 0.9em; line-height: 1.4; color: #333; margin-bottom: 6px; }

.change-image { display: block; width: 300px; height: 90px; }

@media (max-width: 600px) { .changelog-container { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; overflow-x: visible; padding: 10px; }

.change-item { min-width: auto; }

.change-image { width: 100%; height: auto; } } </style>

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