Files
gureametsabilagun/wp-content/themes/gure-ametsa/inc/dynamic-css.php
Josep Piguillem 0b2c9f271f Web de Gure Ametsa Bi Lagun en WordPress para Dokploy
- Docker Compose (WordPress + MariaDB) listo para Dokploy, con instalación
  automática por etapas: idiomas, páginas, menús y plugins recomendados.
- Web bilingüe castellano / euskera con Polylang.
- Tema propio «gure-ametsa»: diseño inspirado en Beargrass Animal Rescue,
  personalizable desde Apariencia → Personalizar (paletas, tipografías,
  secciones de portada ordenables) y patrones de bloques propios.
- Plugin mu «gure-ametsa-core»: animales en adopción con ficha y filtros,
  carrusel y formulario de contacto/adopción.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
2026-09-24 16:21:26 +02:00

106 lines
3.7 KiB
PHP

<?php
/**
* CSS generado a partir del personalizador: colores, tipografías, tamaños.
*/
defined( 'ABSPATH' ) || exit;
/** Luminancia relativa (WCAG) de un color hexadecimal. */
function ga_luminance( $hex ) {
$hex = ltrim( (string) $hex, '#' );
if ( 3 === strlen( $hex ) ) {
$hex = $hex[0] . $hex[0] . $hex[1] . $hex[1] . $hex[2] . $hex[2];
}
if ( 6 !== strlen( $hex ) ) {
return 1;
}
$channels = array_map( function ( $c ) {
$c = hexdec( $c ) / 255;
return $c <= 0.03928 ? $c / 12.92 : ( ( $c + 0.055 ) / 1.055 ) ** 2.4;
}, str_split( $hex, 2 ) );
return 0.2126 * $channels[0] + 0.7152 * $channels[1] + 0.0722 * $channels[2];
}
/** Texto legible (blanco o el color de texto) sobre un fondo dado. */
function ga_readable_on( $background ) {
$ink = ga_color( 'text' );
$lum = ga_luminance( $background );
$contrast_white = 1.05 / ( $lum + 0.05 );
$contrast_ink = ( $lum + 0.05 ) / ( ga_luminance( $ink ) + 0.05 );
return $contrast_white >= $contrast_ink ? '#ffffff' : $ink;
}
function ga_dynamic_css() {
$fonts = ga_fonts();
$heading = $fonts[ ga_opt( 'typography', 'heading_font' ) ] ?? $fonts['fraunces'];
$body = $fonts[ ga_opt( 'typography', 'body_font' ) ] ?? $fonts['karla'];
$css = '';
foreach ( array_unique( array_filter( array( $heading['file'] ?? '', $body['file'] ?? '' ) ) ) as $file ) {
$font = current( wp_list_filter( $fonts, array( 'file' => $file ) ) );
$css .= sprintf(
'@font-face{font-family:"%s";src:url("%s") format("woff2");font-weight:100 900;font-style:normal;font-display:swap;}',
$font['family'],
esc_url( get_theme_file_uri( "assets/fonts/$file.woff2" ) )
);
}
$accent = ga_color( 'accent' );
$primary = ga_color( 'primary' );
$vars = array(
'--ga-green' => $primary,
'--ga-red' => $accent,
'--ga-cream' => ga_color( 'background' ),
'--ga-sand' => ga_color( 'surface' ),
'--ga-ink' => ga_color( 'text' ),
'--ga-on-red' => ga_readable_on( $accent ),
'--ga-on-primary' => ga_readable_on( $primary ),
'--ga-serif' => $heading['stack'],
'--ga-sans' => $body['stack'],
'--ga-heading-weight' => (int) ga_opt( 'typography', 'heading_weight' ),
'--ga-radius' => (int) ga_opt( 'typography', 'radius' ) . 'px',
'--ga-size' => (int) ga_opt( 'typography', 'base_size' ) . 'px',
);
$css .= ':root{';
foreach ( $vars as $name => $value ) {
if ( '' !== $value && null !== $value ) {
$css .= $name . ':' . wp_strip_all_tags( (string) $value ) . ';';
}
}
$css .= '}';
return $css;
}
add_action( 'wp_enqueue_scripts', function () {
wp_add_inline_style( 'gure-ametsa', ga_dynamic_css() );
}, 20 );
/* El editor de bloques usa los mismos colores y tipografías. */
add_filter( 'block_editor_settings_all', function ( $settings ) {
$settings['styles'][] = array( 'css' => ga_dynamic_css() );
return $settings;
} );
/* Paleta del editor = colores del tema. */
add_action( 'after_setup_theme', function () {
add_theme_support( 'editor-color-palette', array(
array( 'name' => 'Principal', 'slug' => 'ga-green', 'color' => ga_color( 'primary' ) ),
array( 'name' => 'Acento', 'slug' => 'ga-red', 'color' => ga_color( 'accent' ) ),
array( 'name' => 'Secciones', 'slug' => 'ga-sand', 'color' => ga_color( 'surface' ) ),
array( 'name' => 'Texto', 'slug' => 'ga-ink', 'color' => ga_color( 'text' ) ),
array( 'name' => 'Blanco', 'slug' => 'white', 'color' => '#ffffff' ),
) );
}, 20 );
/* Clases en <body> según opciones de cabecera. */
add_filter( 'body_class', function ( $classes ) {
if ( ga_opt( 'header', 'sticky' ) ) {
$classes[] = 'ga-sticky-header';
}
if ( ga_opt( 'header', 'highlight_first' ) ) {
$classes[] = 'ga-nav-highlight';
}
return $classes;
} );