Commit 0fb48bcf705a3a253c0918d2f22bc3f38f897139

Authored by Marcelo Puebla
Exists in develop

Merge branch 'master' into 'develop'

Master(benjamin)

See merge request !64
src/app/modules/carrito/carrito.component.html
1 <div class="h-92 bg-white fade-in-left"> 1 <div class="h-92 bg-white fade-in-left">
2 <!-- PUBLICIDADES --> 2 <!-- PUBLICIDADES -->
3 <app-header-publicidad></app-header-publicidad> 3 <app-header-publicidad></app-header-publicidad>
4 4
5 <div class="h-75 carrito-content"> 5 <div class="h-75 carrito-content">
6 <!-- CABECERA --> 6 <!-- CABECERA -->
7 <div class="row mx-3 h-auto border border-primary rounded-sm"> 7 <div class="row mx-3 h-auto border border-primary rounded-sm">
8 <div class="col-12 px-0 py-2 align-self-center"> 8 <div class="col-12 px-0 py-2 align-self-center">
9 <div class="px-3"> 9 <div class="px-3">
10 <p class="h6 text-truncate">ESTE ES TÚ CARRITO DE COMPRAS</p> 10 <p class="h6 text-truncate">ESTE ES TÚ CARRITO DE COMPRAS</p>
11 </div> 11 </div>
12 </div> 12 </div>
13 </div> 13 </div>
14 14
15 <!-- CARRITO --> 15 <!-- CARRITO -->
16 <div 16 <div
17 class="row mx-2 mt-4 h-80 h-lg-60 align-content-start scroll-y-visible" 17 class="row mx-2 mt-4 h-80 h-lg-60 align-content-start scroll-y-visible"
18 (scroll)="scrollEvent($event)"> 18 (scroll)="scrollEvent($event)">
19 <!-- MENSAJE DE ADVERTENCIA --> 19 <!-- MENSAJE DE ADVERTENCIA -->
20 <div class="col-10 align-self-center alert alert-primary" *ngIf="!articuloService.carrito.length"> 20 <div class="col-10 align-self-center alert alert-primary" *ngIf="!articuloService.carrito.length">
21 <p class="h5 text-center">No hay artículos en el carrito</p> 21 <p class="h5 text-center">No hay artículos en el carrito</p>
22 </div> 22 </div>
23 <!-- ARTICULOS --> 23 <!-- ARTICULOS -->
24 <div 24 <div
25 class="col-12 col-xl-6 p-2 h-50 h-md-25 h-xl-40 text-center text-truncate carrito-articulo" 25 class="col-12 col-xl-6 p-2 h-50 h-md-25 h-xl-40 text-center text-truncate carrito-articulo"
26 *ngFor="let articulo of articuloService.carrito; let i = index;" 26 *ngFor="let articulo of articuloService.carrito; let i = index;"
27 @EnterLeaveX> 27 @EnterLeaveX>
28 <!-- ARTICULO --> 28 <!-- ARTICULO -->
29 <div class="h-100 border border-primary rounded-sm"> 29 <div class="h-100 border border-primary rounded-sm">
30 <div class="row align-items-center mx-0 h-100"> 30 <div class="row align-items-center mx-0 h-100">
31 <!-- NOMBRE E IMAGEN --> 31 <!-- NOMBRE E IMAGEN -->
32 <div class="col-6 col-md-3 h-50 h-md-100 border-right border-primary"> 32 <div class="col-6 col-md-3 h-50 h-md-100 border-right border-primary">
33 <img 33 <img
34 draggable="false" 34 draggable="false"
35 ondragstart="return false;" 35 ondragstart="return false;"
36 (contextmenu)="false" 36 (contextmenu)="false"
37 class="d-none d-md-block mx-auto h-55 rounded-sm shadow-sm" 37 class="d-none d-md-block mx-auto h-55 rounded-sm shadow-sm"
38 src="{{urlImagenes}}{{articulo.imagenes[0].imagen}}" 38 src="{{urlImagenes}}{{articulo.imagenes[0].imagen}}"
39 onerror="this.src='assets/img/image-not-found.jpg'"> 39 onerror="this.src='assets/img/image-not-found.jpg'">
40 <div class="row mx-0 h-100 h-md-45"> 40 <div class="row mx-0 h-100 h-md-45">
41 <p class="col text-primary text-truncate align-self-center"> 41 <p class="col text-primary text-truncate align-self-center">
42 <small>{{articulo.DetArt}}</small> 42 <small>{{articulo.MKT_DESC ? articulo.MKT_DESC.toUpperCase() : articulo.DetArt.toUpperCase()}}</small>
43 </p> 43 </p>
44 </div> 44 </div>
45 </div> 45 </div>
46 <!-- CANTIDAD --> 46 <!-- CANTIDAD -->
47 <div class="col-6 col-md-3 h-50 h-md-100 border-right border-primary"> 47 <div class="col-6 col-md-3 h-50 h-md-100 border-right border-primary">
48 <p class="h-40"><small>CANT</small></p> 48 <p class="h-40"><small>CANT</small></p>
49 <app-articulo-cantidad [articulo]="articulo"></app-articulo-cantidad> 49 <app-articulo-cantidad [articulo]="articulo"></app-articulo-cantidad>
50 </div> 50 </div>
51 <!-- PRECIO --> 51 <!-- PRECIO -->
52 <div class="col-6 col-md-3 h-50 h-md-100 border-right border-primary"> 52 <div class="col-6 col-md-3 h-50 h-md-100 border-right border-primary">
53 <p class="h-40"><small>PRECIO</small></p> 53 <p class="h-40"><small>PRECIO</small></p>
54 <div class="py-1 badge-pill bg-dark text-white"> 54 <div class="py-1 badge-pill bg-dark text-white">
55 <p><small>{{articulo.PreVen | currency}}</small></p> 55 <p><small>{{articulo.PreVen | currency}}</small></p>
56 </div> 56 </div>
57 </div> 57 </div>
58 <!-- ELIMINAR --> 58 <!-- ELIMINAR -->
59 <div class="col-6 col-md-3 align-self-center"> 59 <div class="col-6 col-md-3 align-self-center">
60 <div class="row mx-0 justify-content-center"> 60 <div class="row mx-0 justify-content-center">
61 <div 61 <div
62 class="col-auto px-3 py-1 btn-effect bg-primary badge-pill text-white" 62 class="col-auto px-3 py-1 btn-effect bg-primary badge-pill text-white"
63 (click)="deleteArticulo(i)"> 63 (click)="deleteArticulo(i)">
64 <span> 64 <span>
65 <small class="pr-2">ELIMINAR</small> 65 <small class="pr-2">ELIMINAR</small>
66 <img 66 <img
67 draggable="false" 67 draggable="false"
68 ondragstart="return false;" 68 ondragstart="return false;"
69 (contextmenu)="false" 69 (contextmenu)="false"
70 class="icon-20 rotate-45" 70 class="icon-20 rotate-45"
71 src="assets/img/mas-blanco.svg"> 71 src="assets/img/mas-blanco.svg">
72 </span> 72 </span>
73 </div> 73 </div>
74 </div> 74 </div>
75 </div> 75 </div>
76 </div> 76 </div>
77 </div> 77 </div>
78 </div> 78 </div>
79 </div> 79 </div>
80 <!-- TOTAL --> 80 <!-- TOTAL -->
81 <div class="row mx-3 mt-2 h-auto justify-content-end"> 81 <div class="row mx-3 mt-2 h-auto justify-content-end">
82 <div class="col-auto align-self-center text-primary"><small>TOTAL</small></div> 82 <div class="col-auto align-self-center text-primary"><small>TOTAL</small></div>
83 <div class="col-auto px-3 bg-primary badge-pill"> 83 <div class="col-auto px-3 bg-primary badge-pill">
84 <p class="text-center text-white py-1">{{articuloService.subTotal | currency}}</p> 84 <p class="text-center text-white py-1">{{articuloService.subTotal | currency}}</p>
85 </div> 85 </div>
86 </div> 86 </div>
87 <!-- CONTINUAR --> 87 <!-- CONTINUAR -->
88 <div 88 <div
89 *ngIf="articuloService.carrito.length" 89 *ngIf="articuloService.carrito.length"
90 class="row mx-3 mt-4 h-auto justify-content-end"> 90 class="row mx-3 mt-4 h-auto justify-content-end">
91 <div 91 <div
92 class="col-auto py-2 px-3 align-self-center btn-effect bg-primary badge-pill text-white" 92 class="col-auto py-2 px-3 align-self-center btn-effect bg-primary badge-pill text-white"
93 [routerLink]="['/forma-pago']"> 93 [routerLink]="['/forma-pago']">
94 <span> 94 <span>
95 <small class="pr-2">CONTINUAR</small> 95 <small class="pr-2">CONTINUAR</small>
96 <img 96 <img
97 draggable="false" 97 draggable="false"
98 ondragstart="return false;" 98 ondragstart="return false;"
99 (contextmenu)="false" 99 (contextmenu)="false"
100 class="icon-20" 100 class="icon-20"
101 src="assets/img/ir.svg"> 101 src="assets/img/ir.svg">
102 </span> 102 </span>
103 </div> 103 </div>
104 </div> 104 </div>
105 </div> 105 </div>
106 106
107 </div> 107 </div>
108 108
src/app/modules/seleccion-articulos/seleccion-articulos.component.html
1 <div class="h-92 bg-white fade-in-left"> 1 <div class="h-92 bg-white fade-in-left">
2 <!-- PUBLICIDADES --> 2 <!-- PUBLICIDADES -->
3 <app-header-publicidad></app-header-publicidad> 3 <app-header-publicidad></app-header-publicidad>
4 4
5 <div class="row mx-0 h-80 align-items-end"> 5 <div class="row mx-0 h-80 align-items-end">
6 <!-- CABECERA --> 6 <!-- CABECERA -->
7 <div class="row w-100 mx-3 h-auto border border-primary rounded-sm"> 7 <div class="row w-100 mx-3 h-auto border border-primary rounded-sm">
8 <div class="col-12 p-2 align-self-center"> 8 <div class="col-12 p-2 align-self-center">
9 <div class="px-3"> 9 <div class="px-3">
10 <p class="h6 text-truncate">SELECCIONÁ TÚ COMIDA Y/O BEBIDA</p> 10 <p class="h6 text-truncate">SELECCIONÁ TÚ COMIDA Y/O BEBIDA</p>
11 </div> 11 </div>
12 </div> 12 </div>
13 </div> 13 </div>
14 <!-- CUERPO --> 14 <!-- CUERPO -->
15 <div class="row w-100 mr-4 h-50 h-md-70" id="content"> 15 <div class="row w-100 mr-4 h-50 h-md-70" id="content">
16 <div class="col-12 h-100 px-0 py-3"> 16 <div class="col-12 h-100 px-0 py-3">
17 <div class="row mx-0 h-100"> 17 <div class="row mx-0 h-100">
18 <app-filtro-categorias 18 <app-filtro-categorias
19 class="col-5 col-sm-3 col-xl-2 h-100" 19 class="col-5 col-sm-3 col-xl-2 h-100"
20 #filtroCategorias 20 #filtroCategorias
21 (getProductos)="getProductos()" 21 (getProductos)="getProductos()"
22 (setProductos)="setProductos()" 22 (setProductos)="setProductos()"
23 (filterItems)="filterItems()"> 23 (filterItems)="filterItems()">
24 </app-filtro-categorias> 24 </app-filtro-categorias>
25 <!-- LISTA DE ARTICULOS --> 25 <!-- LISTA DE ARTICULOS -->
26 <div 26 <div
27 class="col-7 col-sm-9 col-xl-10 pb-3 h-100 align-self-center scroll-y-visible" 27 class="col-7 col-sm-9 col-xl-10 pb-3 h-100 align-self-center scroll-y-visible"
28 (scroll)="scrollEvent($event)"> 28 (scroll)="scrollEvent($event)">
29 <div class="row row-cols-1 row-cols-sm-3 row-cols-xl-6"> 29 <div class="row row-cols-1 row-cols-sm-3 row-cols-xl-6">
30 <!-- ARTICULO --> 30 <!-- ARTICULO -->
31 <div 31 <div
32 class="col px-2 my-1 my-md-3 h-auto" 32 class="col px-2 my-1 my-md-3 h-auto"
33 *ngFor="let articulo of auxArticulos | slice:0:showQuantity;"> 33 *ngFor="let articulo of auxArticulos | slice:0:showQuantity;">
34 <div 34 <div
35 class="swing-in-top-fwd btn-effect card h-auto" 35 class="swing-in-top-fwd btn-effect card h-auto"
36 (click)="selectArticulo(articulo)"> 36 (click)="selectArticulo(articulo)">
37 <img 37 <img
38 draggable="false" 38 draggable="false"
39 ondragstart="return false;" 39 ondragstart="return false;"
40 (contextmenu)="false" 40 (contextmenu)="false"
41 src="{{urlImagenes}}{{articulo.imagenes[0].imagen}}" 41 src="{{urlImagenes}}{{articulo.imagenes[0].imagen}}"
42 onerror="this.src='assets/img/image-not-found.jpg'" 42 onerror="this.src='assets/img/image-not-found.jpg'"
43 class="card-img-top h-30 h-md-55 rounded-sm"> 43 class="card-img-top h-30 h-md-55 rounded-sm">
44 <div class="row mx-0 py-1 h-auto justify-content-center"> 44 <div class="row mx-0 py-1 h-auto justify-content-center">
45 <p 45 <p class="col-12 px-1 h6 h-auto text-primary text-center min-h-60">
46 [ngClass]="{'text-primary': articulo.PRO, 'text-secondary': !articulo.PRO}" 46 {{articulo.MKT_DESC ? articulo.MKT_DESC.toUpperCase() : articulo.DetArt.toUpperCase()}}
47 class="col-12 px-1 h6 h-auto text-center min-h-60">
48 {{articulo.DetArt.toUpperCase()}}
49 </p> 47 </p>
50 <div class="col-12 px-1 align-self-end h-auto"> 48 <div class="col-12 px-1 align-self-end h-auto">
51 <div 49 <div class="row mx-0 justify-content-between bg-primary badge-pill">
52 [ngClass]="{'bg-primary': articulo.PRO, 'bg-secondary': !articulo.PRO}"
53 class="row mx-0 justify-content-between badge-pill">
54 <div class="col px-0 align-self-center text-white text-right"> 50 <div class="col px-0 align-self-center text-white text-right">
55 {{articulo.PreVen | currency}} 51 {{articulo.PreVen | currency}}
56 </div> 52 </div>
57 <div class="col-5 px-0"> 53 <div class="col-5 px-0">
58 <img 54 <img
59 draggable="false" 55 draggable="false"
60 ondragstart="return false;" 56 ondragstart="return false;"
61 (contextmenu)="false" 57 (contextmenu)="false"
62 class="d-block ml-auto py-1 icon-30" 58 class="d-block ml-auto py-1 icon-30"
63 src="assets/img/ir.svg"> 59 src="assets/img/ir.svg">
64 </div> 60 </div>
65 </div> 61 </div>
66 </div> 62 </div>
67 </div> 63 </div>
68 </div> 64 </div>
69 </div> 65 </div>
70 </div> 66 </div>
71 <!-- BOTON VER MAS --> 67 <!-- BOTON VER MAS -->
72 <div class="row mx-0"> 68 <div class="row mx-0">
73 <div 69 <div
74 *ngIf="showQuantity <= auxArticulos.slice(0, showQuantity).length" 70 *ngIf="showQuantity <= auxArticulos.slice(0, showQuantity).length"
75 class="col-12 px-0 mb-2"> 71 class="col-12 px-0 mb-2">
76 <button 72 <button
77 (click)="increaseShow()" 73 (click)="increaseShow()"
78 class="btn btn-block btn-outline-primary"> 74 class="btn btn-block btn-outline-primary">
79 Ver Más 75 Ver Más
80 </button> 76 </button>
81 </div> 77 </div>
82 </div> 78 </div>
83 </div> 79 </div>
84 </div> 80 </div>
85 </div> 81 </div>
86 </div> 82 </div>
87 <!-- FOOTER CARRITO DE COMPRAS --> 83 <!-- FOOTER CARRITO DE COMPRAS -->
88 <div class="row w-90 mx-auto h-auto justify-content-center"> 84 <div class="row w-90 mx-auto h-auto justify-content-center">
89 <div class="h-75 px-0 border border-primary rounded" #boxCarrito 85 <div class="h-75 px-0 border border-primary rounded" #boxCarrito
90 [ngClass]="boxCarrito.classList.contains('media-pantalla') 86 [ngClass]="boxCarrito.classList.contains('media-pantalla')
91 ? 'col-8' : 'col-12'" id="boxCarrito"> 87 ? 'col-8' : 'col-12'" id="boxCarrito">
92 <!-- CABECERA --> 88 <!-- CABECERA -->
93 <div class="row mx-0 h-15 border-bottom border-primary"> 89 <div class="row mx-0 h-15 border-bottom border-primary">
94 <p class="col align-self-center text-truncate"><small>ARTÍCULOS EN TÚ CARRITO DE COMPRAS</small></p> 90 <p class="col align-self-center text-truncate"><small>ARTÍCULOS EN TÚ CARRITO DE COMPRAS</small></p>
95 </div> 91 </div>
96 <!-- CUERPO --> 92 <!-- CUERPO -->
97 <div class="row h-85 mx-0 justify-content-around"> 93 <div class="row h-85 mx-0 justify-content-around">
98 <!-- BOTON SCROLL IZQUIERDA --> 94 <!-- BOTON SCROLL IZQUIERDA -->
99 <div *ngIf="articuloService.carrito.length" class="col-auto btn-effect h-20 align-self-center"> 95 <div *ngIf="articuloService.carrito.length" class="col-auto btn-effect h-20 align-self-center">
100 <img 96 <img
101 draggable="false" 97 draggable="false"
102 ondragstart="return false;" 98 ondragstart="return false;"
103 (contextmenu)="false" 99 (contextmenu)="false"
104 class="icon-30 rotate-180-neg" 100 class="icon-30 rotate-180-neg"
105 src="assets/img/ir-fondo-color.svg" 101 src="assets/img/ir-fondo-color.svg"
106 (mousedown)="scrollX(templateCarrito, -100)" 102 (mousedown)="scrollX(templateCarrito, -100)"
107 (mouseup)="mouseup()" 103 (mouseup)="mouseup()"
108 (mouseleave)="mouseup()"> 104 (mouseleave)="mouseup()">
109 </div> 105 </div>
110 <!-- CARRITO --> 106 <!-- CARRITO -->
111 <div class="col-6 col-sm-8 col-lg-10 h-100"> 107 <div class="col-6 col-sm-8 col-lg-10 h-100">
112 <div 108 <div
113 #templateCarrito 109 #templateCarrito
114 class="row flex-row flex-nowrap h-100 mx-0 my-2 scroll-x" 110 class="row flex-row flex-nowrap h-100 mx-0 my-2 scroll-x"
115 (scroll)="scrollEvent($event)"> 111 (scroll)="scrollEvent($event)">
116 <!-- ARTICULOS --> 112 <!-- ARTICULOS -->
117 <div 113 <div
118 class="col-10 col-sm-4 col-lg-2 px-2 px-xl-4 align-self-center border-right border-primary" 114 class="col-10 col-sm-4 col-lg-2 px-2 px-xl-4 align-self-center border-right border-primary"
119 *ngFor="let articulo of articuloService.carrito; let i = index;" 115 *ngFor="let articulo of articuloService.carrito; let i = index;"
120 @EnterLeaveY> 116 @EnterLeaveY>
121 <img 117 <img
122 class="btn-effect icon-20 mr-2 position-absolute right-0" 118 class="btn-effect icon-20 mr-2 position-absolute right-0"
123 src="assets/img/icono-cancelar-color.svg" 119 src="assets/img/icono-cancelar-color.svg"
124 (click)="deleteArticulo(i)"> 120 (click)="deleteArticulo(i)">
125 <img 121 <img
126 draggable="false" 122 draggable="false"
127 ondragstart="return false;" 123 ondragstart="return false;"
128 (contextmenu)="false" 124 (contextmenu)="false"
129 class="d-block img-fluid p-2 mx-auto rounded" 125 class="d-block img-fluid p-2 mx-auto rounded"
130 src="{{urlImagenes}}{{articulo.imagenes[0].imagen}}" 126 src="{{urlImagenes}}{{articulo.imagenes[0].imagen}}"
131 onerror="this.src='assets/img/image-not-found.jpg'"> 127 onerror="this.src='assets/img/image-not-found.jpg'">
132 <p class="d-block mt-auto text-center text-primary text-truncate"> 128 <p class="d-block mt-auto text-center text-primary text-truncate">
133 <small>{{articulo.DetArt}}</small> 129 <small>{{articulo.MKT_DESC ? articulo.MKT_DESC.toUpperCase() : articulo.DetArt.toUpperCase()}}</small>
134 </p> 130 </p>
135 <app-articulo-cantidad [articulo]="articulo"></app-articulo-cantidad> 131 <app-articulo-cantidad [articulo]="articulo"></app-articulo-cantidad>
136 </div> 132 </div>
137 <!-- MENSAJE DE ADVERTENCIA --> 133 <!-- MENSAJE DE ADVERTENCIA -->
138 <div *ngIf="!articuloService.carrito.length" class="col h-100"> 134 <div *ngIf="!articuloService.carrito.length" class="col h-100">
139 <p class="text-center py-5">No hay articulos en el carrito</p> 135 <p class="text-center py-5">No hay articulos en el carrito</p>
140 </div> 136 </div>
141 </div> 137 </div>
142 </div> 138 </div>
143 <!-- BOTON SCROLL DERECHA --> 139 <!-- BOTON SCROLL DERECHA -->
144 <div *ngIf="articuloService.carrito.length" class="col-auto btn-effect h-20 align-self-center"> 140 <div *ngIf="articuloService.carrito.length" class="col-auto btn-effect h-20 align-self-center">
145 <img 141 <img
146 draggable="false" 142 draggable="false"
147 ondragstart="return false;" 143 ondragstart="return false;"
148 (contextmenu)="false" 144 (contextmenu)="false"
149 class="icon-30" 145 class="icon-30"
150 src="assets/img/ir-fondo-color.svg" 146 src="assets/img/ir-fondo-color.svg"
151 (mousedown)="scrollX(templateCarrito, 100)" 147 (mousedown)="scrollX(templateCarrito, 100)"
152 (mouseup)="mouseup()" 148 (mouseup)="mouseup()"
153 (mouseleave)="mouseup()"> 149 (mouseleave)="mouseup()">
154 </div> 150 </div>
155 </div> 151 </div>
156 </div> 152 </div>
157 <!-- TOTAL--> 153 <!-- TOTAL-->
158 <div 154 <div
159 class="col-auto mt-2 ml-auto h-20"> 155 class="col-auto mt-2 ml-auto h-20">
160 <div class="row mx-0"> 156 <div class="row mx-0">
161 <div class="col-auto align-self-center text-primary">TOTAL</div> 157 <div class="col-auto align-self-center text-primary">TOTAL</div>
162 <div class="col-auto bg-primary badge-pill"> 158 <div class="col-auto bg-primary badge-pill">
163 <p class="text-center text-white mt-1 py-1">{{articuloService.subTotal | currency}}</p> 159 <p class="text-center text-white mt-1 py-1">{{articuloService.subTotal | currency}}</p>
164 </div> 160 </div>
165 </div> 161 </div>
166 </div> 162 </div>
167 163
168 <!-- VER CARRITO --> 164 <!-- VER CARRITO -->
169 <div 165 <div
170 class="col-auto px-0 mt-2 h-20" 166 class="col-auto px-0 mt-2 h-20"
171 *ngIf="articuloService.carrito.length" 167 *ngIf="articuloService.carrito.length"
172 [ngClass]="{'ml-auto pb-3' : boxCarrito.classList.contains('media-pantalla')}"> 168 [ngClass]="{'ml-auto pb-3' : boxCarrito.classList.contains('media-pantalla')}">
173 <div 169 <div
174 class="btn-effect col-auto px-0 align-self-center bg-white" 170 class="btn-effect col-auto px-0 align-self-center bg-white"
175 [routerLink]="['/carrito']"> 171 [routerLink]="['/carrito']">
176 <div class="row mx-0 bg-light"> 172 <div class="row mx-0 bg-light">
177 <div class="col-auto p-0 bg-primary"> 173 <div class="col-auto p-0 bg-primary">
178 <img 174 <img
179 draggable="false" 175 draggable="false"
180 ondragstart="return false;" 176 ondragstart="return false;"
181 (contextmenu)="false" 177 (contextmenu)="false"
182 class="p-2 icon-40" 178 class="p-2 icon-40"
183 src="assets/img/carrito.svg"> 179 src="assets/img/carrito.svg">
184 </div> 180 </div>
185 <div class="col-auto align-self-center text-primary d-none d-sm-block">IR AL CARRITO</div> 181 <div class="col-auto align-self-center text-primary d-none d-sm-block">IR AL CARRITO</div>
186 </div> 182 </div>
187 </div> 183 </div>
188 </div> 184 </div>
189 185
190 </div> 186 </div>
191 </div> 187 </div>
192 188
193 </div> 189 </div>
194 190