Eric Fernandez / wrapper-demo

Download as
Browse Code ยป

Commit 29a1afc3d54595be3d1f750179e75741b3daa016

Authored by Marcelo Puebla
1 parent c52ca1d747
Exists in master

Arrelgo en el uso del efecto hover, en los botones de la botonera principal.

Showing 1 changed file with 10 additions and 77 deletions   Show diff stats
src/sass/_botonera-principal.scss
Diff comments   View file @ 29a1afc
... ... @@ -18,6 +18,7 @@
18 18 height: 90px;
19 19 position: relative;
20 20 width: 90px;
  21 + outline: 0;
21 22 span {
22 23 left: 0;
23 24 position: absolute;
... ... @@ -27,6 +28,14 @@
27 28 font-size: 12px;
28 29 color: #777777;
29 30 }
  31 + &:hover {
  32 + background-color:rgb(250,250,250);
  33 + filter:drop-shadow(4px 4px 4px gray);
  34 + }
  35 + &:active {
  36 + background-color: rgb(230, 230, 230);
  37 + filter:drop-shadow(4px 4px 4px gray);
  38 + }
30 39 }
31 40 &-menu {
32 41 width: 100%;
... ... @@ -80,20 +89,12 @@
80 89 & button {
81 90 background-image: url('../img/control_stock.png');
82 91 background-size: 90px 90px;
83   - &:hover {
84   - background-color: rgb(250,250,250);
85   - filter:drop-shadow(4px 4px 4px gray);
86   - }
87 92 }
88 93 }
89 94 &-logistica {
90 95 & button {
91 96 background-image: url('../img/logistica.png');
92   - background-size: 90px 90px;
93   - &:hover {
94   - background-color: rgb(250,250,250);
95   - filter:drop-shadow(4px 4px 4px gray);
96   - }
  97 + background-size: 90px 90px;
97 98 }
98 99 }
99 100 &-facturador {
... ... @@ -108,164 +109,96 @@
108 109 & button {
109 110 background-image: url('../img/notaPedido.png');
110 111 background-size: 90px 90px;
111   - &:hover {
112   - background-color: rgb(250,250,250);
113   - filter:drop-shadow(4px 4px 4px gray);
114   - }
115 112 }
116 113 }
117 114 &-remito {
118 115 & button {
119 116 background-image: url('../img/remito.png');
120 117 background-size: 90px 90px;
121   - &:hover {
122   - background-color: rgb(250,250,250);
123   - filter:drop-shadow(4px 4px 4px gray);
124   - }
125 118 }
126 119 }
127 120 &-hoja-ruta {
128 121 & button {
129 122 background-image: url('../img/hoja-ruta.png');
130 123 background-size: 86px 90px;
131   - &:hover {
132   - background-color: rgb(250,250,250);
133   - filter:drop-shadow(4px 4px 4px gray);
134   - }
135 124 }
136 125 }
137 126 &-activar-hoja-ruta {
138 127 & button {
139 128 background-image: url('../img/activar_hoja.png');
140 129 background-size: 90px 90px;
141   - &:hover {
142   - background-color: rgb(250,250,250);
143   - filter:drop-shadow(4px 4px 4px gray);
144   - }
145 130 }
146 131 }
147 132 &-hoja-ruta-transportista {
148 133 & button {
149 134 background-image: url('../img/hojaRutaVolante.png');
150 135 background-size: 90px 90px;
151   - &:hover {
152   - background-color: rgb(250,250,250);
153   - filter:drop-shadow(4px 4px 4px gray);
154   - }
155 136 }
156 137 }
157 138 &-seguimiento {
158 139 & button {
159 140 background-image: url('../img/seguimientoNotaPedido.png');
160 141 background-size: 90px 90px;
161   - // background-position: 15px 10px;
162   - &:hover {
163   - background-color: rgb(250,250,250);
164   - filter:drop-shadow(4px 4px 4px gray);
165   - }
166 142 }
167 143 }
168 144 &-seguimiento-hoja-ruta {
169 145 & button {
170 146 background-image: url('../img/seguimientoHojaRuta.png');
171 147 background-size: 90px 90px;
172   - // background-position: 15px 10px;
173   - &:hover {
174   - background-color: rgb(250,250,250);
175   - filter:drop-shadow(4px 4px 4px gray);
176   - }
177 148 }
178 149 }
179 150 &-cobranzas {
180 151 & button {
181 152 background-image: url('../img/cobranzas.png');
182 153 background-size: 90px 90px;
183   - // background-position: 15px 10px;
184   - &:hover {
185   - background-color: rgb(250,250,250);
186   - filter:drop-shadow(4px 4px 4px gray);
187   - }
188 154 }
189 155 }
190 156 &-seguimiento-cobranzas {
191 157 & button {
192 158 background-image: url('../img/seguimientoCobranza.png');
193 159 background-size: 90px 90px;
194   - // background-position: 15px 10px;
195   - &:hover {
196   - background-color: rgb(250,250,250);
197   - filter:drop-shadow(4px 4px 4px gray);
198   - }
199 160 }
200 161 }
201 162 &-vehiculo {
202 163 & button {
203 164 background-image: url('../img/abmVehiculos.png');
204 165 background-size: 90px 90px;
205   - &:hover {
206   - background-color: rgb(250,250,250);
207   - filter:drop-shadow(4px 4px 4px gray);
208   - }
209 166 }
210 167 }
211 168 &-precio-condicion {
212 169 & button {
213 170 background-image: url('../img/abmPrecios.png');
214 171 background-size: 90px 90px;
215   - &:hover {
216   - background-color: rgb(250,250,250);
217   - filter:drop-shadow(4px 4px 4px gray);
218   - }
219 172 }
220 173 }
221 174 &-chofer {
222 175 & button {
223 176 background-image: url('../img/abmChofer.png');
224 177 background-size: 90px 90px;
225   - &:hover {
226   - background-color: rgb(250,250,250);
227   - filter:drop-shadow(4px 4px 4px gray);
228   - }
229 178 }
230 179 }
231 180 &-agendar-visita {
232 181 & button {
233 182 background-image: url('../img/agendarVisita.png');
234 183 background-size: 90px 90px;
235   - &:hover {
236   - box-shadow: 2px;
237   - background-color: rgb(250,250,250);
238   - filter:drop-shadow(4px 4px 4px gray);
239   - }
240 184 }
241 185 }
242 186 &-informes {
243 187 & button {
244 188 background-image: url('../img/informes.png');
245 189 background-size: 90px 90px;
246   - &:hover {
247   - background-color: rgb(250,250,250);filter:drop-shadow(4px 4px 4px gray);
248   - }
249 190 }
250 191 }
251 192 &-vendedor-cobrador {
252 193 & button {
253 194 background-image: url('../img/abmVendedorCobrador.png');
254 195 background-size: 90px 90px;
255   - &:hover {
256   - background-color: rgb(250,250,250);
257   - filter:drop-shadow(4px 4px 4px gray);
258   - }
259 196 }
260 197 }
261 198 &-autorizar-nota {
262 199 & button {
263 200 background-image: url('../img/autorizarNota.png');
264 201 background-size: 90px 90px;
265   - &:hover {
266   - background-color: rgb(250,250,250);
267   - filter:drop-shadow(4px 4px 4px gray);
268   - }
269 202 }
270 203 }
271 204 .swiper-pagination {