Luis Suarez / autoservicio-axion

Download as
Browse Code »

Commit dd68072b3953030bbf5a44fcca71b30f467694e6

Authored by Luis Suarez
1 parent f3a2e69bbe
Exists in develop

todo el card es clickeable

Showing 1 changed file with 15 additions and 13 deletions   Show diff stats
src/app/modules/indicaciones-pago-tarjeta/indicaciones-pago-tarjeta.component.html
Diff comments   View file @ dd68072
1 <div class="h-92 bg-white fade-in-left"> 1 <div class="h-92 bg-white fade-in-left">
2 <div class="row mx-0 h-15"> 2 <div class="row mx-0 h-15">
3 <div class="col-12 px-0 h-80 my-auto"> 3 <div class="col-12 px-0 h-80 my-auto">
4 <img 4 <img
5 draggable="false" 5 draggable="false"
6 ondragstart="return false;" 6 ondragstart="return false;"
7 (contextmenu)="(false)" 7 (contextmenu)="(false)"
8 class="d-block mx-auto h-100" 8 class="d-block mx-auto h-100"
9 src="assets/img/logo-spot.svg"/> 9 src="assets/img/logo-spot.svg"/>
10 </div> 10 </div>
11 </div> 11 </div>
12 <div class="h-85"> 12 <div class="h-85">
13 <div class="row h-auto mt-6 mx-0 justify-content-center text-center"> 13 <div class="row h-auto mt-6 mx-0 justify-content-center text-center">
14 <div 14 <div
15 #card 15 #card
16 class="p-5 mx-auto mt-4 h-30 align-self-center 16 class="p-5 mx-auto mt-4 h-30 align-self-center
17 btn-effect border border-primary rounded reduce-card-1" 17 btn-effect border border-primary rounded reduce-card-1"
18 [ngClass]="card.classList.contains('media-pantalla') ? 'col-md-4' : 'col-md-8'"> 18 [ngClass]="card.classList.contains('media-pantalla') ? 'col-md-4' : 'col-md-8'"
19 [routerLink]="['/pago-tarjeta']">
19 <div class="row h-auto"> 20 <div class="row h-auto">
20 <div [ngClass]="card.classList.contains('media-pantalla') ? 'col-12' : 'col-4'"> 21 <div [ngClass]="card.classList.contains('media-pantalla') ? 'col-12' : 'col-4'">
21 <img 22 <img
22 draggable="false" 23 draggable="false"
23 ondragstart="return false;" 24 ondragstart="return false;"
24 (contextmenu)="(false)" 25 (contextmenu)="(false)"
25 class="w-100 h-auto bg-white" 26 class="w-100 h-auto bg-white"
26 src="assets/img/tarjeta-banda.jpg"/> 27 src="assets/img/tarjeta-banda.jpg"/>
27 </div> 28 </div>
28 <div class="h-auto" 29 <div class="h-auto"
29 [ngClass]="card.classList.contains('media-pantalla') ? 'col-12' : 'col-8'"> 30 [ngClass]="card.classList.contains('media-pantalla') ? 'col-12' : 'col-8'">
30 <p class="h2 m-0 text-primary">Banda Magnética</p> 31 <p class="h2 m-0 text-primary">Banda Magnética</p>
31 <small class=" m-0"> 32 <small class=" m-0">
32 DESLIZÁ LA TARJETA POR LA RANURA<br> 33 DESLIZÁ LA TARJETA POR LA RANURA<br>
33 CUANDO LA PANTALLA LO INDIQUE 34 CUANDO LA PANTALLA LO INDIQUE
34 </small> 35 </small>
35 <div class="btn-effect col-12 px-0 bg-white mt-4 mx-auto"> 36 <div
37 class="btn-effect col-12 px-0 bg-white mt-4 mx-auto">
36 <div class="row mx-0 bg-primary badge-pill h-auto"> 38 <div class="row mx-0 bg-primary badge-pill h-auto">
37 <div 39 <div class="col-10 align-self-center text-center text-white">
38 class="col-10 align-self-center text-center text-white"
39 [routerLink]="['/pago-tarjeta']">
40 Continuar 40 Continuar
41 </div> 41 </div>
42 <div class="col-2 align-self-center p-0"> 42 <div class="col-2 align-self-center p-0">
43 <img 43 <img
44 draggable="false" 44 draggable="false"
45 ondragstart="return false;" 45 ondragstart="return false;"
46 (contextmenu)="(false)" 46 (contextmenu)="(false)"
47 class="p-1 icon-50" 47 class="p-1 icon-50"
48 src="assets/img/ir.svg"/> 48 src="assets/img/ir.svg"/>
49 </div> 49 </div>
50 </div> 50 </div>
51 </div> 51 </div>
52 </div> 52 </div>
53 </div> 53 </div>
54 </div> 54 </div>
55 <div 55 <div
56 class="p-5 mx-auto mt-6 h-auto align-self-center 56 class="p-5 mx-auto mt-6 h-auto align-self-center
57 btn-effect border border-primary rounded reduce-card-1" 57 btn-effect border border-primary rounded reduce-card-1"
58 [ngClass]="card.classList.contains('media-pantalla') ? 'col-md-4' : 'col-md-8'"> 58 [ngClass]="card.classList.contains('media-pantalla') ? 'col-md-4' : 'col-md-8'"
59 [routerLink]="['/pago-tarjeta']">
59 <div class="row h-auto"> 60 <div class="row h-auto">
60 <div [ngClass]="card.classList.contains('media-pantalla') ? 'col-12' : 'col-4'"> 61 <div [ngClass]="card.classList.contains('media-pantalla') ? 'col-12' : 'col-4'">
61 <img 62 <img
62 draggable="false" 63 draggable="false"
63 ondragstart="return false;" 64 ondragstart="return false;"
64 (contextmenu)="(false)" 65 (contextmenu)="(false)"
65 class="w-100 h-auto bg-white" 66 class="w-100 h-auto bg-white"
66 src="assets/img/tarjeta-chip.jpg"/> 67 src="assets/img/tarjeta-chip.jpg"/>
67 </div> 68 </div>
68 <div 69 <div
69 class="h-auto" 70 class="h-auto"
70 [ngClass]="card.classList.contains('media-pantalla') ? 'col-12' : 'col-8'"> 71 [ngClass]="card.classList.contains('media-pantalla') ? 'col-12' : 'col-8'">
71 <p class="h2 m-0 text-primary">Chip</p> 72 <p class="h2 m-0 text-primary">Chip</p>
72 <small class=" m-0"> 73 <small class=" m-0">
73 INTRODUCÍ TU TARJETA POR LA<br> 74 INTRODUCÍ TU TARJETA POR LA<br>
74 PARTE INFERIOR DE LECTOR <br> 75 PARTE INFERIOR DE LECTOR <br>
75 CUANDO LA PANTALLA LO INDIQUE 76 CUANDO LA PANTALLA LO INDIQUE
76 </small> 77 </small>
77 <div class="btn-effect col-12 px-0 bg-white mt-4 mx-auto"> 78 <div
79 class="btn-effect col-12 px-0 bg-white mt-4 mx-auto">
78 <div class="row mx-0 bg-primary badge-pill h-auto"> 80 <div class="row mx-0 bg-primary badge-pill h-auto">
79 <div 81 <div
80 class="col-10 align-self-center text-center text-white" 82 class="col-10 align-self-center text-center text-white">
81 [routerLink]="['/pago-tarjeta']">
82 Continuar 83 Continuar
83 </div> 84 </div>
84 <div class="col-2 align-self-center p-0"> 85 <div class="col-2 align-self-center p-0">
85 <img 86 <img
86 draggable="false" 87 draggable="false"
87 ondragstart="return false;" 88 ondragstart="return false;"
88 (contextmenu)="(false)" 89 (contextmenu)="(false)"
89 class="p-1 icon-50" 90 class="p-1 icon-50"
90 src="assets/img/ir.svg"/> 91 src="assets/img/ir.svg"/>
91 </div> 92 </div>
92 </div> 93 </div>
93 </div> 94 </div>
94 </div> 95 </div>
95 </div> 96 </div>
96 </div> 97 </div>
97 <div 98 <div
98 class="col-sm-10 col-md-4 p-5 mx-auto mt-6 align-self-center 99 class="col-sm-10 col-md-4 p-5 mx-auto mt-6 align-self-center
99 btn-effect border border-primary rounded reduce-card-1" 100 btn-effect border border-primary rounded reduce-card-1"
100 [ngClass]="card.classList.contains('media-pantalla') ? 'col-md-4' : 'col-md-8'"> 101 [ngClass]="card.classList.contains('media-pantalla') ? 'col-md-4' : 'col-md-8'"
102 [routerLink]="['/pago-tarjeta']">
101 <div class="row h-auto"> 103 <div class="row h-auto">
102 <div [ngClass]="card.classList.contains('media-pantalla') ? 'col-12' : 'col-4'"> 104 <div [ngClass]="card.classList.contains('media-pantalla') ? 'col-12' : 'col-4'">
103 <img 105 <img
104 draggable="false" 106 draggable="false"
105 ondragstart="return false;" 107 ondragstart="return false;"
106 (contextmenu)="(false)" 108 (contextmenu)="(false)"
107 class="w-100 h-auto bg-white" 109 class="w-100 h-auto bg-white"
108 src="assets/img/tarjeta-contact-less.jpg"/> 110 src="assets/img/tarjeta-contact-less.jpg"/>
109 </div> 111 </div>
110 <div 112 <div
111 class="h-auto" 113 class="h-auto"
112 [ngClass]="card.classList.contains('media-pantalla') ? 'col-12' : 'col-8'"> 114 [ngClass]="card.classList.contains('media-pantalla') ? 'col-12' : 'col-8'">
113 <p class="h2 m-0 text-primary">Contact-less</p> 115 <p class="h2 m-0 text-primary">Contact-less</p>
114 <small class=" m-0"> 116 <small class=" m-0">
115 ACERCÁ LA TARJETA AL POSNET<br> 117 ACERCÁ LA TARJETA AL POSNET<br>
116 CUANDO LA PANTALLA LO INDIQUE 118 CUANDO LA PANTALLA LO INDIQUE
117 </small> 119 </small>
118 <div class="btn-effect col-12 px-0 bg-white mt-4 mx-auto"> 120 <div
121 class="btn-effect col-12 px-0 bg-white mt-4 mx-auto">
119 <div class="row mx-0 bg-primary badge-pill h-auto"> 122 <div class="row mx-0 bg-primary badge-pill h-auto">
120 <div 123 <div
121 class="col-10 align-self-center text-center text-white" 124 class="col-10 align-self-center text-center text-white">
122 [routerLink]="['/pago-tarjeta']">
123 <small>Continuar</small> 125 <small>Continuar</small>
124 </div> 126 </div>
125 <div class="col-2 align-self-center p-0"> 127 <div class="col-2 align-self-center p-0">
126 <img 128 <img
127 draggable="false" 129 draggable="false"
128 ondragstart="return false;" 130 ondragstart="return false;"
129 (contextmenu)="(false)" 131 (contextmenu)="(false)"
130 class="p-1 icon-50" 132 class="p-1 icon-50"
131 src="assets/img/ir.svg"/> 133 src="assets/img/ir.svg"/>
132 </div> 134 </div>
133 </div> 135 </div>
134 </div> 136 </div>
135 </div> 137 </div>
136 </div> 138 </div>
137 </div> 139 </div>