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

De Wiki Gla
Ir para navegação Ir para pesquisar
Linha 1: Linha 1:
<div class="changelog-widget">
<div class="notices-box">
<div class="changelog-item">
<div class="notices-title">Notices</div>
<div class="changelog-info">
 
<a href="LINK_INFORMATIVOS" class="changelog-title">Informativos</a>
<div class="notices-list">
<div class="changelog-date">21.04.2025</div>
<div class="notice-item">
<p class="changelog-desc">
<div class="notice-content">
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
<div class="notice-header">CHANGELOG - 11.1</div>
</p>
<div class="notice-sub">Glawiki</div>
<div class="notice-date">08.11.2020</div>
</div>
<div class="notice-icon">
<img src="URL_DO_ICONE_1">
</div>
</div>
<img src="https://wiki.gla.com.br/images/f/f9/Special_awakening_stone.gif" class="changelog-icon">
</div>
</div>


<div class="changelog-item">
<div class="notice-item">
<div class="changelog-info">
<div class="notice-content">
<a href="LINK_RANQUEADA" class="changelog-title">Ranqueada</a>
<div class="notice-header">CHANGELOG - 11.2</div>
<div class="changelog-date">20.04.2025</div>
<div class="notice-sub">Glawiki</div>
<p class="changelog-desc">
<div class="notice-date">16.11.2020</div>
Nova temporada disponível a partir de 10/04 com medalhas exclusivas e ícones especiais.
</div>
</p>
<div class="notice-icon">
<img src="URL_DO_ICONE_2">
</div>
</div>
<img src="https://wiki.gla.com.br/images/f/f9/Special_awakening_stone.gif" class="changelog-icon">
</div>
</div>


<div class="changelog-item">
<div class="notice-item">
<div class="changelog-info">
<div class="notice-content">
<a href="LINK_EVENTO" class="changelog-title">Evento Temporário</a>
<div class="notice-header">CHANGELOG - 10.1</div>
<div class="changelog-date">19.04.2025</div>
<div class="notice-sub">Glawiki</div>
<p class="changelog-desc">
<div class="notice-date">27.10.2020</div>
Fist of Love: evento de 11 a 24 de abril para enfrentar um poderoso herói da Marinha.
</div>
</p>
<div class="notice-icon">
<img src="URL_DO_ICONE_3">
</div>
</div>
</div>
<img src="https://wiki.gla.com.br/images/f/f9/Special_awakening_stone.gif" class="changelog-icon">
 
</div>
</div>
</div>
</div>


<style>
<style>
.changelog-widget {
.notices-box {
width: 280px;
font-family: sans-serif;
font-family: sans-serif;
max-width: 600px;
background: #fff;
margin: 0 auto;
border-radius: 4px;
box-sizing: border-box;
border: 1px solid #ddd;
overflow: hidden;
}
 
.notices-title {
background: #f5f5f5;
color: #2c3e50;
font-size: 1.1em;
font-weight: bold;
padding: 8px 12px;
border-bottom: 1px solid #ddd;
}
 
.notices-list {
max-height: 400px;
overflow-y: auto;
padding: 8px;
box-sizing: border-box;
box-sizing: border-box;
}
}


.changelog-item {
.notice-item {
display: flex;
display: flex;
align-items: flex-start;
align-items: center;
justify-content: space-between;
position: relative;
padding: 10px 0;
background: #fff;
border-bottom: 1px solid #eee;
border-left: 5px solid #f5b700;
/* Barra colorida à esquerda */
border-radius: 4px;
margin-bottom: 10px;
padding: 8px;
box-sizing: border-box;
}
}


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


.changelog-info {
.notice-content {
display: flex;
flex-direction: column;
justify-content: center;
flex: 1;
flex: 1;
margin-right: 10px;
margin-right: 10px;
}
}


.changelog-title {
.notice-header {
display: block;
font-size: 1em;
font-size: 1.1em;
font-weight: bold;
font-weight: bold;
color: #333;
color: #333;
text-decoration: none;
margin: 0 0 2px 0;
margin: 0;
padding: 0;
}
}


.changelog-title:hover {
.notice-sub {
text-decoration: underline;
}
 
.changelog-date {
font-size: 0.9em;
font-size: 0.9em;
color: #888;
color: #666;
margin: 4px 0;
margin: 0 0 4px 0;
}
}


.changelog-desc {
.notice-date {
font-size: 0.85em;
color: #999;
margin: 0;
margin: 0;
font-size: 0.9em;
color: #555;
line-height: 1.4;
}
}


.changelog-icon {
.notice-icon img {
width: 32px;
width: 48px;
height: 32px;
height: 48px;
flex-shrink: 0;
object-fit: contain;
align-self: flex-start;
}
}
</style>
</style>

Edição das 04h39min de 13 de abril de 2025

Notices
CHANGELOG - 11.1
Glawiki
08.11.2020

<img src="URL_DO_ICONE_1">

CHANGELOG - 11.2
Glawiki
16.11.2020

<img src="URL_DO_ICONE_2">

CHANGELOG - 10.1
Glawiki
27.10.2020

<img src="URL_DO_ICONE_3">

<style> .notices-box { width: 280px; font-family: sans-serif; background: #fff; border-radius: 4px; box-sizing: border-box; border: 1px solid #ddd; overflow: hidden; }

.notices-title { background: #f5f5f5; color: #2c3e50; font-size: 1.1em; font-weight: bold; padding: 8px 12px; border-bottom: 1px solid #ddd; }

.notices-list { max-height: 400px; overflow-y: auto; padding: 8px; box-sizing: border-box; }

.notice-item { display: flex; align-items: center; position: relative; background: #fff; border-left: 5px solid #f5b700; /* Barra colorida à esquerda */ border-radius: 4px; margin-bottom: 10px; padding: 8px; box-sizing: border-box; }

.notice-item:last-of-type { margin-bottom: 0; }

.notice-content { display: flex; flex-direction: column; justify-content: center; flex: 1; margin-right: 10px; }

.notice-header { font-size: 1em; font-weight: bold; color: #333; margin: 0 0 2px 0; }

.notice-sub { font-size: 0.9em; color: #666; margin: 0 0 4px 0; }

.notice-date { font-size: 0.85em; color: #999; margin: 0; }

.notice-icon img { width: 48px; height: 48px; object-fit: contain; } </style>