Nexos/cnt-sindikatua
3
1
Fork 0
Code Issues 1 Pull Requests Actions Packages Projects 1 Releases Wiki Activity

ADD segundo idioma

Browse Source
This commit is contained in:
gustavo
2025-08-21 07:21:36 +00:00
parent 03e45ed783
commit 472bc00677
27 changed files with 386 additions and 363 deletions
Download Patch File Download Diff File Expand all files Collapse all files

98
views/templates/page-videos.twig
View File

@ -1,64 +1,61 @@
{% extends 'layouts/base.twig' %}
{% block content %}
<p class="mb-5 position-relative fs-4 fw-bold sp-module-title">VÍDEOS</p>
<h1 class="mb-5 position-relative fs-4 fw-bold sp-module-title">{{ post.title }}</h1>
<div class="container text-center">
<div class="row">
{% if videos %}
{% for video in videos %}
<div class="col-xl-3 col-lg-4 col-md-6 col-sm-12 mb-2">
<div class="video-item">
{% set url_video = video.meta('url_video') %}
{% set video_data = generar_embed(url_video) %}
{% if video_data %}
{% if videos %}
{% for video in videos %}
<div class="col-xl-3 col-lg-4 col-md-6 col-sm-12 mb-2">
<div class="video-item">
{% set url_video = video.meta('url_video') %}
{% set video_data = generar_embed(url_video) %}
{% if video_data %}
{# Thumbnail clickeable en lugar del iframe #}
<div class="ratio ratio-16x9 video-thumbnail-container position-relative rounded"
data-bs-toggle="modal"
data-bs-target="#videoModal"
data-video-url="{{ video_data.embed_url }}"
data-video-title="{{ video.titulo }}"
data-video-allow="{{ video_data.allow }}"
style="cursor: pointer;
background-image: url('{{ video_data.thumbnail_url }}');
background-size: cover;
background-position: center;">
{# Thumbnail clickeable en lugar del iframe #}
<div class="ratio ratio-16x9 video-thumbnail-container position-relative rounded"
data-bs-toggle="modal"
data-bs-target="#videoModal"
data-video-url="{{ video_data.embed_url }}"
data-video-title="{{ video.titulo }}"
data-video-allow="{{ video_data.allow }}"
style="cursor: pointer;
background-image: url('{{ video_data.thumbnail_url }}');
background-size: cover;
background-position: center;">
{# Overlay con botón play #}
<div class="position-absolute top-0 start-0 w-100 h-100 d-flex align-items-center justify-content-center">
<div class="btn btn-danger btn-lg rounded-circle d-flex align-items-center justify-content-center"
style="width: 60px; height: 60px;">
<i class="bi bi-play-btn" style="font-size: 2rem;"></i>
{# Overlay con botón play #}
<div class="position-absolute top-0 start-0 w-100 h-100 d-flex align-items-center justify-content-center">
<div class="btn btn-danger btn-lg rounded-circle d-flex align-items-center justify-content-center"
style="width: 60px; height: 60px;">
<i class="bi bi-play-btn" style="font-size: 2rem;"></i>
</div>
</div>
{# Overlay oscuro al hover #}
<div class="position-absolute top-0 start-0 w-100 h-100 bg-dark opacity-0 hover-overlay"
style="transition: opacity 0.3s ease;">
</div>
{# Título del vídeo #}
<div class="position-absolute bottom-0 start-0 end-0 bg-dark bg-opacity-75 text-white p-3 rounded">
<h6 class="mb-0 text-white">{{ video.titulo }}</h6>
</div>
</div>
{# Overlay oscuro al hover #}
<div class="position-absolute top-0 start-0 w-100 h-100 bg-dark opacity-0 hover-overlay"
style="transition: opacity 0.3s ease;">
</div>
{# Título del vídeo #}
<div class="position-absolute bottom-0 start-0 end-0 bg-dark bg-opacity-75 text-white p-3 rounded">
<h6 class="mb-0 text-white">{{ video.titulo }}</h6>
</div>
{% else %}
<div class="alert alert-warning">
<h5>{{ video.titulo }}</h5>
<p class="mb-0">No se ha configurado URL para este vídeo.</p>
</div>
{% endif %}
</div>
{% else %}
<div class="alert alert-warning">
<h5>{{ video.titulo }}</h5>
<p class="mb-0">No se ha configurado URL para este vídeo.</p>
</div>
{% endif %}
</div>
</div>
{% endfor %}
{% else %}
<p>No hay vídeos disponibles.</p>
{% endif %}
{% endfor %}
{% else %}
<p>No hay vídeos disponibles.</p>
{% endif %}
</div>
{# MODAL PARA REPRODUCIR VÍDEO #}
@ -87,5 +84,4 @@
</div>
{% endblock %}
{% endblock %}