PluginProbe
Product Labels, Quick View, Buy Now, Pre-Orders, Frequently Bought Together & More for WooCommerce – Merchant / 2.3.2
Product Labels, Quick View, Buy Now, Pre-Orders, Frequently Bought Together & More for WooCommerce – Merchant v2.3.2
2.3.2 2.3.1 2.3.0 2.2.8 2.2.7 trunk 1.10.0 1.10.1 1.10.2 1.10.3 1.10.4 1.10.5 1.11.0 1.11.1 1.11.2 1.6 1.7 1.8 1.8.1 1.8.2 1.8.3 1.9.0 1.9.1 1.9.10 1.9.11 All 60 releases
merchant / assets / css / modules / quick-view / quick-view.css

quick-view.css in Product Labels, Quick View, Buy Now, Pre-Orders, Frequently Bought Together & More for WooCommerce – Merchant 2.3.2, at assets/css/modules/quick-view/quick-view.css

799 lines 22.9 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 /**
2 * Quick View.
3 *
4 */
5 .woocommerce .product .merchant-quick-view-button {
6 display: -webkit-inline-box !important;
7 display: -ms-inline-flexbox !important;
8 display: inline-flex !important;
9 -webkit-box-pack: center !important;
10 -ms-flex-pack: center !important;
11 justify-content: center !important;
12 -webkit-box-align: center !important;
13 -ms-flex-align: center !important;
14 align-items: center !important;
15 -webkit-transition: all 0.2s;
16 transition: all 0.2s;
17 text-decoration: none !important;
18 -ms-flex-item-align: start;
19 align-self: flex-start;
20 color: var(--mrc-qv-button-text-color, #FFF) !important;
21 border-width: 1px;
22 border-style: solid;
23 border-color: var(--mrc-qv-button-border-color, #212121) !important;
24 background-color: var(--mrc-qv-button-bg-color, #212121) !important;
25 transition: all 0.2s;
26 }
27 .woocommerce .product .merchant-quick-view-button svg + span {
28 display: inline-block;
29 margin-left: 8px;
30 }
31 .woocommerce .product .merchant-quick-view-button svg {
32 width: 1em;
33 height: 1em;
34 fill: var(--mrc-qv-button-icon-color, #FFF) !important;
35 -webkit-transition: all 0.2s;
36 transition: all 0.2s;
37 }
38 .woocommerce .product .merchant-quick-view-button svg path {
39 fill: var(--mrc-qv-button-icon-color, #FFF) !important;
40 }
41 .woocommerce .product .merchant-quick-view-button:hover {
42 color: var(--mrc-qv-button-text-color-hover, #FFF) !important;
43 border-color: var(--mrc-qv-button-border-color-hover, #414141) !important;
44 background-color: var(--mrc-qv-button-bg-color-hover, #414141) !important;
45 }
46 .woocommerce .product .merchant-quick-view-button:hover svg {
47 fill: var(--mrc-qv-button-icon-color-hover, #FFF) !important;
48 }
49 .woocommerce .product .merchant-quick-view-button:hover svg path {
50 fill: var(--mrc-qv-button-icon-color-hover, #FFF) !important;
51 }
52
53 .products .product {
54 position: relative;
55 }
56 .products .product .merchant-quick-view-position-overlay {
57 position: absolute;
58 z-index: 10;
59 margin: 0 !important;
60 white-space: nowrap !important;
61 opacity: 0;
62 -webkit-transition: all 0.2s;
63 transition: all 0.2s;
64 top: var(--mrc-qv-button-position-top, 50%);
65 left: var(--mrc-qv-button-position-left, 50%);
66 -webkit-transform: translate(calc(var(--mrc-qv-button-position-top, 50%) * -1), calc(var(--mrc-qv-button-position-left, 50%) * -1)) !important;
67 transform: translate(calc(var(--mrc-qv-button-position-top, 50%) * -1), calc(var(--mrc-qv-button-position-left, 50%) * -1)) !important;
68 }
69 @media (max-width: 768px) {
70 .products .product .merchant-quick-view-position-overlay.merchant-quick-view-position-has-mobile-position {
71 top: var(--mrc-qv-button-position-top-mobile, 50%);
72 left: var(--mrc-qv-button-position-left-mobile, 50%);
73 -webkit-transform: translate(calc(var(--mrc-qv-button-position-top-mobile, 50%) * -1), calc(var(--mrc-qv-button-position-left-mobile, 50%) * -1)) !important;
74 transform: translate(calc(var(--mrc-qv-button-position-top-mobile, 50%) * -1), calc(var(--mrc-qv-button-position-left-mobile, 50%) * -1)) !important;
75 }
76 }
77 .products .product:hover .merchant-quick-view-position-overlay {
78 opacity: 1;
79 }
80
81 .merchant-quick-view-modal {
82 position: fixed;
83 z-index: 999;
84 top: 0;
85 left: 0;
86 right: 0;
87 bottom: 0;
88 display: -webkit-box;
89 display: -ms-flexbox;
90 display: flex;
91 -webkit-box-align: center;
92 -ms-flex-align: center;
93 align-items: center;
94 -webkit-box-pack: center;
95 -ms-flex-pack: center;
96 justify-content: center;
97 opacity: 0;
98 visibility: hidden;
99 pointer-events: none;
100 -webkit-transition: all 0.3s ease;
101 transition: all 0.3s ease;
102 }
103 .merchant-quick-view-modal.merchant-show {
104 opacity: 1;
105 visibility: visible;
106 pointer-events: auto;
107 }
108 .merchant-quick-view-modal.merchant-loading .merchant-quick-view-loader {
109 opacity: 1;
110 visibility: visible;
111 }
112 .merchant-quick-view-modal .merchant-freespb-wrapper {
113 display: none;
114 }
115
116 body.admin-bar .merchant-quick-view-modal {
117 top: 32px;
118 }
119 @media (max-width: 782px) {
120 body.admin-bar .merchant-quick-view-modal {
121 top: 46px;
122 }
123 }
124
125 .merchant-quick-view-overlay {
126 position: absolute;
127 z-index: 1;
128 top: 0;
129 left: 0;
130 right: 0;
131 bottom: 0;
132 background-color: rgba(0, 0, 0, 0.9);
133 }
134
135 .merchant-quick-view-loader {
136 position: absolute;
137 top: 50%;
138 right: 50%;
139 -webkit-transform: translate(50%, -50%);
140 transform: translate(50%, -50%);
141 z-index: 5;
142 display: -webkit-box;
143 display: -ms-flexbox;
144 display: flex;
145 font-size: 26px;
146 opacity: 0;
147 visibility: hidden;
148 }
149 .merchant-quick-view-loader svg {
150 width: 1em;
151 height: 1em;
152 fill: #212121;
153 -webkit-animation: merchant-fa-spin 0.75s linear infinite;
154 animation: merchant-fa-spin 0.75s linear infinite;
155 }
156
157 .merchant-quick-view-inner {
158 position: relative;
159 z-index: 3;
160 width: var(--mrc-qv-modal-width, 1000px);
161 min-height: var(--mrc-qv-modal-height, 500px);
162 max-height: var(--mrc-qv-modal-height, 500px);
163 max-width: 90vw;
164 padding: 35px;
165 background-color: #FFF;
166 opacity: 0;
167 visibility: hidden;
168 -webkit-transition: opacity 0.3s ease, visibility 0.3s ease;
169 transition: opacity 0.3s ease, visibility 0.3s ease;
170 }
171 .merchant-quick-view-inner.merchant-show {
172 opacity: 1;
173 visibility: visible;
174 }
175
176 .merchant-quick-view-close-button {
177 position: absolute;
178 z-index: 1;
179 right: -7px;
180 top: -32px;
181 width: 30px;
182 height: 30px;
183 font-size: 24px;
184 display: -webkit-box;
185 display: -ms-flexbox;
186 display: flex;
187 -webkit-box-align: center;
188 -ms-flex-align: center;
189 align-items: center;
190 -webkit-box-pack: center;
191 -ms-flex-pack: center;
192 justify-content: center;
193 }
194 .merchant-quick-view-close-button svg {
195 width: 1em;
196 height: 1em;
197 fill: #fff;
198 }
199
200 .merchant-quick-view-layout-side-panel {
201 -webkit-box-align: stretch !important;
202 -ms-flex-align: stretch !important;
203 align-items: stretch !important;
204 -webkit-box-pack: end !important;
205 -ms-flex-pack: end !important;
206 justify-content: flex-end !important;
207 }
208 .merchant-quick-view-layout-side-panel .merchant-quick-view-inner {
209 width: var(--mrc-qv-panel-width, 420px);
210 max-width: 90vw;
211 height: 100vh;
212 max-height: 100vh;
213 margin: 0;
214 overflow-y: auto;
215 display: -webkit-box;
216 display: -ms-flexbox;
217 display: flex;
218 -webkit-box-orient: vertical;
219 -webkit-box-direction: normal;
220 -ms-flex-direction: column;
221 flex-direction: column;
222 -webkit-transform: translateX(100%);
223 transform: translateX(100%);
224 -webkit-transition: opacity 0.3s ease, -webkit-transform 0.3s ease;
225 transition: opacity 0.3s ease, -webkit-transform 0.3s ease;
226 transition: transform 0.3s ease, opacity 0.3s ease;
227 transition: transform 0.3s ease, opacity 0.3s ease, -webkit-transform 0.3s ease;
228 }
229 .merchant-quick-view-layout-side-panel .merchant-quick-view-inner.merchant-show {
230 -webkit-transform: translateX(0);
231 transform: translateX(0);
232 }
233 .merchant-quick-view-layout-side-panel .merchant-quick-view-header {
234 -webkit-box-flex: 0;
235 -ms-flex: none;
236 flex: none;
237 display: -webkit-box;
238 display: -ms-flexbox;
239 display: flex;
240 -webkit-box-align: center;
241 -ms-flex-align: center;
242 align-items: center;
243 -webkit-box-pack: end;
244 -ms-flex-pack: end;
245 justify-content: flex-end;
246 gap: 10px;
247 padding-bottom: 15px;
248 margin-bottom: 15px;
249 border-bottom: 1px solid #eee;
250 }
251 .merchant-quick-view-layout-side-panel .merchant-quick-view-content {
252 display: -webkit-box;
253 display: -ms-flexbox;
254 display: flex;
255 -webkit-box-orient: vertical;
256 -webkit-box-direction: normal;
257 -ms-flex-direction: column;
258 flex-direction: column;
259 -webkit-box-flex: 1;
260 -ms-flex: 1;
261 flex: 1;
262 min-height: 0;
263 }
264 .merchant-quick-view-layout-side-panel .merchant-quick-view-content > div {
265 display: -webkit-box;
266 display: -ms-flexbox;
267 display: flex;
268 -webkit-box-orient: vertical;
269 -webkit-box-direction: normal;
270 -ms-flex-direction: column;
271 flex-direction: column;
272 -webkit-box-flex: 1;
273 -ms-flex: 1;
274 flex: 1;
275 min-height: 0;
276 }
277 .merchant-quick-view-layout-side-panel .merchant-quick-view-row {
278 -webkit-box-orient: vertical;
279 -webkit-box-direction: normal;
280 -ms-flex-direction: column;
281 flex-direction: column;
282 -webkit-box-flex: 1;
283 -ms-flex: 1;
284 flex: 1;
285 min-height: 0;
286 }
287 .merchant-quick-view-layout-side-panel .merchant-quick-view-column {
288 -webkit-box-flex: 0;
289 -ms-flex: none;
290 flex: none;
291 width: 100%;
292 }
293 .merchant-quick-view-layout-side-panel .merchant-quick-view-column:last-child {
294 display: -webkit-box;
295 display: -ms-flexbox;
296 display: flex;
297 -webkit-box-orient: vertical;
298 -webkit-box-direction: normal;
299 -ms-flex-direction: column;
300 flex-direction: column;
301 -webkit-box-flex: 1;
302 -ms-flex: 1;
303 flex: 1;
304 min-height: 0;
305 }
306 .merchant-quick-view-layout-side-panel .merchant-quick-view-summary {
307 -webkit-box-flex: 1;
308 -ms-flex: 1;
309 flex: 1;
310 min-height: 0;
311 max-height: none;
312 overflow-y: auto;
313 }
314 .merchant-quick-view-layout-side-panel .merchant-quick-view-close-button,
315 .merchant-quick-view-layout-side-panel .merchant-quick-view-nav-prev,
316 .merchant-quick-view-layout-side-panel .merchant-quick-view-nav-next {
317 position: relative;
318 top: 0;
319 left: 0;
320 right: 0;
321 -webkit-transform: none;
322 transform: none;
323 width: 30px;
324 height: 30px;
325 background-color: transparent;
326 border-radius: 6px;
327 -webkit-transition: background-color 0.15s ease;
328 transition: background-color 0.15s ease;
329 }
330 .merchant-quick-view-layout-side-panel .merchant-quick-view-close-button svg,
331 .merchant-quick-view-layout-side-panel .merchant-quick-view-nav-prev svg,
332 .merchant-quick-view-layout-side-panel .merchant-quick-view-nav-next svg {
333 width: 18px;
334 height: 18px;
335 fill: #212121;
336 }
337 .merchant-quick-view-layout-side-panel .merchant-quick-view-close-button:hover,
338 .merchant-quick-view-layout-side-panel .merchant-quick-view-nav-prev:hover,
339 .merchant-quick-view-layout-side-panel .merchant-quick-view-nav-next:hover {
340 background-color: #f5f5f5;
341 }
342 .merchant-quick-view-layout-side-panel .merchant-quick-view-nav-next {
343 margin-right: auto;
344 }
345
346 body.admin-bar .merchant-quick-view-layout-side-panel .merchant-quick-view-inner {
347 height: calc(100vh - 32px);
348 }
349 @media (max-width: 782px) {
350 body.admin-bar .merchant-quick-view-layout-side-panel .merchant-quick-view-inner {
351 height: calc(100vh - 46px);
352 }
353 }
354
355 .merchant-quick-view-nav-prev,
356 .merchant-quick-view-nav-next {
357 position: absolute;
358 z-index: 4;
359 top: 50%;
360 -webkit-transform: translateY(-50%);
361 transform: translateY(-50%);
362 width: 48px;
363 height: 48px;
364 display: none;
365 -webkit-box-align: center;
366 -ms-flex-align: center;
367 align-items: center;
368 -webkit-box-pack: center;
369 -ms-flex-pack: center;
370 justify-content: center;
371 background-color: rgba(255, 255, 255, 0.1);
372 border-radius: 50%;
373 -webkit-transition: background-color 0.2s;
374 transition: background-color 0.2s;
375 }
376 .merchant-quick-view-nav-prev.merchant-quick-view-nav-visible,
377 .merchant-quick-view-nav-next.merchant-quick-view-nav-visible {
378 display: -webkit-box;
379 display: -ms-flexbox;
380 display: flex;
381 }
382 .merchant-quick-view-nav-prev svg,
383 .merchant-quick-view-nav-next svg {
384 width: 24px;
385 height: 24px;
386 fill: #fff;
387 }
388 .merchant-quick-view-nav-prev:hover,
389 .merchant-quick-view-nav-next:hover {
390 background-color: rgba(255, 255, 255, 0.2);
391 }
392
393 .merchant-quick-view-nav-prev {
394 left: -65px;
395 }
396 @media (max-width: 768px) {
397 .merchant-quick-view-nav-prev {
398 left: 10px;
399 }
400 }
401
402 .merchant-quick-view-nav-next {
403 right: -65px;
404 }
405 @media (max-width: 768px) {
406 .merchant-quick-view-nav-next {
407 right: 10px;
408 }
409 }
410
411 @-webkit-keyframes merchant-fa-spin {
412 0% {
413 -webkit-transform: rotate(0deg);
414 transform: rotate(0deg);
415 }
416 to {
417 -webkit-transform: rotate(1turn);
418 transform: rotate(1turn);
419 }
420 }
421
422 @keyframes merchant-fa-spin {
423 0% {
424 -webkit-transform: rotate(0deg);
425 transform: rotate(0deg);
426 }
427 to {
428 -webkit-transform: rotate(1turn);
429 transform: rotate(1turn);
430 }
431 }
432 .merchant-quick-view-row {
433 display: -webkit-box;
434 display: -ms-flexbox;
435 display: flex;
436 grid-gap: 30px;
437 }
438
439 .merchant-quick-view-column {
440 -webkit-box-flex: 1;
441 -ms-flex: 1;
442 flex: 1;
443 width: 50%;
444 }
445
446 .merchant-quick-view-product-gallery .woocommerce-product-gallery__image {
447 max-height: calc(var(--mrc-qv-modal-height, 500px) - 70px);
448 }
449 .merchant-quick-view-product-gallery .woocommerce-product-gallery__image img {
450 max-height: calc(var(--mrc-qv-modal-height, 500px) - 70px);
451 }
452 .merchant-quick-view-product-gallery .woocommerce-product-gallery {
453 width: 100% !important;
454 float: none !important;
455 margin: 0 !important;
456 }
457
458 .merchant-quick-view-product-gallery .flex-control-thumbs::-webkit-scrollbar {
459 width: 6px;
460 }
461 .merchant-quick-view-product-gallery .flex-control-thumbs::-webkit-scrollbar-track {
462 background: #ddd;
463 border-radius: 6px;
464 }
465 .merchant-quick-view-product-gallery .flex-control-thumbs::-webkit-scrollbar-thumb {
466 background: #999;
467 border-radius: 6px;
468 }
469 .merchant-quick-view-product-gallery .flex-control-thumbs::-webkit-scrollbar-thumb:hover {
470 background: #000;
471 }
472 .merchant-quick-view-product-gallery .flex-control-thumbs li {
473 display: -webkit-box !important;
474 display: -ms-flexbox !important;
475 display: flex !important;
476 margin: 0 !important;
477 width: auto !important;
478 }
479 .merchant-quick-view-product-gallery .flex-control-thumbs li img {
480 width: 60px !important;
481 }
482
483 .merchant-quick-view-thumbs-at-left .woocommerce-product-gallery {
484 display: -webkit-box !important;
485 display: -ms-flexbox !important;
486 display: flex !important;
487 grid-gap: 5px !important;
488 -webkit-box-orient: horizontal !important;
489 -webkit-box-direction: reverse !important;
490 -ms-flex-direction: row-reverse !important;
491 flex-direction: row-reverse !important;
492 }
493 .merchant-quick-view-thumbs-at-left .woocommerce-product-gallery .flex-control-thumbs {
494 padding-right: 5px !important;
495 -ms-flex-negative: 0 !important;
496 flex-shrink: 0 !important;
497 display: -webkit-box !important;
498 display: -ms-flexbox !important;
499 display: flex !important;
500 grid-gap: 10px !important;
501 -webkit-box-orient: vertical !important;
502 -webkit-box-direction: normal !important;
503 -ms-flex-direction: column !important;
504 flex-direction: column !important;
505 margin: 0 !important;
506 overflow-y: auto !important;
507 max-height: calc(var(--mrc-qv-modal-height, 500px) - 70px) !important;
508 }
509
510 .merchant-quick-view-thumbs-at-right .woocommerce-product-gallery {
511 display: -webkit-box !important;
512 display: -ms-flexbox !important;
513 display: flex !important;
514 grid-gap: 5px !important;
515 -webkit-box-orient: horizontal;
516 -webkit-box-direction: normal;
517 -ms-flex-direction: row;
518 flex-direction: row;
519 }
520 .merchant-quick-view-thumbs-at-right .woocommerce-product-gallery .woocommerce-product-gallery__trigger {
521 display: none !important;
522 }
523 .merchant-quick-view-thumbs-at-right .woocommerce-product-gallery .flex-control-thumbs {
524 padding-right: 5px !important;
525 -ms-flex-negative: 0 !important;
526 flex-shrink: 0 !important;
527 display: -webkit-box !important;
528 display: -ms-flexbox !important;
529 display: flex !important;
530 grid-gap: 10px !important;
531 -webkit-box-orient: vertical !important;
532 -webkit-box-direction: normal !important;
533 -ms-flex-direction: column !important;
534 flex-direction: column !important;
535 margin: 0 !important;
536 overflow-y: auto !important;
537 max-height: calc(var(--mrc-qv-modal-height, 500px) - 70px) !important;
538 }
539
540 .merchant-quick-view-thumbs-at-bottom .woocommerce-product-gallery {
541 display: -webkit-box !important;
542 display: -ms-flexbox !important;
543 display: flex !important;
544 grid-gap: 10px !important;
545 -webkit-box-orient: vertical !important;
546 -webkit-box-direction: normal !important;
547 -ms-flex-direction: column !important;
548 flex-direction: column !important;
549 max-height: calc(var(--mrc-qv-modal-height, 500px) - 70px) !important;
550 }
551 .merchant-quick-view-thumbs-at-bottom .woocommerce-product-gallery .flex-control-thumbs {
552 -ms-flex-negative: 0 !important;
553 flex-shrink: 0 !important;
554 display: -webkit-box !important;
555 display: -ms-flexbox !important;
556 display: flex !important;
557 -ms-flex-wrap: wrap !important;
558 flex-wrap: wrap !important;
559 grid-gap: 10px !important;
560 margin: 0 !important;
561 }
562
563 .merchant-quick-view-summary {
564 display: -webkit-box;
565 display: -ms-flexbox;
566 display: flex;
567 -ms-flex-wrap: nowrap;
568 flex-wrap: nowrap;
569 grid-gap: 10px;
570 -webkit-box-orient: vertical;
571 -webkit-box-direction: normal;
572 -ms-flex-direction: column;
573 flex-direction: column;
574 max-height: calc(var(--mrc-qv-modal-height, 500px) - 70px);
575 overflow-y: auto;
576 padding-right: 12px;
577 scrollbar-color: #444 #ddd;
578 }
579 .merchant-quick-view-summary .woocommerce-variation-price,
580 .merchant-quick-view-summary .merchant-quick-view-product-price {
581 color: var(--mrc-qv-modal-regular-price-color, #999999);
582 }
583 .merchant-quick-view-summary .woocommerce-variation-price del,
584 .merchant-quick-view-summary .merchant-quick-view-product-price del {
585 color: var(--mrc-qv-modal-regular-price-color, #999999);
586 }
587 .merchant-quick-view-summary .woocommerce-variation-price ins,
588 .merchant-quick-view-summary .merchant-quick-view-product-price ins {
589 color: var(--mrc-qv-modal-sale-price-color, #212121);
590 margin: 0;
591 font-size: 24px;
592 }
593 .merchant-quick-view-summary .woocommerce-variation-price span,
594 .merchant-quick-view-summary .woocommerce-variation-price strong,
595 .merchant-quick-view-summary .merchant-quick-view-product-price span,
596 .merchant-quick-view-summary .merchant-quick-view-product-price strong {
597 color: inherit;
598 }
599 .merchant-quick-view-summary form.cart,
600 .merchant-quick-view-summary .woocommerce-variation-add-to-cart {
601 display: -webkit-box;
602 display: -ms-flexbox;
603 display: flex;
604 grid-gap: 10px;
605 -ms-flex-wrap: wrap;
606 flex-wrap: wrap;
607 margin: 0 !important;
608 }
609 .merchant-quick-view-summary form.cart > *,
610 .merchant-quick-view-summary .woocommerce-variation-add-to-cart > * {
611 -ms-flex-item-align: inherit !important;
612 align-self: inherit !important;
613 justify-self: inherit !important;
614 margin: 0 !important;
615 }
616 .merchant-quick-view-summary .quantity {
617 margin: 0;
618 width: auto;
619 }
620 .merchant-quick-view-summary > div:empty {
621 display: none;
622 }
623 .merchant-quick-view-summary::-webkit-scrollbar {
624 width: 6px;
625 }
626 .merchant-quick-view-summary::-webkit-scrollbar-track {
627 background: #ddd;
628 border-radius: 6px;
629 }
630 .merchant-quick-view-summary::-webkit-scrollbar-thumb {
631 background: #999;
632 border-radius: 6px;
633 }
634 .merchant-quick-view-summary::-webkit-scrollbar-thumb:hover {
635 background: #000;
636 }
637
638 .merchant-quick-view-product-title h1.product_title {
639 margin: 0;
640 font-size: 32px;
641 font-weight: bold;
642 line-height: 1.2;
643 }
644
645 .merchant-quick-view-product-rating .star-rating {
646 margin-left: 0;
647 }
648
649 .merchant-quick-view-product-excerpt p:last-child {
650 margin-bottom: 0;
651 }
652
653 .merchant-quick-view-product-add-to-cart {
654 margin: 10px 0;
655 padding: 20px 0;
656 border-top: 1px solid #eee;
657 border-bottom: 1px solid #eee;
658 }
659 .merchant-quick-view-product-add-to-cart .button {
660 text-decoration: none;
661 }
662 .merchant-quick-view-product-add-to-cart .button:hover {
663 text-decoration: none;
664 }
665 .merchant-quick-view-product-add-to-cart .disabled {
666 -webkit-user-select: none;
667 -moz-user-select: none;
668 -ms-user-select: none;
669 user-select: none;
670 pointer-events: none;
671 }
672
673 .merchant-hide-quantity .quantity {
674 display: none !important;
675 }
676
677 .merchant-quick-view-product-meta .product_meta {
678 display: -webkit-box;
679 display: -ms-flexbox;
680 display: flex;
681 grid-gap: 5px;
682 -webkit-box-orient: vertical;
683 -webkit-box-direction: normal;
684 -ms-flex-direction: column;
685 flex-direction: column;
686 }
687 .merchant-quick-view-product-meta .product_meta span {
688 font-weight: bold;
689 }
690 .merchant-quick-view-product-meta .product_meta span a,
691 .merchant-quick-view-product-meta .product_meta span span {
692 font-weight: normal;
693 }
694
695 @media (max-width: 1024px) and (min-width: 769px) {
696 .merchant-quick-view-inner {
697 padding-inline: 25px;
698 }
699 .merchant-quick-view-row {
700 grid-gap: 20px;
701 }
702 .merchant-quick-view-column:first-child {
703 width: 40%;
704 }
705 .merchant-quick-view-column:last-child {
706 width: 60%;
707 }
708 }
709 @media (max-width: 768px) {
710 .merchant-quick-view-row {
711 -webkit-box-orient: vertical;
712 -webkit-box-direction: normal;
713 -ms-flex-direction: column;
714 flex-direction: column;
715 }
716 .merchant-quick-view-column {
717 width: 100%;
718 }
719 .merchant-quick-view-content {
720 max-height: 100%;
721 overflow-y: auto;
722 overflow-x: hidden;
723 }
724 .merchant-quick-view-inner {
725 padding: 15px;
726 max-width: 80vw;
727 max-height: 85vh;
728 height: 85vh;
729 }
730 .merchant-quick-view-modal {
731 -webkit-box-align: start;
732 -ms-flex-align: start;
733 align-items: flex-start;
734 padding-top: 7vh;
735 }
736 .merchant-quick-view-summary {
737 max-height: none;
738 overflow: hidden;
739 }
740 .merchant-quick-view-product-gallery .woocommerce-product-gallery__image {
741 max-height: none;
742 }
743 .merchant-quick-view-product-gallery .woocommerce-product-gallery__image img {
744 max-height: none;
745 }
746 .merchant-quick-view-thumbs-at-left .woocommerce-product-gallery,
747 .merchant-quick-view-thumbs-at-right .woocommerce-product-gallery {
748 display: -webkit-box !important;
749 display: -ms-flexbox !important;
750 display: flex !important;
751 grid-gap: 10px !important;
752 -webkit-box-orient: vertical !important;
753 -webkit-box-direction: normal !important;
754 -ms-flex-direction: column !important;
755 flex-direction: column !important;
756 }
757 .merchant-quick-view-thumbs-at-left .woocommerce-product-gallery .flex-control-thumbs,
758 .merchant-quick-view-thumbs-at-right .woocommerce-product-gallery .flex-control-thumbs {
759 -ms-flex-negative: 0 !important;
760 flex-shrink: 0 !important;
761 display: -webkit-box !important;
762 display: -ms-flexbox !important;
763 display: flex !important;
764 -ms-flex-wrap: wrap !important;
765 flex-wrap: wrap !important;
766 -webkit-box-orient: horizontal !important;
767 -webkit-box-direction: normal !important;
768 -ms-flex-direction: row !important;
769 flex-direction: row !important;
770 grid-gap: 10px !important;
771 margin: 0 !important;
772 padding: 0 !important;
773 overflow: hidden !important;
774 max-height: none !important;
775 }
776 .merchant-quick-view-thumbs-at-bottom .woocommerce-product-gallery {
777 max-height: none !important;
778 }
779 .merchant-quick-view-layout-side-panel {
780 -webkit-box-pack: center !important;
781 -ms-flex-pack: center !important;
782 justify-content: center !important;
783 -webkit-box-align: end !important;
784 -ms-flex-align: end !important;
785 align-items: flex-end !important;
786 }
787 .merchant-quick-view-layout-side-panel .merchant-quick-view-inner {
788 width: 100%;
789 max-width: 100%;
790 height: 85vh;
791 max-height: 85vh;
792 -webkit-transform: translateY(100%);
793 transform: translateY(100%);
794 }
795 .merchant-quick-view-layout-side-panel .merchant-quick-view-inner.merchant-show {
796 -webkit-transform: translateY(0);
797 transform: translateY(0);
798 }
799 }