Commit 7429ebbf410877726081da47085c42b865bda38c

Authored by Marcelo Puebla
1 parent 87272eae6b
Exists in master and in 1 other branch validar_pve

Cambiao carousel por video.

src/app/components/home/home.component.html
1 <div class="container-fluid p-0"> 1 <div class="container-fluid p-0">
2 <img 2 <img
3 src="{{apiImagenes}}/imagenes/homeBackground.jpg" 3 src="{{apiImagenes}}/imagenes/homeBackground.jpg"
4 class="background-image vh-100 w-100"> 4 class="background-image vh-100 w-100">
5 <div class="row m-0"> 5 <div class="row m-0">
6 <div class="col p-0"> 6 <div class="col p-0">
7 <div 7 <div
8 class="vh-100 fade-in d-flex align-items-start flex-column disable-user-select" 8 class="vh-100 fade-in d-flex align-items-start flex-column disable-user-select"
9 [routerLink]="['/inicio']"> 9 [routerLink]="['/inicio']">
10 10
11 <!-- HEADER --> 11 <!-- HEADER -->
12 <div class="row m-0 w-100 bg-primary-gradient-horizontal"> 12 <div class="row m-0 w-100 bg-primary-gradient-horizontal">
13 <div class="col-6 bg-white p-3 rounded-bottom-right"> 13 <div class="col-6 bg-white p-3 rounded-bottom-right">
14 <img class="w-25 mx-auto d-block" src="{{apiImagenes}}/imagenes/logoempresa.png"> 14 <img class="w-25 mx-auto d-block" src="{{apiImagenes}}/imagenes/logoempresa.png">
15 </div> 15 </div>
16 </div> 16 </div>
17 17
18 <!-- INFO DE BIENVENIDA --> 18 <!-- INFO DE BIENVENIDA -->
19 <div class="row my-auto h-50 w-100"> 19 <div class="row my-auto mx-0 h-75 w-100">
20 <div class="col-3 col-lg-4 offset-lg-1 h-100 my-auto"> 20 <div class="col-8 col-lg-8 my-auto">
21 <!-- CAROUSEL --> 21 <div class="embed-responsive embed-responsive-16by9">
22 <carousel [showIndicators]="false" [interval]="1500"> 22 <iframe
23 <slide class="h-100"> 23 class="embed-responsive-item rounded fade-in"
24 <img 24 src="https://www.youtube.com/embed/vb8ZcalBDyw?&autoplay=1&loop=1&playlist=vb8ZcalBDyw&controls=0&showinfo=0&mute=1">
25 src="{{apiImagenes}}/imagenes/coca1.jpg" 25 </iframe>
26 class="fade-in d-block rounded-sm shadow mw-100 h-100 w-auto mx-auto"> 26 </div>
27 </slide>
28 <slide class="h-100">
29 <img
30 src="{{apiImagenes}}/imagenes/coca2.jpg"
31 class="fade-in d-block rounded-sm shadow mw-100 h-100 w-auto mx-auto">
32 </slide>
33 <slide class="h-100">
34 <img
35 src="{{apiImagenes}}/imagenes/coca3.jpg"
36 class="fade-in d-block rounded-sm shadow mw-100 h-100 w-auto mx-auto">
37 </slide>
38 </carousel>
39
40 </div>
41 <div class="col-9 col-lg-7 text-center text-white my-auto">
42 <p class="display-2 font-weight-bold mb-5">¡BIENVENIDO!</p>
43 <p class="display-3 m-0 font-weight-bold">Toque la pantalla<br>para comenzar</p>
44 </div> 27 </div>
28 <div class="col-8 col-lg-4 text-center text-white my-auto">
29 <p class="display-4 font-weight-bold m-0">¡BIENVENIDO!</p>
30 <p class="display-4 m-0 font-weight-bold">Toque la pantalla<br>para comenzar</p>
31 </div>
32
45 </div> 33 </div>
46 34
47 <!-- FOOTER --> 35 <!-- FOOTER -->
48 <div class="row m-0 w-100 bg-gray"> 36 <div class="row m-0 w-100 bg-gray">
49 <div class="col-6 bg-white offset-6 p-3 rounded-top-left"> 37 <div class="col-6 bg-white offset-6 p-3 rounded-top-left">
50 <img class="w-25 mx-auto d-block" src="{{apiImagenes}}/imagenes/logodebo.png"> 38 <img class="w-25 mx-auto d-block" src="{{apiImagenes}}/imagenes/logodebo.png">
51 </div> 39 </div>
52 </div> 40 </div>
53 41
src/app/components/home/home.component.scss
1 iframe{
2 pointer-events: none;
3 }
4
5 p {
6 color: white;
7 text-shadow: 2px 2px 15px #000;
8 }