Mudanças entre as edições de "Widget:Changelog"
Linha 1: | Linha 1: | ||
<div class="changelog-container"> | <div class="changelog-container"> | ||
<!-- Item 1 --> | |||
<div class="change-item"> | <div class="change-item"> | ||
<div class="change-header"> | <div class="change-header"> | ||
Linha 12: | Linha 13: | ||
</div> | </div> | ||
<!-- Item 2 --> | |||
<div class="change-item"> | <div class="change-item"> | ||
<div class="change-header"> | <div class="change-header"> | ||
Linha 24: | Linha 26: | ||
</div> | </div> | ||
<!-- Item 3 --> | |||
<div class="change-item"> | <div class="change-item"> | ||
<div class="change-header"> | <div class="change-header"> | ||
Linha 39: | Linha 42: | ||
<style> | <style> | ||
.changelog-container { | .changelog-container { | ||
display: | display: grid; | ||
grid-template-columns: repeat(2, 1fr); | |||
gap: 10px; | gap: 10px; | ||
padding: 0; | |||
margin: 0; | |||
box-sizing: border-box; | box-sizing: border-box; | ||
} | } | ||
.change-item { | .change-item { | ||
border: 1px solid #ddd; | |||
border-radius: 4px; | |||
padding: 8px; | |||
box-sizing: border-box; | box-sizing: border-box; | ||
} | } | ||
Linha 89: | Linha 93: | ||
} | } | ||
@media ( | @media (min-width: 600px) { | ||
.changelog-container { | .changelog-container { | ||
display: | display: flex; | ||
flex-wrap: nowrap; | |||
overflow-x: auto; | |||
overflow-x: | max-height: 300px; | ||
} | } | ||
.change-item { | .change-item { | ||
min-width: | min-width: 280px; | ||
margin: 0 0 0 0; | |||
} | } | ||
Edição das 22h29min 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: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; padding: 0; margin: 0; box-sizing: border-box; }
.change-item { border: 1px solid #ddd; border-radius: 4px; padding: 8px; 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 (min-width: 600px) { .changelog-container { display: flex; flex-wrap: nowrap; overflow-x: auto; max-height: 300px; }
.change-item { min-width: 280px; margin: 0 0 0 0; }
.change-image { width: 100%; height: auto; } } </style>