Commit 7429ebbf410877726081da47085c42b865bda38c
1 parent
87272eae6b
Exists in
master
Cambiao carousel por video.
Showing
2 changed files
with
21 additions
and
25 deletions
Show diff stats
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 | } |