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="tibia-events-widget">
<div class="change-widget">
  <!-- Evento 1 -->
<ul>
  <div class="event-item">
<li class="change-item">
    <div class="event-title">
<a href="https://discord.com/channels/ID_GALERIA" target="_blank">
      <span class="event-name">Chyllfroest</span>
<img src="https://wiki.gla.com.br/images/16x16/galeria_icon.png" alt="">
      <span class="event-icon">&#9679;</span> <!-- Ícone/bullet, ajuste se quiser outra forma -->
<span class="change-title">Galeria</span>
    </div>
<span class="change-date">04/26/2023</span>
    <div class="event-desc">
</a>
      Uma ponte de gelo agora conecta Svargrond a uma ilha gelada, onde monstros
</li>
      e uma estranha criatura congelada foram avistados.
<li class="change-item">
    </div>
<a href="https://discord.com/channels/ID_INFORMATIVOS" target="_blank">
    <div class="event-more">
<img src="https://wiki.gla.com.br/images/16x16/informativos_icon.png" alt="">
      <a href="/wiki/Chyllfroest">Saiba mais &#x2794;</a>
<span class="change-title">Informativos</span>
    </div>
<span class="change-date">04/26/2023</span>
  </div>
</a>
 
</li>
  <!-- Evento 2 -->
<li class="change-item">
  <div class="event-item">
<a href="https://discord.com/channels/ID_BALANCEAMENTO" target="_blank">
    <div class="event-title">
<img src="https://wiki.gla.com.br/images/16x16/balanceamento_icon.png" alt="">
      <span class="event-name">Prank Month</span>
<span class="change-title">Balanceamento</span>
      <span class="event-icon">&#9679;</span>
<span class="change-date">04/26/2023</span>
    </div>
</a>
    <div class="event-desc">
</li>
      Desfrute de um mês inteiro de pegadinhas! A Hoaxette está oferecendo feitiços,
</ul>
      travessuras e presentes especiais que têm alguns efeitos engraçados.  
      Um conselho final: sempre trate bem os palhaços...
    </div>
    <div class="event-more">
      <a href="/wiki/Prank_Month">Saiba mais &#x2794;</a>
    </div>
  </div>
</div>
</div>


<style>
<style>
.tibia-events-widget {
.change-widget {
  font-family: sans-serif;
font-family: sans-serif;
  margin: 10px 0;
margin: 0;
padding: 0;
}
}


/* Cada evento */
.change-widget ul {
.event-item {
list-style: none;
  padding: 5px 0;
margin: 0;
  border-bottom: 1px solid #ccc;
padding: 0;
}
}


/* Último evento sem borda */
.change-item {
.event-item:last-child {
display: flex;
  border-bottom: none;
align-items: center;
border-bottom: 1px solid #eee;
padding: 10px 0;
}
}


/* Título do evento (Chyllfroest, Prank Month, etc.) */
.change-item:last-child {
.event-title {
border-bottom: none;
  font-size: 120%;
  font-weight: bold;
  color: #000;
  margin-bottom: 4px;
  vertical-align: -5px; /* Ajuste para alinhar com o estilo TibiaWiki */
}
}


/* Ícone/bullet após o título */
.change-item a {
.event-icon {
display: flex;
  color: #000;
align-items: center;
  margin-left: 4px;
width: 100%;
  font-weight: normal;
text-decoration: none;
color: inherit;
}
}


/* Descrição do evento */
.change-widget img {
.event-desc {
width: 16px;
  margin-bottom: 4px;
height: 16px;
  line-height: 1.4;
margin-right: 10px;
}
}


/* Link "Saiba mais" */
.change-title {
.event-more a {
font-size: 1.1em;
  font-weight: bold;
font-weight: bold;
  color: #0645AD;
  text-decoration: none;
}
}


.event-more a:hover {
.change-date {
  text-decoration: underline;
margin-left: auto;
font-size: 0.9em;
color: #888;
}
}
</style>
</style>

Edição das 18h04min de 3 de abril de 2025

<style> .change-widget { font-family: sans-serif; margin: 0; padding: 0; }

.change-widget ul { list-style: none; margin: 0; padding: 0; }

.change-item { display: flex; align-items: center; border-bottom: 1px solid #eee; padding: 10px 0; }

.change-item:last-child { border-bottom: none; }

.change-item a { display: flex; align-items: center; width: 100%; text-decoration: none; color: inherit; }

.change-widget img { width: 16px; height: 16px; margin-right: 10px; }

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

.change-date { margin-left: auto; font-size: 0.9em; color: #888; } </style>