Mudanças entre as edições de "Widget:Teste2"
Linha 1: | Linha 1: | ||
<div class="notice-item"> | <div class="notice-item"> | ||
<div class="notice-content"> | <div class="notice-content"> | ||
<a href=" | <a href="LINK_DA_PAGINA" class="notice-title">Informativos</a> | ||
<div class="notice-date">21.04.2025</div> | <div class="notice-date">21.04.2025</div> | ||
<p class="notice-desc"> | <p class="notice-desc">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p> | ||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. | |||
</p> | |||
</div> | </div> | ||
<img src="URL_DO_ICONE" class="notice-icon"> | <img src="URL_DO_ICONE" class="notice-icon"> | ||
Linha 12: | Linha 10: | ||
<div class="notice-item"> | <div class="notice-item"> | ||
<div class="notice-content"> | <div class="notice-content"> | ||
<a href=" | <a href="LINK_DA_PAGINA" class="notice-title">Informativos</a> | ||
<div class="notice-date">21.04.2025</div> | <div class="notice-date">21.04.2025</div> | ||
<p class="notice-desc"> | <p class="notice-desc">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p> | ||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. | |||
</p> | |||
</div> | </div> | ||
<img src="URL_DO_ICONE" class="notice-icon"> | <img src="URL_DO_ICONE" class="notice-icon"> | ||
Linha 23: | Linha 19: | ||
<div class="notice-item"> | <div class="notice-item"> | ||
<div class="notice-content"> | <div class="notice-content"> | ||
<a href=" | <a href="LINK_DA_PAGINA" class="notice-title">Informativos</a> | ||
<div class="notice-date">21.04.2025</div> | <div class="notice-date">21.04.2025</div> | ||
<p class="notice-desc"> | <p class="notice-desc">Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p> | ||
Lorem ipsum dolor sit amet, consectetur adipiscing elit. | |||
</p> | |||
</div> | </div> | ||
<img src="URL_DO_ICONE" class="notice-icon"> | <img src="URL_DO_ICONE" class="notice-icon"> | ||
Linha 35: | Linha 29: | ||
.notice-item { | .notice-item { | ||
display: flex; | display: flex; | ||
align-items: | align-items: flex-start; | ||
border | background: #fff; | ||
border: 1px solid #ddd; | |||
border-radius: 6px; | |||
margin-bottom: 10px; | margin-bottom: 10px; | ||
padding: 8px 10px; | |||
box-sizing: border-box; | box-sizing: border-box; | ||
border-left: 5px solid #f5b700; | |||
} | } | ||
.notice-content { | .notice-content { | ||
flex: 1; | flex: 1; | ||
margin-right: | margin-right: 10px; | ||
} | } | ||
.notice-title { | .notice-title { | ||
display: block; | |||
font-size: 1em; | font-size: 1em; | ||
font-weight: bold; | font-weight: bold; | ||
color: #333; | color: #333; | ||
text-decoration: none; | text-decoration: none; | ||
margin: 0; | margin: 0; | ||
} | } | ||
Linha 76: | Linha 73: | ||
width: 32px; | width: 32px; | ||
height: 32px; | height: 32px; | ||
object-fit: contain; | |||
flex-shrink: 0; | flex-shrink: 0; | ||
} | } | ||
</style> | </style> |
Edição das 06h35min de 13 de abril de 2025
<a href="LINK_DA_PAGINA" class="notice-title">Informativos</a>
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
<img src="URL_DO_ICONE" class="notice-icon">
<a href="LINK_DA_PAGINA" class="notice-title">Informativos</a>
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
<img src="URL_DO_ICONE" class="notice-icon">
<a href="LINK_DA_PAGINA" class="notice-title">Informativos</a>
Lorem ipsum dolor sit amet, consectetur adipiscing elit.
<img src="URL_DO_ICONE" class="notice-icon">
<style> .notice-item { display: flex; align-items: flex-start; background: #fff; border: 1px solid #ddd; border-radius: 6px; margin-bottom: 10px; padding: 8px 10px; box-sizing: border-box; border-left: 5px solid #f5b700; }
.notice-content { flex: 1; margin-right: 10px; }
.notice-title { display: block; font-size: 1em; font-weight: bold; color: #333; text-decoration: none; margin: 0; }
.notice-title:hover { text-decoration: underline; }
.notice-date { font-size: 0.9em; color: #888; margin: 4px 0; }
.notice-desc { font-size: 0.9em; color: #555; line-height: 1.3; margin: 0; }
.notice-icon { width: 32px; height: 32px; object-fit: contain; flex-shrink: 0; } </style>