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

De Wiki Gla
Ir para navegação Ir para pesquisar
m
m
 
(45 revisões intermediárias pelo mesmo usuário não estão sendo mostradas)
Linha 1: Linha 1:
<div class="news-card">
<div class="news-image-container">
<img src="URL_DA_IMAGEM" class="news-image">
</div>
<div class="news-info">
<div class="news-header">
<h2 class="news-title">Informativos</h2>
<span class="news-date">21.04.2025</span>
</div>
<p class="news-desc">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam nec turpis ut nunc fringilla elementum.
Donec sit amet dolor vitae diam imperdiet posuere ut id augue. Integer nec est sed dui lobortis
sollicitudin.
</p>
</div>
</div>
<div class="news-card">
<div class="news-image-container">
<img src="URL_DA_IMAGEM" class="news-image">
</div>
<div class="news-info">
<div class="news-header">
<h2 class="news-title">Informativos</h2>
<span class="news-date">21.04.2025</span>
</div>
<p class="news-desc">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam nec turpis ut nunc fringilla elementum.
Donec sit amet dolor vitae diam imperdiet posuere ut id augue. Integer nec est sed dui lobortis
sollicitudin.
</p>
</div>
</div>
<div class="news-card">
<div class="news-image-container">
<img src="URL_DA_IMAGEM" class="news-image">
</div>
<div class="news-info">
<div class="news-header">
<h2 class="news-title">Informativos</h2>
<span class="news-date">21.04.2025</span>
</div>
<p class="news-desc">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam nec turpis ut nunc fringilla elementum.
Donec sit amet dolor vitae diam imperdiet posuere ut id augue. Integer nec est sed dui lobortis
sollicitudin.
</p>
</div>
</div>
<style>
<style>
.news-card {
body::before {
width: 100%;
content: '';
border: 1px solid #ddd;
position: fixed;
border-radius: 6px;
top: 0;
margin-bottom: 16px;
left: 0;
overflow: hidden;
width: 100%;
background: #fff;
height: 100vh;
box-sizing: border-box;
background: url('https://wiki.gla.com.br/images/b/b3/Testefundo.png') no-repeat;
}
filter: brightness(0.6);
 
 
.news-image-container {
background-attachment: fixed;
width: 100%;
background-position: center;
height: 120px;
background-repeat: no-repeat;
overflow: hidden;
background-size: cover;
}
z-index: -1;
 
.news-image {
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
 
.news-info {
padding: 10px 14px;
}
 
.news-header {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 4px;
}
 
.news-title {
font-size: 1em;
font-weight: bold;
color: #333;
margin: 0;
}
 
.news-date {
font-size: 0.9em;
color: #888;
margin-left: 10px;
}
 
.news-desc {
font-size: 0.9em;
color: #555;
line-height: 1.4;
margin: 0;
}
}
</style>
</style>

Edição atual tal como às 23h19min de 29 de agosto de 2025

<style>

body::before {

content: ; position: fixed; top: 0; left: 0; width: 100%; height: 100vh; background: url('https://wiki.gla.com.br/images/b/b3/Testefundo.png') no-repeat; filter: brightness(0.6);

background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; z-index: -1; } </style>