Carrusel Principal

El carrusel se inicia con el atributo data-carousel en el elemento .uc-carousel, siendo el valor de data-carousel, la clase del elemento hijo donde irá el contenido.

Actualización (21/10/2022): Por motivos de SEO se ha reemplazado la propiedad css background-image por un tag <img /> con clase .carousel-img en todos los carruseles

Actualización (02/12/2022): Esta es una nueva sección que incluye el Carrusel principal y los nuevos Carrusel principal con card y Carrusel principal centrado. El componente Carrusel de cards se ha dejado en una sección independiente del Kit.

Carrusel de encabezado

Es el carrusel principal del sitio. Por lo tanto, debe usarse utilizarse solo una vez en el sitio, en la página de inicio, debajo del header. El estilo y comportamiento de este carrusel no debe ser modificado, pero sí se puede modificar el tipo de información que se incluye (por ejemplo, podría quitarse el Tag UC).

Las imagenes del carrusel principal estan con su punto focal a la derecha, pero este puede ser cambiado añadiendo alguna de estas clases modificadoras:

carousel-img--focus-center
carousel-img--focus-left

Como alternativa al carrusel principal, se puede utilizar el componente Hero, que consiste en un solo ítem destacado al mismo tiempo.

Carrusel principal

Ejemplo:

Cargando ...