@ussebastian/kitdigital
Version:
Kit Digital de la Universidad San Sebastián
81 lines (80 loc) • 3.54 kB
HTML
<section class="dark w-full">
<div
class="uss-hero--60vh"
data-uss-carousel="uss-carousel-hero"
data-uss-items-class="uss-carousel-hero__slide"
data-uss-speed="20"
data-uss-loop
data-uss-draggable
>
<div class="uss-carousel-hero__slide">
<div class="uss-hero uss-hero--background uss-hero--carousel-slide">
<img class="uss-hero__image" src="https://dummyimage.com/1200x1200/" alt="Hero image" />
<div class="uss-opacity-layer"></div>
<div class="col-md-8">
<div class="uss-hero__content">
<h2 class="uss-hero__title">
Lorem ipsum dolor sit amet, consecteturd adipiscing elit
</h2>
<p class="uss-hero__description">
Lorem ipsum dolor sit amet, consectetur adipiscing elit ut aliquam, purus sit amet
luctus venenatis, lectus magna fringilla urna, porttitor rhoncus dolor purus non enim
praesent elementum facilisis leo, vel fringilla est ullamcorper eget nulla.
</p>
<div class="uss-hero__buttons">
<a href="#" class="uss-btn uss-btn--tertiary">
<i class="uss-icon ri-arrow-right-circle-line"></i>Boton Terciario</a
>
</div>
</div>
</div>
</div>
</div>
<div class="uss-carousel-hero__slide">
<div class="uss-hero uss-hero--background uss-hero--carousel-slide">
<img class="uss-hero__image" src="https://dummyimage.com/1200x1200/" alt="Hero image" />
<div class="uss-opacity-layer"></div>
<div class="col-md-8">
<div class="uss-hero__content">
<h2 class="uss-hero__title">
Lorem ipsum dolor sit amet, consecteturd adipiscing elit
</h2>
<p class="uss-hero__description">
Lorem ipsum dolor sit amet, consectetur adipiscing elit ut aliquam, purus sit amet
luctus venenatis, lectus magna fringilla urna, porttitor rhoncus dolor purus non enim
praesent elementum facilisis leo, vel fringilla est ullamcorper eget nulla.
</p>
<div class="uss-hero__buttons">
<a href="#" class="uss-btn uss-btn--tertiary">
<i class="uss-icon ri-arrow-right-circle-line"></i>Boton Terciario</a
>
</div>
</div>
</div>
</div>
</div>
<div class="uss-carousel-hero__slide">
<div class="uss-hero uss-hero--background uss-hero--carousel-slide">
<img class="uss-hero__image" src="https://dummyimage.com/1200x1200/" alt="Hero image" />
<div class="uss-opacity-layer"></div>
<div class="col-md-8">
<div class="uss-hero__content">
<h2 class="uss-hero__title">
Lorem ipsum dolor sit amet, consecteturd adipiscing elit
</h2>
<p class="uss-hero__description">
Lorem ipsum dolor sit amet, consectetur adipiscing elit ut aliquam, purus sit amet
luctus venenatis, lectus magna fringilla urna, porttitor rhoncus dolor purus non enim
praesent elementum facilisis leo, vel fringilla est ullamcorper eget nulla.
</p>
<div class="uss-hero__buttons">
<a href="#" class="uss-btn uss-btn--tertiary">
<i class="uss-icon ri-arrow-right-circle-line"></i>Boton Terciario</a
>
</div>
</div>
</div>
</div>
</div>
</div>
</section>