Cards Boostrap

 

<div class="ps-3">
	<div class="mb-3 bg-white position-relative shadow " style="border-radius: 13px;height:460px">
		<a href="{{ url }}">
			<div class="position-relative">
				<img src="{{ file_url(node.field_noticia_imagen.entity.field_media_image.entity.fileuri) }}" class="img-fluid w-100" style="height: 250px; object-fit: cover; border-radius: 13px 13px 0px 0px" alt="{{content.field_noticia_imagen[0]['#media'].field_media_image.alt}}"/>
				<div class="position-absolute bottom-0 start-0">
					<div class="card-body">
						<span class="badge rounded-pill bg-dark shadow-lg text-white">{{content.field_noticia_etiqueta.0['#title']}}</span>
					</div>
				</div>
			</div>
		</a>
		<div class="p-4">
			<a href="{{ url }}" class=" text-dark text-decoration-none">
				<h6 class="card-title fw-bold">
					{% set text = label|render|striptags %}
					{{ text|length > 60 ? text|slice(0, 60) ~ '...' : text }}
				</h6>
			</a>
			<p class="small">
				{% set text = content.field_noticia_cuerpo|render|striptags %}
				{{ text|length > 100 ? text|slice(0, 100) ~ '...' : text }}
			</p>
			<div class="small text-secondary position-absolute bottom-0 pb-3">
				<i class="bi bi-clock" width="32" height="32"></i>
				{{ node.getCreatedTime|format_date('fecha_noticias') }}
			</div>
		</div>
	</div>
</div>

<div class="ps-3">
	<div class="mb-3 bg-white position-relative shadow " style="border-radius: 13px;height:460px">
		<a href="{{ url }}">
			<div class="position-relative">
				<img src="{{ file_url(node.field_noticia_imagen.entity.field_media_image.entity.fileuri) }}" class="img-fluid w-100" style="height: 250px; object-fit: cover; border-radius: 13px 13px 0px 0px" alt="{{content.field_noticia_imagen[0]['#media'].field_media_image.alt}}"/>
				<div class="position-absolute bottom-0 start-0">
					<div class="card-body">
						<span class="badge rounded-pill bg-dark shadow-lg text-white">{{content.field_noticia_etiqueta.0['#title']}}</span>
					</div>
				</div>
			</div>
		</a>
		<div class="p-4">
			<a href="{{ url }}" class=" text-dark text-decoration-none">
				<h6 class="card-title fw-bold">
					{% set text = label|render|striptags %}
					{{ text|length > 60 ? text|slice(0, 60) ~ '...' : text }}
				</h6>
			</a>
			<p class="small">
				{% set text = content.field_noticia_cuerpo|render|striptags %}
				{{ text|length > 100 ? text|slice(0, 100) ~ '...' : text }}
			</p>
			<div class="small text-secondary position-absolute bottom-0 pb-3">
				<i class="bi bi-clock" width="32" height="32"></i>
				{{ node.getCreatedTime|format_date('fecha_noticias') }}
			</div>
		</div>
	</div>
</div>