<?php
get_header(); ?>

<div class="detalle-page">
    <?php if ( have_posts() ) :
        while( have_posts() ) : the_post();
        // var_dump();
        //$imagen_historias = get_field('imagen_historias');
        //$descripcion = get_field('descripcion_historia');
        //$url_imagen = $imagen_historias['url']; 
        $descripcion = get_post_meta($post->ID, 'descripcion_historia')[0];
        ?>
        <div class="hero-alexV hero-detalle" style="background-image: url('<?= get_the_post_thumbnail_url() ?>');">
            <div class="overlay-hero"></div>
            <div class="info-detalle-hero">
                <h1 class="titulo-secundario"><?php the_title() ?></h1>
                <!-- <p class="descripcion-hero-detalle">Conferencia magistral</p> -->
            </div>
            <div class="borde-mas-info-detalle-hero">
                <div class="mas-info-detalle-hero">
                    <div class="contenedor-faro">
                        <div class="icono-faro"></div>
                        <div class="descripcion-mas-info"><?php echo $descripcion; ?></div>
                    </div>
                    <div class="contenedor-bandera">
                        <div class="icono-bandera"></div>
                        <div class="categorias-mas-info"><?php the_tags( $before = '', $sep = ', ') ?></div>
                    </div>
                </div>
            </div>
        </div>
        <div class="cuerpo-detalle pd-190">
            <div class="a2a_kit a2a_kit_size_32 a2a_vertical_style">
                <a class="a2a_button_facebook icono-social">
                    <!-- <img src="../img/icono-facebook.png" alt="icono-facebook"> -->
                </a>
                <a class="a2a_button_twitter icono-social">
                    <!-- <img src="../img/icono-twitter.png" alt="icono twitter"> -->
                </a>
            </div>
            <div class="container">
                <div class="row">
                    <div class="col-md-8 col-sm-8 contenido-detalle">
                        <?php the_content(); ?>
                    </div>
                    <div class="col-md-4 col-sm-4 hidden-xs">
                        <ul class="menu-opciones-detalle">
                            <li><a href="<?php echo get_template_directory_uri(); ?>/AV-Press-Kit-Sitio.pdf" target="_blank"><img src="<?php echo get_template_directory_uri(); ?>/img/iocono-descarga.svg" alt="icono-descarga">Descargar press kit</a></li>
                            <li><a href="<?php echo home_url('contacto'); ?>"><img src="<?php echo get_template_directory_uri(); ?>/img/icono-teclado.svg" alt="icono teclado">Solicitar más informacion</a></li>
                            <li><a href="<?php echo home_url('historias'); ?>"><img src="<?php echo get_template_directory_uri(); ?>/img/icono-bocina.svg" alt="icono-bocina">Ver más historias</a></li>
                        </ul>

                        <!-- <div class="contenedor-newsletter">
                            <div class="icono-news-letter"></div>
                            <div class="contenedor-info-newsletter">
                                <div class="info-newsletter">
                                    <h1>Newsletter</h1>
                                    <p>Suscríbete por email y recibe actualizaciones</p>
                                </div>
                            </div>
                            <form class="formulario-newsletter-alexV form-inline">
                                <div class="form-group">
                                    <input id="input-correo" name="s" type="text" class="form-control" placeholder="Correo electrónico" required>
                                </div>
                                <button type="submit" class="btn-enviar-correo">Suscríbete</button>
                            </form>
                        </div> -->
                    </div>
                    <div class="col-md-12 col-sm-12 text-center contenedor-btn">
                        <a href="<?php echo home_url('contacto'); ?>" class="btn-gradiante">Contactar a alex villareal</a>
                    </div>
                    <div class="col-md-4 col-sm-4 visible-xs">
                        <ul class="menu-opciones-detalle">
                            <li><a href="<?php echo get_template_directory_uri(); ?>/AV-Press-Kit-Sitio.pdf" target="_blank"><img src="<?php echo get_template_directory_uri(); ?>/img/iocono-descarga.svg" alt="icono-descarga">Descargar press kit</a></li>
                            <li><a href="<?php echo home_url('contacto'); ?>"><img src="<?php echo get_template_directory_uri(); ?>/img/icono-teclado.svg" alt="icono teclado">Solicitar más informacion</a></li>
                            <li><a href="<?php echo home_url('historias'); ?>"><img src="<?php echo get_template_directory_uri(); ?>/img/icono-bocina.svg" alt="icono-bocina">Ver más historias</a></li>
                        </ul>

                        <!-- <div class="contenedor-newsletter">
                            <div class="icono-news-letter"></div>
                            <div class="contenedor-info-newsletter">
                                <div class="info-newsletter">
                                    <h1>Newsletter</h1>
                                    <p>Suscríbete por email y recibe actualizaciones</p>
                                </div>
                            </div>
                            <form class="formulario-newsletter-alexV form-inline">
                                <div class="form-group">
                                    <input id="input-correo" name="s" type="text" class="form-control" placeholder="Correo electrónico" required>
                                </div>
                                <button type="submit" class="btn-enviar-correo">Suscíbeme</button>
                            </form>
                        </div> -->
                    </div>
                </div>
            </div>
        </div>
        <?php endwhile;
    endif; ?>
</div>

<a href="#0" class="btn-top"></a>

<div class="contenedor-frase-footer">
    <div class="texto-footer">
        <div class="container">
            <div class="col-md-12 col-sm-12 text-center">
                <img class="icono-frase-footer" src="<?php echo get_template_directory_uri(); ?>/img/icono-cimas.svg" alt="">
                <p class="frase-texto-part-1">"Los obstáculos<br>nos transforman y fortalecen</p>
                <p class="frase-texto-part-2">En el camino a la cima".</p>
                <span class="autor-alexV">Alex Villarreal</span>
            </div>
        </div>
    </div>
</div>

<?php get_footer(); ?>