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