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

Add new functios pages & styles

Browse Source
This commit is contained in:
gustavo
2025-08-07 12:05:32 +00:00
parent 006e242de0
commit b172620cc4
4 changed files with 268 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
assets/scripts/site.js
View File

@ -1,5 +1,6 @@
// Modal vídeos
document.addEventListener('DOMContentLoaded', function() {
// modal videos
const videoModal = document.getElementById('videoModal');
const modalIframe = document.getElementById('modalVideoIframe');
const modalTitle = document.getElementById('videoModalLabel');

12
page.php
View File

@ -14,9 +14,17 @@ $context = Timber::context();
Timber::render( 'templates/page.twig', $context );*/
$context = Timber::context();
$timber_post = Timber::get_post();
$context['post'] = $timber_post;
//Timber::render( array( 'templates/page-' . $timber_post->post_name . '.twig', 'page.twig' ), $context );
Timber::render( array( 'templates/page-' . $timber_post->post_name . '.twig' ), $context );
// Verificar si es subpágina de contactos
$parent = get_post($timber_post->post_parent);
if ($parent && $parent->post_name === 'contactos') {
// Para subpáginas de contactos, usar page-contactos.twig
Timber::render('templates/page-contactos.twig', $context);
} else {
// Para el resto, usar la lógica original
Timber::render(array('templates/page-' . $timber_post->post_name . '.twig'), $context);
}

45
src/StarterSite.php
View File

@ -21,18 +21,18 @@ class StarterSite extends Site {
add_action( 'after_setup_theme', [ $this, 'theme_supports' ] );
add_action( 'init', [ $this, 'register_post_types' ] );
add_action( 'init', [ $this, 'register_taxonomies' ] );
add_action('wp_enqueue_scripts', [$this,'load_assets']);
add_filter( 'timber/context', [ $this, 'add_to_context' ] );
add_filter( 'timber/twig/filters', [ $this, 'add_filters_to_twig' ] );
add_filter( 'timber/twig/functions', [ $this, 'add_functions_to_twig' ] );
add_filter( 'timber/twig/environment/options', [ $this, 'update_twig_environment_options' ] );
add_filter('upload_mimes', [$this, 'add_svg_support']); //add svg files
add_filter('timber/context', [$this, 'add_global_context']); // variables globales
add_filter('timber/twig', [$this, 'add_videos_embed_to_twig']); //videos embed
parent::__construct();
}
@ -518,10 +518,40 @@ class StarterSite extends Site {
return $subpaginas;
}
private function formContact() {
$form_test = do_shortcode('[contact-form-7 id="5ed613c" title="Formulario de contacto 1"]');
public function getContactoFields() {
$post = Timber::get_post();
$form_shortcode = get_field('etiqueta_formulario', $post->ID); // o el campo ACF donde esté el shortcode
return $form_test;
$contactsFields = [
'nombre' => get_field('nombre_contacto', $post->ID),
'direccion' => get_field('direccion', $post->ID),
'url_mapa' => get_field('url_mapa', $post->ID),
'forma_contacto' => get_field('forma_contacto', $post->ID),
'url_web' => get_field('url_web', $post->ID),
'url_facebook' => get_field('url_facebook', $post->ID),
'url_twitter' => get_field('url_twitter', $post->ID),
'form' => !empty($form_shortcode) ? do_shortcode($form_shortcode) : '',
];
return $contactsFields;
}
public function getAfiliateFields() {
$post = Timber::get_post();
$afiliateFields = [
'imagen_afiliate' => get_field('imagen_afiliate', $post->ID),
'enlace_boton_afiliate' => get_field('enlace_boton_afiliate', $post->ID),
'texto_boton' => get_field('texto_boton', $post->ID),
];
if (empty($afiliateFields['imagen_afiliate']) && empty($afiliateFields['enlace_boton_afiliate'])) {
return null;
}
return $afiliateFields;
}
//Global variables
@ -541,7 +571,8 @@ class StarterSite extends Site {
$context['enlaces'] = $this->getEnlaces();
$context['subpaginas_servicios_publicos'] = $this->getPaginasServiciosPublicos();
$context['subpaginas_servicios_privados'] = $this->getPaginasServiciosPrivados();
$context['form_test'] = $this->formContact();;
$context['contacto_info'] = $this->getContactoFields();
$context['afiliate_fields'] = $this->getAfiliateFields();
return $context;
}

226
style.css
View File

@ -6,7 +6,9 @@
:root {
--rojo-cnt: #dc2d30;
--color-secundario: #6C757D;
--rojo-cnt-dark: #9d1b1d;
--rojo-cnt-light: #d6453f;
--reset: #7b7b7b;
}
@font-face {
@ -17,6 +19,80 @@
font-display: swap;
}
/* Botón primario */
.btn-primary-cnt {
border-radius: 75px !important;
background-color: var(--rojo-cnt);
border: 2px solid var(--rojo-cnt);
color: white;
padding: 10px 20px;
font-size: 16px;
font-weight: 600;
cursor: pointer;
transition: all 0.3s ease;
margin-top: 10px;
}
/* Botón primario - hover */
.btn-primary-cnt:hover {
background-color: var(--rojo-cnt-dark);
border-color: var(--rojo-cnt-dark);
transform: translateY(-2px);
box-shadow: 0 4px 8px rgba(255, 0, 0, 0.25);
}
/* Botón primario - active */
.btn-primary-cnt:active {
transform: translateY(0);
box-shadow: 0 2px 4px rgba(255, 0, 0, 0.25);
}
button[type="reset"] {
background-color: var(--reset);
}
/* Botón secundario */
.btn-secondary-cnt {
border-radius: 10px !important;
background-color: var(--rojo-cnt-light);
border: 2px solid var(--rojo-cnt-light);
color: white;
padding: 10px;
font-size: 16px;
font-weight: 600;
cursor: pointer;
transition: all 0.3s ease;
margin-top: 10px;
}
/* Botón secundario - hover */
.btn-secondary-cnt:hover {
background-color: var(--rojo-cnt-light);
border-color: var(--rojo-cnt-light);
transform: translateY(-2px);
box-shadow: 0 4px 8px rgba(255, 0, 0, 0.25);
}
/* Botón secundario - active */
.btn-secondary-cnt:active {
transform: translateY(0);
box-shadow: 0 2px 4px rgba(255, 0, 0, 0.25);
}
/* Quitar el focus/active de todos los elementos del menú */
.nav-link:focus,
.nav-link:active,
.btn:focus,
.btn:active,
.dropdown-item:focus,
.dropdown-item:active {
outline: none !important;
box-shadow: none !important;
background-color: var(--rojo-cnt) !important;
color: white !important;
opacity: 0.5;
}
/* HEADER sindikatua */
.text-sindikatua {
font-family: 'Yaro', Arial, sans-serif;
@ -50,8 +126,7 @@
opacity: 1;
}
/* PORTADA -> CARDS RECENt POSTS NOTICIAS */
/* PORTADA -> CARDS recent posts 'noticias' */
.recent-posts .card-img-overlay {
top: auto !important; /* Anula el top: 0 por defecto de Bootstrap */
bottom: 0;
@ -126,8 +201,7 @@
}
/* PORTADA -> Titles */
.page-portada .sp-module-title::after,
.contacto-barakaldo .sp-module-title::after {
.sp-module-title::after{
background: var(--rojo-cnt);
content: "";
height: 1px;
@ -137,8 +211,7 @@
width: 150px;
}
.page-portada .sp-module-title::before,
.contacto-barakaldo .sp-module-title::before {
.sp-module-title::before{
background: var(--rojo-cnt);
content: "";
height: 1px;
@ -208,4 +281,141 @@
.enlaces button:active {
outline: none;
box-shadow: none;
}
}
/* FORM */
/* Contenedor principal del formulario */
.formulario-contacto {
display: flex;
justify-content: center;
align-items: center;
padding: 20px;
}
/* Formulario centrado */
.formulario-contacto .wpcf7-form {
width: 100%;
max-width: 500px; /* Ajusta según necesites */
margin: 0 auto;
}
/* Estilos para todos los inputs y textareas */
.formulario-contacto input[type="text"],
.formulario-contacto input[type="email"],
.formulario-contacto input[type="tel"],
.formulario-contacto input[type="url"],
.formulario-contacto input[type="number"],
.formulario-contacto textarea,
.formulario-contacto select {
border-radius: 25px !important; /* Bordes redondos */
border: 2px solid #e9ecef !important;
padding: 12px 20px !important;
font-size: 16px;
transition: all 0.3s ease;
box-shadow: none !important;
margin-bottom: 15px;
}
/* Efecto hover y focus en inputs */
.formulario-contacto input[type="text"]:focus,
.formulario-contacto input[type="email"]:focus,
.formulario-contacto input[type="tel"]:focus,
.formulario-contacto input[type="url"]:focus,
.formulario-contacto input[type="number"]:focus,
.formulario-contacto textarea:focus,
.formulario-contacto select:focus {
border-color: var(--rojo-cnt) !important;
box-shadow: 0 0 0 0.2rem rgba(255, 0, 0, 0.25) !important;
outline: none;
}
.formulario-contacto input {
width: 100% !important;
}
/* Estilo específico para textarea */
.formulario-contacto textarea {
resize: vertical;
min-height: 120px;
width: 100% !important;
}
/* Botón submit - ancho completo y redondeado */
.formulario-contacto input[type="submit"] {
width: 100% !important;
border-radius: 25px !important;
background-color: var(--rojo-cnt);
border: 2px solid var(--rojo-cnt);
color: white;
padding: 15px 30px;
font-size: 18px;
font-weight: 600;
cursor: pointer;
transition: all 0.3s ease;
margin-top: 10px;
}
/* Efectos hover del botón */
.formulario-contacto input[type="submit"]:hover {
background-color: var(--rojo-cnt-dark);
border-color: var(--rojo-cnt-dark);
transform: translateY(-2px);
box-shadow: 0 4px 8px rgba(255, 0, 0, 0.25);
}
/* Efectos active del botón */
.formulario-contacto input[type="submit"]:active {
transform: translateY(0);
box-shadow: 0 2px 4px rgba(255, 0, 0, 0.25);
}
/* Estilos para labels */
.formulario-contacto label {
font-weight: 500;
margin-bottom: 5px;
color: #495057;
display: block;
}
/* Mensajes de error de CF7 */
.formulario-contacto .wpcf7-not-valid-tip {
color: var(--rojo-cnt-dark);
font-size: 14px;
margin-top: 5px;
}
/* Mensaje de validación */
.formulario-contacto .wpcf7-validation-errors {
border: 1px solid var(--rojo-cnt-dark);
background: #f8d7da;
color: #721c24;
border-radius: 15px;
padding: 15px;
margin-bottom: 20px;
}
/* Mensaje de éxito */
.formulario-contacto .wpcf7-mail-sent-ok {
border: 1px solid #28a745;
background: #d4edda;
color: #155724;
border-radius: 15px;
padding: 15px;
margin-bottom: 20px;
}
/* Responsive - pantallas pequeñas */
@media (max-width: 768px) {
.formulario-contacto {
padding: 15px;
}
.formulario-contacto .wpcf7-form {
max-width: 100%;
}
.formulario-contacto input[type="submit"] {
font-size: 16px;
padding: 12px 25px;
}
}