Card Boostrap







 
{% if content.field_publicacion_categoria.0['#title'] == "Galeria" %}


<div class=" bg-dark text-white position-relative rounded-5 mb-3">
	<img  src="{{ file_url(content.field_publicacion_imagen[0]['#media'].field_media_image_2.entity.uri.value)}}" height="400" class="w-100 rounded-5" style="object-fit: cover; " alt="...">
	<div class="card-img-overlay  small " style="background: linear-gradient(to bottom, rgba(169,208,113,0),rgb(21, 21, 21)); position: absolute; bottom: 0; border-radius: 13px; ">
	 <div class="position-absolute bottom-0 p-3">

		{% if node.title.value %}
		<a href="{{url}}" class="text-decoration-none text-white">
			<h5 class="card-title">{{node.title.value}}</h5>
		</a>

	{% endif %}

<p class="card-text small">
	{% set text = content.field_publicacion_contenido|render|striptags %}
	{{ text|length > 100 ? text|slice(0, 100) ~ '...' : text }}
</p>
	 </div>
	</div>
  </div>


{% else %}


	<div class="card rounded-5">
		<img src="{{ file_url(content.field_publicacion_imagen[0]['#media'].field_media_image_2.entity.uri.value)}}" class="card-img-top rounded-top" alt="{{content.field_imagen[0]['#media'].field_media_image.alt}}">
		<div class="card-body">

			{% if node.title.value %}
				<a href="{{url}}">
					<h6 class="card-title text-dark fw-bold">{{node.title.value}}</h6>
				</a>

			{% endif %}


			<p class="card-text">
				{% set text = content.field_publicacion_contenido|render|striptags %}
				{{ text|length > 100 ? text|slice(0, 100) ~ '...' : text }}
			</p>
		</div>
	</div>

{% endif %}

Comentarios