Commit 5b476e62c2bbc89e9c3c022b9f68e981265b334f

Authored by Luis Suarez
1 parent 8f3a6641b0
Exists in develop

adding

src/app/modules/seleccion-articulos/filtro-categorias/filtro-categorias.component.scss
1 $primary: #aa006b; 1 $primary: #aa006b;
2 2
3 .box-categorias { 3 .box-categorias {
4 height: calc(100% - 100px) !important; 4 height: calc(100% - 100px) !important;
5 } 5 }
6 6
7 .active { 7 .active {
8 transition: 0.3s; 8 transition: 0.3s;
9 background-color: white; 9 background-color: white;
10 border-bottom: 3px solid $primary !important; 10 border-bottom: 3px solid $primary !important;
11 border-top: 3px solid $primary !important; 11 border-top: 3px solid $primary !important;
12 border-left: 3px solid $primary !important; 12 border-left: 3px solid $primary !important;
13 border-right: 3px solid $primary !important; 13 border-right: 3px solid $primary !important;
14 } 14 }
15 15
16 .border-bottom-effect { 16 .border-bottom-effect {
17 border: none; 17 border: none;
18 position: relative; 18 position: relative;
19 &:hover { 19 &:hover {
20 border: none; 20 border: none;
21 } 21 }
22 &::after { 22 &::after {
23 content: ""; 23 content: "";
24 position: absolute; 24 position: absolute;
25 width: 0px; 25 width: 0px;
26 height: 3px; 26 height: 3px;
27 left: 50%; 27 left: 50%;
28 bottom: 0; 28 bottom: 0;
29 background-color: $primary; 29 background-color: $primary;
30 transition: all ease-in-out 0.2s; 30 transition: all ease-in-out 0.2s;
31 } 31 }
32 &:hover::after { 32 &:hover::after {
33 width: 100%; 33 width: 100%;
34 left: 0; 34 left: 0;
35 } 35 }
36 } 36 }
37 37
38 .cat-content.media-pantalla, 38 .cat-content.media-pantalla,
39 #cat-content.media-pantalla { 39 #cat-content.media-pantalla {
40 margin: 0.5rem 0.7rem !important; 40 margin: 0.5rem 0.7rem !important;
41 height: 76% !important; 41 height: 95% !important;
42 } 42 }
43 43
44 .cat-box.media-pantalla { 44 .cat-box.media-pantalla {
45 height: calc(100% - 85px) !important; 45 height: calc(100% - 85px) !important;
46 } 46 }
47 47
48 .cat-btn.media-pantalla { 48 .cat-btn.media-pantalla {
49 height: 7% !important; 49 height: 7% !important;
50 } 50 }
51 51
52 #content.media-pantalla, 52 #content.media-pantalla,
53 #boxCarrito.media-pantalla { 53 #boxCarrito.media-pantalla {
54 max-height: 60% !important; 54 max-height: 60% !important;
55 } 55 }
56 56
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 align-items-end"
6 [ngClass]="boxCarrito.classList.contains('media-pantalla')
7 ? 'h-68' : 'h-80'">
6 <!-- CABECERA --> 8 <!-- CABECERA -->
7 <div class="row w-100 mx-3 h-auto border border-primary rounded-sm"> 9 <div class="row w-100 mx-3 h-auto border border-primary rounded-sm">
8 <div class="col-12 p-2 align-self-center"> 10 <div class="col-12 p-2 align-self-center">
9 <div class="px-3"> 11 <div class="px-3">
10 <p class="h6 text-truncate">SELECCIONÁ TÚ COMIDA Y/O BEBIDA</p> 12 <p class="h6 text-truncate">SELECCIONÁ TÚ COMIDA Y/O BEBIDA</p>
11 </div> 13 </div>
12 </div> 14 </div>
13 </div> 15 </div>
14 <!-- CUERPO --> 16 <!-- CUERPO -->
15 <div class="row w-100 mr-4 h-50 h-md-70" id="content"> 17 <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"> 18 <div class="col-12 h-100 px-0 py-3">
17 <div class="row mx-0 h-100"> 19 <div class="row mx-0 h-100">
18 <app-filtro-categorias 20 <app-filtro-categorias
19 class="col-5 col-sm-3 col-xl-2 h-100" 21 class="col-5 col-sm-3 col-xl-2 h-100"
20 #filtroCategorias 22 #filtroCategorias
21 (getProductos)="getProductos()" 23 (getProductos)="getProductos()"
22 (setProductos)="setProductos()" 24 (setProductos)="setProductos()"
23 (filterItems)="filterItems()"> 25 (filterItems)="filterItems()">
24 </app-filtro-categorias> 26 </app-filtro-categorias>
25 <!-- LISTA DE ARTICULOS --> 27 <!-- LISTA DE ARTICULOS -->
26 <div 28 <div
27 class="col-7 col-sm-9 col-xl-10 pb-3 h-100 align-self-center scroll-y-visible" 29 class="col-7 col-sm-9 col-xl-10 pb-3 h-100 align-self-center scroll-y-visible"
28 (scroll)="scrollEvent($event)"> 30 (scroll)="scrollEvent($event)">
29 <div class="row row-cols-1 row-cols-sm-3 row-cols-xl-6"> 31 <div class="row row-cols-1 row-cols-sm-3 row-cols-xl-6">
30 <!-- ARTICULO --> 32 <!-- ARTICULO -->
31 <div 33 <div
32 class="col px-2 my-1 my-md-3 h-auto" 34 class="col px-2 my-1 my-md-3 h-auto"
33 *ngFor="let articulo of auxArticulos | slice:0:showQuantity;"> 35 *ngFor="let articulo of auxArticulos | slice:0:showQuantity;">
34 <div 36 <div
35 class="swing-in-top-fwd btn-effect card h-auto" 37 class="swing-in-top-fwd btn-effect card h-auto"
36 (click)="selectArticulo(articulo)"> 38 (click)="selectArticulo(articulo)">
37 <img 39 <img
38 draggable="false" 40 draggable="false"
39 ondragstart="return false;" 41 ondragstart="return false;"
40 (contextmenu)="false" 42 (contextmenu)="false"
41 src="{{urlImagenes}}{{articulo.imagenes[0].imagen}}" 43 src="{{urlImagenes}}{{articulo.imagenes[0].imagen}}"
42 onerror="this.src='assets/img/image-not-found.jpg'" 44 onerror="this.src='assets/img/image-not-found.jpg'"
43 class="card-img-top w-100 h-auto h-md-55 rounded-sm"> 45 class="card-img-top w-100 h-auto h-md-55 rounded-sm">
44 <div class="row mx-0 py-1 h-auto justify-content-center"> 46 <div class="row mx-0 py-1 h-auto justify-content-center">
45 <p 47 <p
46 [ngClass]="{'text-primary': articulo.PRO, 'text-secondary': !articulo.PRO}" 48 [ngClass]="{'text-primary': articulo.PRO, 'text-secondary': !articulo.PRO}"
47 class="col-12 px-1 h6 h-auto text-center min-h-60"> 49 class="col-12 px-1 h6 h-auto text-center min-h-60">
48 {{articulo.DetArt | uppercase}} 50 {{articulo.DetArt | uppercase}}
49 </p> 51 </p>
50 <p class="col-12 px-1 h-auto text-center line-height-sm min-h-50"> 52 <p class="col-12 px-1 h-auto text-center line-height-sm min-h-50">
51 <small>{{articulo.DET_LAR}}</small> 53 <small>{{articulo.DET_LAR}}</small>
52 </p> 54 </p>
53 <div class="col-12 px-1 align-self-end h-auto"> 55 <div class="col-12 px-1 align-self-end h-auto">
54 <div 56 <div
55 [ngClass]="{'bg-primary': articulo.PRO, 'bg-secondary': !articulo.PRO}" 57 [ngClass]="{'bg-primary': articulo.PRO, 'bg-secondary': !articulo.PRO}"
56 class="row mx-0 justify-content-between badge-pill"> 58 class="row mx-0 justify-content-between badge-pill">
57 <div class="col px-0 align-self-center text-white text-right"> 59 <div class="col px-0 align-self-center text-white text-right">
58 {{articulo.PreVen | currency}} 60 {{articulo.PreVen | currency}}
59 </div> 61 </div>
60 <div class="col-5 px-0"> 62 <div class="col-5 px-0">
61 <img 63 <img
62 draggable="false" 64 draggable="false"
63 ondragstart="return false;" 65 ondragstart="return false;"
64 (contextmenu)="false" 66 (contextmenu)="false"
65 class="d-block ml-auto py-1 icon-30" 67 class="d-block ml-auto py-1 icon-30"
66 src="assets/img/ir.svg"> 68 src="assets/img/ir.svg">
67 </div> 69 </div>
68 </div> 70 </div>
69 </div> 71 </div>
70 </div> 72 </div>
71 </div> 73 </div>
72 </div> 74 </div>
73 </div> 75 </div>
74 <!-- BOTON VER MAS --> 76 <!-- BOTON VER MAS -->
75 <div class="row mx-0"> 77 <div class="row mx-0">
76 <div 78 <div
77 *ngIf="showQuantity <= auxArticulos.slice(0, showQuantity).length" 79 *ngIf="showQuantity <= auxArticulos.slice(0, showQuantity).length"
78 class="col-12 px-0 mb-2"> 80 class="col-12 px-0 mb-2">
79 <button 81 <button
80 (click)="increaseShow()" 82 (click)="increaseShow()"
81 class="btn btn-block btn-outline-primary"> 83 class="btn btn-block btn-outline-primary">
82 Ver Más 84 Ver Más
83 </button> 85 </button>
84 </div> 86 </div>
85 </div> 87 </div>
86 </div> 88 </div>
87 </div> 89 </div>
88 </div> 90 </div>
89 </div> 91 </div>
90 <!-- FOOTER CARRITO DE COMPRAS --> 92 <!-- FOOTER CARRITO DE COMPRAS -->
91 <div class="row w-90 mx-auto h-auto justify-content-center"> 93 <div class="row w-90 mx-auto h-auto justify-content-center">
92 <div class="h-75 px-0 border border-primary rounded" #boxCarrito 94 <div class="h-75 px-0 border border-primary rounded" #boxCarrito
93 [ngClass]="boxCarrito.classList.contains('media-pantalla') 95 [ngClass]="boxCarrito.classList.contains('media-pantalla')
94 ? 'col-8' : 'col-12'" id="boxCarrito"> 96 ? 'col-8' : 'col-12'" id="boxCarrito">
95 <!-- CABECERA --> 97 <!-- CABECERA -->
96 <div class="row mx-0 h-15 border-bottom border-primary"> 98 <div class="row mx-0 h-15 border-bottom border-primary">
97 <p class="col align-self-center text-truncate"><small>ARTÍCULOS EN TÚ CARRITO DE COMPRAS</small></p> 99 <p class="col align-self-center text-truncate"><small>ARTÍCULOS EN TÚ CARRITO DE COMPRAS</small></p>
98 </div> 100 </div>
99 <!-- CUERPO --> 101 <!-- CUERPO -->
100 <div class="row h-85 mx-0 justify-content-around"> 102 <div class="row h-85 mx-0 justify-content-around">
101 <!-- BOTON SCROLL IZQUIERDA --> 103 <!-- BOTON SCROLL IZQUIERDA -->
102 <div *ngIf="articuloService.carrito.length" class="col-auto btn-effect h-20 align-self-center"> 104 <div *ngIf="articuloService.carrito.length" class="col-auto btn-effect h-20 align-self-center">
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="icon-30 rotate-180-neg" 109 class="icon-30 rotate-180-neg"
108 src="assets/img/ir-fondo-color.svg" 110 src="assets/img/ir-fondo-color.svg"
109 (mousedown)="scrollX(templateCarrito, -100)" 111 (mousedown)="scrollX(templateCarrito, -100)"
110 (mouseup)="mouseup()" 112 (mouseup)="mouseup()"
111 (mouseleave)="mouseup()"> 113 (mouseleave)="mouseup()">
112 </div> 114 </div>
113 <!-- CARRITO --> 115 <!-- CARRITO -->
114 <div class="col-6 col-sm-8 col-lg-10 h-100"> 116 <div class="col-6 col-sm-8 col-lg-10 h-100">
115 <div 117 <div
116 #templateCarrito 118 #templateCarrito
117 class="row flex-row flex-nowrap h-100 mx-0 my-2 scroll-x" 119 class="row flex-row flex-nowrap h-100 mx-0 my-2 scroll-x"
118 (scroll)="scrollEvent($event)"> 120 (scroll)="scrollEvent($event)">
119 <!-- ARTICULOS --> 121 <!-- ARTICULOS -->
120 <div 122 <div
121 class="col-10 col-sm-4 col-lg-2 px-2 px-xl-4 align-self-center border-right border-primary" 123 class="col-10 col-sm-4 col-lg-2 px-2 px-xl-4 align-self-center border-right border-primary"
122 *ngFor="let articulo of articuloService.carrito; let i = index;" 124 *ngFor="let articulo of articuloService.carrito; let i = index;"
123 @EnterLeave> 125 @EnterLeave>
124 <img 126 <img
125 class="btn-effect icon-20 mr-2 position-absolute right-0" 127 class="btn-effect icon-20 mr-2 position-absolute right-0"
126 src="assets/img/icono-cancelar-color.svg" 128 src="assets/img/icono-cancelar-color.svg"
127 (click)="deleteArticulo(i)"> 129 (click)="deleteArticulo(i)">
128 <img 130 <img
129 draggable="false" 131 draggable="false"
130 ondragstart="return false;" 132 ondragstart="return false;"
131 (contextmenu)="false" 133 (contextmenu)="false"
132 class="d-block img-fluid p-2 mx-auto rounded w-100 h-auto" 134 class="d-block img-fluid p-2 mx-auto rounded w-100 h-auto"
133 src="{{urlImagenes}}{{articulo.imagenes[0].imagen}}" 135 src="{{urlImagenes}}{{articulo.imagenes[0].imagen}}"
134 onerror="this.src='assets/img/image-not-found.jpg'"> 136 onerror="this.src='assets/img/image-not-found.jpg'">
135 <p class="d-block mt-auto text-center text-primary text-truncate"> 137 <p class="d-block mt-auto text-center text-primary text-truncate">
136 <small>{{articulo.DetArt}}</small> 138 <small>{{articulo.DetArt}}</small>
137 </p> 139 </p>
138 <app-articulo-cantidad [articulo]="articulo"></app-articulo-cantidad> 140 <app-articulo-cantidad [articulo]="articulo"></app-articulo-cantidad>
139 </div> 141 </div>
140 <!-- MENSAJE DE ADVERTENCIA --> 142 <!-- MENSAJE DE ADVERTENCIA -->
141 <div *ngIf="!articuloService.carrito.length" class="col h-100"> 143 <div *ngIf="!articuloService.carrito.length" class="col h-100">
142 <p class="text-center py-5">No hay articulos en el carrito</p> 144 <p class="text-center py-5">No hay articulos en el carrito</p>
143 </div> 145 </div>
144 </div> 146 </div>
145 </div> 147 </div>
146 <!-- BOTON SCROLL DERECHA --> 148 <!-- BOTON SCROLL DERECHA -->
147 <div *ngIf="articuloService.carrito.length" class="col-auto btn-effect 149 <div *ngIf="articuloService.carrito.length" class="col-auto btn-effect
148 h-20 align-self-center d-contents"> 150 h-20 align-self-center d-contents">
149 <img 151 <img
150 draggable="false" 152 draggable="false"
151 ondragstart="return false;" 153 ondragstart="return false;"
152 (contextmenu)="false" 154 (contextmenu)="false"
153 class="icon-30" 155 class="icon-30"
154 src="assets/img/ir-fondo-color.svg" 156 src="assets/img/ir-fondo-color.svg"
155 (mousedown)="scrollX(templateCarrito, 100)" 157 (mousedown)="scrollX(templateCarrito, 100)"
156 (mouseup)="mouseup()" 158 (mouseup)="mouseup()"
157 (mouseleave)="mouseup()"> 159 (mouseleave)="mouseup()">
158 </div> 160 </div>
159 </div> 161 </div>
160 </div> 162 </div>
161 <!-- TOTAL--> 163 <!-- TOTAL-->
162 <div 164 <div
163 class="col-auto mt-2 ml-auto h-20"> 165 class="col-auto mt-2 ml-auto h-20">
164 <div class="row mx-0"> 166 <div class="row mx-0">
165 <div class="col-auto align-self-center text-primary">TOTAL</div> 167 <div class="col-auto align-self-center text-primary">TOTAL</div>
166 <div class="col-auto bg-primary badge-pill"> 168 <div class="col-auto bg-primary badge-pill">
167 <p class="text-center text-white mt-1 py-1">{{articuloService.subTotal | currency}}</p> 169 <p class="text-center text-white mt-1 py-1">{{articuloService.subTotal | currency}}</p>
168 </div> 170 </div>
169 </div> 171 </div>
170 </div> 172 </div>
171 173
172 <!-- VER CARRITO --> 174 <!-- VER CARRITO -->
173 <div 175 <div
174 class="col-auto px-0 mt-2 h-20" 176 class="col-auto px-0 mt-2 h-20"
175 *ngIf="articuloService.carrito.length" 177 *ngIf="articuloService.carrito.length"
176 [ngClass]="{'ml-auto pb-3' : boxCarrito.classList.contains('media-pantalla')}"> 178 [ngClass]="{'ml-auto pb-3' : boxCarrito.classList.contains('media-pantalla')}">
177 <div 179 <div
178 class="btn-effect col-auto px-0 align-self-center bg-white" 180 class="btn-effect col-auto px-0 align-self-center bg-white"
179 [routerLink]="['/carrito']"> 181 [routerLink]="['/carrito']">
180 <div class="row mx-0 bg-light"> 182 <div class="row mx-0 bg-light">
181 <div class="col-auto p-0 bg-primary"> 183 <div class="col-auto p-0 bg-primary">
182 <img 184 <img
183 draggable="false" 185 draggable="false"
184 ondragstart="return false;" 186 ondragstart="return false;"
185 (contextmenu)="false" 187 (contextmenu)="false"
186 class="p-2 icon-40" 188 class="p-2 icon-40"
187 src="assets/img/carrito.svg"> 189 src="assets/img/carrito.svg">
188 </div> 190 </div>
189 <div class="col-auto align-self-center text-primary d-none d-sm-block">IR AL CARRITO</div> 191 <div class="col-auto align-self-center text-primary d-none d-sm-block">IR AL CARRITO</div>
190 </div> 192 </div>
191 </div> 193 </div>
192 </div> 194 </div>
193 195
194 </div> 196 </div>
195 </div> 197 </div>
196 198
197 </div> 199 </div>
198 200
src/app/shared/header-publicidad/header-publicidad.component.html
1 <div class="row mx-0 h-20" id="headerPublicidad"> 1 <div class="row mx-0" id="headerPublicidad" #headerPublicidad
2 [ngClass]="headerPublicidad.classList.contains('media-pantalla')
3 ? 'h-31' : 'h-20'" id="boxCarrito">
2 <div class="col-12 p-3 h-100" id="headerPad"> 4 <div class="col-12 p-3 h-100" id="headerPad">
3 <div class="h-100"> 5 <div class="h-100">
4 <carousel [showIndicators]="false" [interval]="4000"> 6 <carousel [showIndicators]="false" [interval]="4000">
5 <slide *ngFor="let p of publicidades"> 7 <slide *ngFor="let p of publicidades">
6 <img 8 <img
7 class="h-100 w-100" 9 class="h-100 w-100"
8 draggable="false" 10 draggable="false"
9 ondragstart="return false;" 11 ondragstart="return false;"
10 (contextmenu)="false" 12 (contextmenu)="false"
11 src="{{urlImagenes}}{{p.imagen}}" 13 src="{{urlImagenes}}{{p.imagen}}"
12 (click)="elegirArticulo(p)"> 14 (click)="elegirArticulo(p)">
13 </slide> 15 </slide>
14 </carousel> 16 </carousel>
15 </div> 17 </div>
16 </div> 18 </div>
17 </div> 19 </div>
18 20
src/app/shared/header-publicidad/header-publicidad.component.scss
1 #headerPublicidad.media-pantalla { 1 #headerPublicidad.media-pantalla {
2 max-height: 18% !important; 2 max-height: 280px !important;
3 padding-bottom: 0 !important; 3 padding-bottom: 0 !important;
4 } 4 }
5 5
6 #headerPad.media-pantalla { 6 #headerPad.media-pantalla {
7 padding: 0.3rem !important; 7 padding: 0 1rem !important;
8 } 8 }
9 9
1 @import "scss/styles-bootstrap.scss"; 1 @import "scss/styles-bootstrap.scss";
2 @import "scss/typography.scss"; 2 @import "scss/typography.scss";
3 @import "scss/height-width.scss"; 3 @import "scss/height-width.scss";
4 @import "scss/animations.scss"; 4 @import "scss/animations.scss";
5 @import "scss/icons.scss"; 5 @import "scss/icons.scss";
6 @import "scss/scroll.scss"; 6 @import "scss/scroll.scss";
7 @import "node_modules/bootstrap/scss/_variables.scss"; 7 @import "node_modules/bootstrap/scss/_variables.scss";
8 8
9 @font-face { 9 @font-face {
10 font-family: "Gotham"; 10 font-family: "Gotham";
11 font-style: normal; 11 font-style: normal;
12 font-weight: normal; 12 font-weight: normal;
13 src: url("assets/fonts/gotham-medium.woff") format("woff"); 13 src: url("assets/fonts/gotham-medium.woff") format("woff");
14 } 14 }
15 15
16 html, 16 html,
17 body { 17 body {
18 max-height: 100vh; 18 max-height: 100vh;
19 height: 100%; 19 height: 100%;
20 font-family: "Gotham"; 20 font-family: "Gotham";
21 overflow: hidden; 21 overflow: hidden;
22 user-select: none; 22 user-select: none;
23 } 23 }
24 24
25 body.media-pantalla { 25 body.media-pantalla {
26 height: 50% !important; 26 height: calc(50%) !important;
27 position: absolute; 27 position: absolute;
28 bottom: 0; 28 bottom: 0;
29 width: 100%; 29 width: 100%;
30 background-color: #3d3d3d; 30 background-color: #3d3d3d;
31 } 31 }
32 32
33 .btn-effect { 33 .btn-effect {
34 transition: all 0.3s !important; 34 transition: all 0.3s !important;
35 &:hover { 35 &:hover {
36 cursor: pointer !important; 36 cursor: pointer !important;
37 opacity: 0.7 !important; 37 opacity: 0.7 !important;
38 } 38 }
39 &:active { 39 &:active {
40 transform: scale(1.02) !important; 40 transform: scale(1.02) !important;
41 } 41 }
42 } 42 }
43 43
44 .cursor-pointer { 44 .cursor-pointer {
45 cursor: pointer; 45 cursor: pointer;
46 } 46 }
47 47
48 p { 48 p {
49 margin: 0 !important; 49 margin: 0 !important;
50 } 50 }
51 51
52 .img-in-top { 52 .img-in-top {
53 position: absolute; 53 position: absolute;
54 top: -35px; 54 top: -35px;
55 left: 50%; 55 left: 50%;
56 height: 70px; 56 height: 70px;
57 -webkit-transform: translateX(-50%); 57 -webkit-transform: translateX(-50%);
58 transform: translateX(-50%); 58 transform: translateX(-50%);
59 } 59 }
60 60
61 .right-0 { 61 .right-0 {
62 right: 0; 62 right: 0;
63 } 63 }
64 64
65 .left-0 { 65 .left-0 {
66 left: 0; 66 left: 0;
67 } 67 }
68 68
69 .rotate-45 { 69 .rotate-45 {
70 transform: rotate(45deg); 70 transform: rotate(45deg);
71 } 71 }
72 72
73 .rotate-90 { 73 .rotate-90 {
74 transform: rotate(90deg); 74 transform: rotate(90deg);
75 } 75 }
76 76
77 .rotate-90-neg { 77 .rotate-90-neg {
78 transform: rotate(-90deg); 78 transform: rotate(-90deg);
79 } 79 }
80 80
81 .rotate-180-neg { 81 .rotate-180-neg {
82 transform: rotate(-180deg); 82 transform: rotate(-180deg);
83 } 83 }
84 84
85 .disabled { 85 .disabled {
86 opacity: 0.5; 86 opacity: 0.5;
87 } 87 }
88 88
89 .modal-content.media-pantalla { 89 .modal-content.media-pantalla {
90 margin-top: auto !important; 90 margin-top: auto !important;
91 margin-bottom: 50px !important; 91 margin-bottom: 50px !important;
92 } 92 }
93 93
94 .modal-content { 94 .modal-content {
95 background: transparent !important; 95 background: transparent !important;
96 } 96 }
97 97