@extends('layouts.app')

@push('css')
    <link
            rel="stylesheet"
            href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css"
    />
@endpush

@section('content')

    <div id="collection">
        <div class="jumbotron jumbotron-fluid bg-cover p-0" style="
                background-image: url({{ asset('img/collection/COVER.jpg')}}) !important;">
        </div>
        <div class="container-fluid p-0">
            <div class="container p-0">
                <h1 class="py-3 title-variant">COLECCIÓN RICARDO B. SALINAS PLIEGO</h1><br/>
            </div>
        </div>
        <div id="text" class="my-4">
            <div class="container-fluid p-0">
                <div class="container p-4">
                    <hr class="top">

                    <div class="tlt-wrapper">
                        <p class="tlt" style="color:#fff !important;
                        text-align:center !important;"> Las colecciones de Ricardo B. Salinas constituyen un legado inestimable, por el alto valor artístico e histórico de las obras que las componen </p>
                    </div>
                    <hr class="bottom">
                </div>
            </div>
        </div>
        <div class="container-fluid p-0">
            <div class="container p-0">
                <div id="collection-box" class="d-flex flex-row my-6">
                    <div class="col-6 bg-image p-0">
                        <div class="square-img ratio-1-1 box-shadow"
                             style="background-image: url({{ asset("/img/collection/imagen.jpg") }})"></div>
                    </div>
                    <div class="col-6 bg-light">
                        <div class="container-fluid content p-0 pb-6 pt-2">
                            <h1 class="mr-6 pb-1 title-variant">Archivos Fotográficos</h1><br/>

                            <span id="collection-info" class="info"> Los archivos fotográficos se centran principalmente en
                            fotografía mexicana, imágenes tomadas por mexicanos y extranjeros desde mediados del siglo
                            XIX hasta fines del siglo XX. En su mayoría, nos presentan una mirada hacia tiempos pasados
                            de nuestro país, y nos invitan a reflexionar acerca de la historia, la arquitectura, la
                            cultura, las costumbres y los códigos de las generaciones anteriores a nuestra época.

                            Integrando una gran diversidad de técnicas fotográficas esta colección nos permite estudiar
                            la evolución del medio y como ha sido utilizado en la historia de nuestro país.
                            <br>
                        </span>
                        </div>
                    </div>

                </div>

                <div class="row my-6">
                    <div class="container">
                        <h1 class="mr-6 pb-1 title-variant">Acervos</h1><br/>

                        <div class="my-carousel">
                            <div class="mycell px-2">
                                <div class="card border-0">
                                    <a href="{{ url('la-coleccion/guillermo-kahlo') }}">
                                        <img class="card-img-top" src="{{ asset("/img/collection/0.jpg")}}"
                                             alt="Card image cap">
                                    </a>
                                    <div class="pt-2">
                                        <a href="{{ url('la-coleccion/guillermo-kahlo') }}">
                                            <h3 class="slick-title">Guillermo Kahlo</h3>
                                        </a>
                                        <p class="slick-subtitle">Arquitectura mexicana (1905-1927)</p>
                                    </div>
                                </div>
                            </div>
                            <div class="mycell px-2">
                                <div class="card border-0">
                                    <a href="{{ url('la-coleccion/henry-greenwood-peabody') }}">
                                        <img class="card-img-top" src="{{asset("/img/collection/1.jpg")}}"
                                             alt="Card image cap">
                                    </a>
                                    <div class="pt-2">
                                        <a href="{{ url('la-coleccion/henry-greenwood-peabody') }}">
                                            <h3 class="slick-title">Henry Greenwood Peabody</h3>
                                        </a>
                                        <p class="slick-subtitle">Arquitectura Mexicana (ca. 1898)</p>
                                    </div>
                                </div>
                            </div>
                            <div class="mycell px-2">
                                <div class="card border-0">
                                    <a href="{{ url('la-coleccion/desire-charnay') }}">
                                        <img class="card-img-top" src="{{asset("/img/collection/2.jpg")}}"
                                             alt="Card image cap">
                                    </a>
                                    <div class="pt-2">
                                        <a href="{{ url('la-coleccion/desire-charnay') }}">
                                            <h3 class="slick-title">Désiré Charnay </h3>
                                        </a>
                                        <p class="slick-subtitle">Arquitectura y arqueología maya (1860-1882) </p>
                                    </div>
                                </div>
                            </div>
                            <div class="mycell px-2">
                                <div class="card border-0">
                                    <a href="{{ url('la-coleccion/teoberto-maler') }}">
                                        <img class="card-img-top" src="{{asset("/img/collection/tres.jpg")}}"
                                             alt="Card image cap">
                                    </a>
                                    <div class="pt-2">
                                        <a href="{{ url('la-coleccion/teoberto-maler') }}">
                                            <h3 class="slick-title">Teoberto Maler</h3>
                                        </a>
                                        <p class="slick-subtitle">Arquitectura y arqueología maya (finales del s.
                                            XIX)</p>
                                    </div>
                                </div>
                            </div>
                            {{--<div class="mycell px-2">
                                <div class="card border-0">
                                    <img class="card-img-top" src="{{asset("/img/collection/4.jpg")}}"
                                         alt="Card image cap">
                                    <div class="pt-2">
                                        <h3 class="slick-title">Tipos populares mexicanos</h3>
                                    </div>
                                </div>
                            </div>--}}
                            <div class="mycell px-2">
                                <div class="card border-0">
                                    <a href="{{ url('la-coleccion/tarjetas-de-visita') }}">
                                        <img class="card-img-top" src="{{asset("/img/collection/visita/visita1.jpg")}}"
                                             alt="Card image cap">
                                    </a>
                                    <div class="pt-2">
                                        <a href="{{ url('la-coleccion/tarjetas-de-visita') }}">
                                            <h3 class="slick-title">Tarjetas de visita</h3>
                                        </a>
                                    </div>
                                </div>
                            </div>
                            <div class="mycell px-2">
                                <div class="card border-0">
                                    <a href="{{ url('la-coleccion/fotografia-estereoscopica') }}">
                                        <img class="card-img-top" src="{{asset("/img/collection/seis.jpg")}}"
                                             alt="Card image cap">
                                    </a>

                                    <div class="pt-2">
                                        <a href="{{ url('la-coleccion/fotografia-estereoscopica') }}">
                                            <h3 class="slick-title">Fotografía estereoscópica </h3>
                                        </a>
                                        <p class="slick-subtitle">Vistas de México, paisajes (finales del siglo XIX y
                                            principios del XX)</p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <div id="collection-box" class="d-flex flex-row my-6">
                    <div class="col-6 bg-image p-0">
                        <div class="square-img ratio-1-1 box-shadow"
                             style="background-image: url( {{asset("/img/collection/plata.jpg") }})"></div>
                    </div>
                    <div class="col-6 bg-light">
                        <div class="container-fluid content p-0 pb-2 pt-2">
                            <h1 class="mr-6 pb-1 title-variant">Colección Maestros de la Plata</h1>

                            <span id="maestros-plata-info" class="info">

                            Con el fin de impulsar y difundir la producción artesanal y el diseño mexicano en plata,
                            Grupo Salinas fundó el Premio Nacional de la Plata “Hugo Salinas Price”, que se llevó a cabo
                            en siete ocasiones entre 2002 y 2015, estimulando así la creatividad de los artesanos y
                            diseñadores de toda la República. En estos años se adquirieron 117 piezas que conforman la
                            parte central de esta colección.

                            Posteriormente, nos sumamos al programa Visión y Tradición, creado por Design Week México,
                            con el propósito de establecer un diálogo entre la producción tradicional y el diseño
                            contemporáneo, a través de la colaboración entre diseñadores emergentes de México,
                            representantes de la comunidad creativa internacional y maestros plateros, integrando 21
                            piezas nuevas.

                        </span>
                            <a href="{{ url('la-coleccion/maestros-de-plata') }}">
                                <h2 class="seemore-acervos p-3 orange">Ver Colección</h2>
                            </a>
                        </div>
                    </div>

                </div>


                <div id="collection-box" class="d-flex flex-row my-6">
                    <div class="col-6 bg-image p-0">
                        <div class="square-img ratio-1-1 box-shadow"
                             style="background-image: url({{asset("/img/collection/anita_brenner.jpg")}})"></div>
                    </div>
                    <div class="col-6 bg-light">
                        <div class="container-fluid content p-0 pb-2 pt-2">
                            <h1 class="mr-6 pb-1 title-variant">Acervo Anita Brenner</h1>

                            <span id="anita-brenner-info" class="info">
                            Anita Brenner fue una de las promotoras más relevantes del arte mexicano en el extranjero
                            durante la segunda mitad del siglo XX. Periodista, antropóloga, editora y traductora,
                            estableció vínculos con los artistas más destacados de la época. Su labor fue determinante
                            en el proceso de consolidación de la identidad cultural y artística mexicana del siglo XX.

                            Este acervo es el más amplio que existe en México en torno a la periodista. Comprende
                            fotografías de Tina Modotti y Edward Weston, realizadas para el libro Ídolos tras los
                            altares; todo el material gráfico que ella y sus colaboradores reunieron para la edición de
                            la revista Mexico / this Month y, así como un considerable conjunto de objetos personales y
                            obras artísticas que pertenecieron a la propia Anita.
                        </span>
                            <a href="{{ url('la-coleccion/anita-brenner') }}">
                                <h2 class="seemore-acervos p-3 orange">Ver Acervo</h2>
                            </a>
                        </div>
                    </div>

                </div>

                <div id="collection-box" class="d-flex flex-row my-6">
                    <div class="col-6 bg-image p-0">
                        <div class="square-img ratio-1-1 box-shadow"
                             style="background-image: url({{asset("/img/collection/huichol.jpg") }})"></div>
                    </div>
                    <div class="col-6 bg-light">
                        <div class="container-fluid content p-0 pb-2 pt-2">
                            <h1 class="mr-6 pb-1 title-variant">Colección “Orgullo de mi país”</h1>

                            <span id="orgullo-info" class="info">
                            El proyecto que hoy conforma la colección “Orgullo de mi país”, consiste en realizar
                            comisiones a renombrados artesanos de la República para la creación de piezas inéditas que
                            incorporen la figura simbólica del corazón en sus diseños tradicionales. Actualmente, la
                            colección reúne más de 100 piezas representativas de las diversas técnicas y tradiciones
                            artesanales de diferentes regiones y comunidades culturales de México.

                            Durante siglos, las manos expertas han producido enseres para la vida cotidiana, para las
                            ceremonias religiosas y las fiestas cívicas de nuestro país. Actualmente, estas piezas han
                            cobrado valor a nivel nacional e internacional, y su manufactura es motivo de orgullo para
                            los mexicanos, pues en ellas reconocemos nuestra identidad.
                        </span>
                            <a href="{{ url('la-coleccion/orgullo-de-mi-pais') }}">
                                <h2 class="seemore-acervos p-3 orange">Ver Colección</h2>
                            </a>
                        </div>
                    </div>

                </div>

            </div>
        </div>

    </div>
@endsection

@push('js')
    <script>
        const text_collection = [
            'Valiosos acervos que configuran un rico mapa sobre aspectos fundamentales de la historia de México',
            'El coleccionismo nace del conocimiento, de la curiosidad y de interés, pero sobre todo de la pasión, pues es este el motor que impulsa a la búsqueda incansable de objetos.',
            'Ser coleccionista produce grandes emociones y satisfacciones, pero al mismo tiempo, implica un serio compromiso de salvaguarda y conservación de las piezas.',
            'Una colección está conformada por documentos que son una ventana abierta hacia nuestro pasado y nos ayudan a comprender mejor nuestro presente.',
            'Las colecciones de Ricardo B. Salinas constituyen un legado inestimable, por el alto valor artístico e histórico de las obras que las componen'
        ];
        let i = 0;

        function changePhrase() {
            $(".tlt").remove()
            $(".tlt-wrapper").html(`<p class="tlt" style="color:#fff !important;
                        text-align:center !important;">${text_collection[i]}</p>`)
            if (i === (text_collection.length -1)) {
                i = 0;
            } else {
                i++;
            }
            init();
        }

        function init() {
            $('.tlt').textillate({
                in: {
                    effect: 'animate__bounceIn',
                },
                out: {
                    effect: 'animate__fadeOut',
                    sync: true,
                },
                //loop: true,
                callback: changePhrase
            });
        }

        $(document).ready(function () {
            init();
        });


    </script>

@endpush