457. Araxis Merge File Comparison Report

Produced by Araxis Merge on 2021-05-13 09:09:32 +0000. See www.araxis.com for information about Merge. This report uses XHTML and CSS2, and is best viewed with a modern standards-compliant browser. For optimum results when printing this report, use landscape orientation and enable printing of background images and colours in your browser.

457.1 Files compared

#LocationFileLast Modified
1/Applications/Ampps/www/Porto 3.2.2/Theme Files/Magento 2.x/Porto Theme/app/design/frontend/Smartwave/porto_rtl/WeltPixel_Quickview/web/cssmagnific-popup.css2016-10-17 23:00:52 +0000
2/Applications/Ampps/www/Porto v4.0.0/Theme Files/Magento 2.x/Porto Theme/app/design/frontend/Smartwave/porto_rtl/WeltPixel_Quickview/web/cssmagnific-popup.css2021-02-04 03:27:40 +0000

457.2 Comparison summary

DescriptionBetween
Files 1 and 2
Text BlocksLines
Unchanged4754
Changed311
Inserted00
Removed00

457.3 Comparison options

WhitespaceConsecutive whitespace is treated as a single space
Character caseDifferences in character case are significant
Line endingsDifferences in line endings (CR and LF characters) are ignored
CR/LF charactersNot shown in the comparison detail
Active line-pairing rules

457.4 Active regular expressions

No regular expressions were active.

457.5 Comparison detail

1 /* Magnific Popup CSS */ 1 /* Magnific Popup CSS */
2 .mfp-bg { 2 .mfp-bg {
3   top: 0; 3   top: 0;
4   right: 0; 4   right: 0;
5   width: 100%; 5   width: 100%;
6   height: 100%; 6   height: 100%;
7   z-index: 1042; 7   z-index: 1042;
8   overflow: hidden; 8   overflow: hidden;
9   position: fixed; 9   position: fixed;
10   background: #0b0b0b; 10   background: rgba(68,70,69,.65);
11   opacity: 0.8; } 11 }
12  12 
13 .mfp-wrap { 13 .mfp-wrap {
14   top: 0; 14   top: 0;
15   right: 0; 15   right: 0;
16   width: 100%; 16   width: 100%;
17   height: 100%; 17   height: 100%;
18   z-index: 1043; 18   z-index: 1043;
19   position: fixed; 19   position: fixed;
20   outline: none !important; 20   outline: none !important;
21   -webkit-backface-visibility: hidden; } 21   -webkit-backface-visibility: hidden; }
22  22 
23 .mfp-container { 23 .mfp-container {
24   text-align: center; 24   text-align: center;
25   position: absolute; 25   position: absolute;
26   width: 100%; 26   width: 100%;
27   height: 100%; 27   height: 100%;
28   right: 0; 28   right: 0;
29   top: 0; 29   top: 0;
30   padding: 0 8px; 30   padding: 0 8px;
31   box-sizing: border-box; } 31   box-sizing: border-box; }
32  32 
33 .mfp-container:before { 33 .mfp-container:before {
34   content: ''; 34   content: '';
35   display: inline-block; 35   display: inline-block;
36   height: 100%; 36   height: 100%;
37   vertical-align: middle; } 37   vertical-align: middle; }
38  38 
39 .mfp-align-top .mfp-container:before { 39 .mfp-align-top .mfp-container:before {
40   display: none; } 40   display: none; }
41  41 
42 .mfp-content { 42 .mfp-content {
43   position: relative; 43   position: relative;
44   display: inline-block; 44   display: inline-block;
45   vertical-align: middle; 45   vertical-align: middle;
46   margin: 0 auto; 46   margin: 0 auto;
47   text-align: right; 47   text-align: right;
48   z-index: 1045; } 48   z-index: 1045; }
49  49 
50 .mfp-inline-holder .mfp-content, 50 .mfp-inline-holder .mfp-content,
51 .mfp-ajax-holder .mfp-content { 51 .mfp-ajax-holder .mfp-content {
52   width: 100%; 52   width: 100%;
53   cursor: auto; } 53   cursor: auto; }
54  54 
55 .mfp-ajax-cur { 55 .mfp-ajax-cur {
56   cursor: progress; } 56   cursor: progress; }
57  57 
58 .mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close { 58 .mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close {
59   cursor: -moz-zoom-out; 59   cursor: -moz-zoom-out;
60   cursor: -webkit-zoom-out; 60   cursor: -webkit-zoom-out;
61   cursor: zoom-out; } 61   cursor: zoom-out; }
62  62 
63 .mfp-zoom { 63 .mfp-zoom {
64   cursor: pointer; 64   cursor: pointer;
65   cursor: -webkit-zoom-in; 65   cursor: -webkit-zoom-in;
66   cursor: -moz-zoom-in; 66   cursor: -moz-zoom-in;
67   cursor: zoom-in; } 67   cursor: zoom-in; }
68  68 
69 .mfp-auto-cursor .mfp-content { 69 .mfp-auto-cursor .mfp-content {
70   cursor: auto; } 70   cursor: auto; }
71  71 
72 .mfp-close, 72 .mfp-close,
73 .mfp-arrow, 73 .mfp-arrow,
74 .mfp-preloader, 74 .mfp-preloader,
75 .mfp-counter { 75 .mfp-counter {
76   -webkit-user-select: none; 76   -webkit-user-select: none;
77   -moz-user-select: none; 77   -moz-user-select: none;
78   user-select: none; } 78   user-select: none; }
79  79 
80 .mfp-loading.mfp-figure { 80 .mfp-loading.mfp-figure {
81   display: none; } 81   display: none; }
82  82 
83 .mfp-hide { 83 .mfp-hide {
84   display: none !important; } 84   display: none !important; }
85  85 
86 .mfp-preloader { 86 .mfp-preloader {
87   color: #CCC; 87   color: #CCC;
88   position: absolute; 88   position: absolute;
89   top: 50%; 89   top: 50%;
90   width: auto; 90   width: auto;
91   text-align: center; 91   text-align: center;
92   margin-top: -0.8em; 92   margin-top: -0.8em;
93   left: 8px; 93   left: 8px;
94   right: 8px; 94   right: 8px;
95   z-index: 1044; } 95   z-index: 1044; }
96   .mfp-preloader a { 96   .mfp-preloader a {
97     color: #CCC; } 97     color: #CCC; }
98     .mfp-preloader a:hover { 98     .mfp-preloader a:hover {
99       color: #FFF; } 99       color: #FFF; }
100  100 
101 .mfp-s-ready .mfp-preloader { 101 .mfp-s-ready .mfp-preloader {
102   display: none; } 102   display: none; }
103  103 
104 .mfp-s-error .mfp-content { 104 .mfp-s-error .mfp-content {
105   display: none; } 105   display: none; }
106  106 
107 button.mfp-close, 107 button.mfp-close,
108 button.mfp-arrow { 108 button.mfp-arrow {
109   overflow: visible; 109   overflow: visible;
110   cursor: pointer; 110   cursor: pointer;
111   background: transparent; 111   background: transparent;
112   border: 0; 112   border: 0;
113   -webkit-appearance: none; 113   -webkit-appearance: none;
114   display: block; 114   display: block;
115   outline: none; 115   outline: none;
116   padding: 0; 116   padding: 0;
117   z-index: 1046; 117   z-index: 1046;
118   box-shadow: none; 118   box-shadow: none;
119   touch-action: manipulation; } 119   touch-action: manipulation; }
120  120 
121 button::-moz-focus-inner { 121 button::-moz-focus-inner {
122   padding: 0; 122   padding: 0;
123   border: 0; } 123   border: 0; }
124  124 
125 .mfp-close { 125 .mfp-close {
126   width: 44px; 126   width: 44px;
127   height: 44px; 127   height: 44px;
128   line-height: 44px; 128   line-height: 44px;
129   position: absolute; 129   position: absolute;
130   left: 0; 130   left: 0;
131   top: 0; 131   top: 0;
132   text-decoration: none; 132   text-decoration: none;
133   text-align: center; 133   text-align: center;
134   opacity: 0.65; 134   opacity: 0.65;
135   padding: 0 10px 18px 0; 135   padding: 0 10px 18px 0;
136   color: #FFF; 136   color: #FFF;
137   font-style: normal; 137   font-style: normal;
138   font-size: 28px; 138   font-size: 28px;
139   font-family: Arial, Baskerville, monospace; } 139   font-family: Arial, Baskerville, monospace; }
140   .mfp-close:hover, 140   .mfp-close:hover,
141   .mfp-close:focus { 141   .mfp-close:focus {
142     opacity: 1; } 142     opacity: 1; }
143   .mfp-close:active { 143   .mfp-close:active {
144     top: 1px; } 144     top: 1px; }
145  145 
146 .mfp-close-btn-in .mfp-close { 146 .mfp-close-btn-in .mfp-close {
147   color: #333; } 147   color: #333; }
148  148 
149 .mfp-image-holder .mfp-close, 149 .mfp-image-holder .mfp-close,
150 .mfp-iframe-holder .mfp-close { 150 .mfp-iframe-holder .mfp-close {
151   color: #FFF; 151   color: #FFF;
152   left: -6px; 152   left: -6px;
153   text-align: left; 153   text-align: left;
154   padding-left: 6px; 154   padding-left: 6px;
155   width: 100%; } 155   width: 100%; }
156  156 
157 .mfp-counter { 157 .mfp-counter {
158   position: absolute; 158   position: absolute;
159   top: 0; 159   top: 0;
160   left: 0; 160   left: 0;
161   color: #CCC; 161   color: #CCC;
162   font-size: 12px; 162   font-size: 12px;
163   line-height: 18px; 163   line-height: 18px;
164   white-space: nowrap; } 164   white-space: nowrap; }
165  165 
166 .mfp-arrow { 166 .mfp-arrow {
167   position: absolute; 167   position: absolute;
168   opacity: 0.65; 168   opacity: 0.65;
169   margin: 0; 169   margin: 0;
170   top: 50%; 170   top: 50%;
171   margin-top: -55px; 171   margin-top: -55px;
172   padding: 0; 172   padding: 0;
173   width: 90px; 173   width: 90px;
174   height: 110px; 174   height: 110px;
175   -webkit-tap-highlight-color: transparent; } 175   -webkit-tap-highlight-color: transparent; }
176   .mfp-arrow:active { 176   .mfp-arrow:active {
177     margin-top: -54px; } 177     margin-top: -54px; }
178   .mfp-arrow:hover, 178   .mfp-arrow:hover,
179   .mfp-arrow:focus { 179   .mfp-arrow:focus {
180     opacity: 1; } 180     opacity: 1; }
181   .mfp-arrow:before, 181   .mfp-arrow:before,
182   .mfp-arrow:after { 182   .mfp-arrow:after {
183     content: ''; 183     content: '';
184     display: block; 184     display: block;
185     width: 0; 185     width: 0;
186     height: 0; 186     height: 0;
187     position: absolute; 187     position: absolute;
188     right: 0; 188     right: 0;
189     top: 0; 189     top: 0;
190     margin-top: 35px; 190     margin-top: 35px;
191     margin-right: 35px; 191     margin-right: 35px;
192     border: medium inset transparent; } 192     border: medium inset transparent; }
193   .mfp-arrow:after { 193   .mfp-arrow:after {
194     border-top-width: 13px; 194     border-top-width: 13px;
195     border-bottom-width: 13px; 195     border-bottom-width: 13px;
196     top: 8px; } 196     top: 8px; }
197   .mfp-arrow:before { 197   .mfp-arrow:before {
198     border-top-width: 21px; 198     border-top-width: 21px;
199     border-bottom-width: 21px; 199     border-bottom-width: 21px;
200     opacity: 0.7; } 200     opacity: 0.7; }
201  201 
202 .mfp-arrow-left { 202 .mfp-arrow-left {
203   right: 0; } 203   right: 0; }
204   .mfp-arrow-left:after { 204   .mfp-arrow-left:after {
205     border-left: 17px solid #FFF; 205     border-left: 17px solid #FFF;
206     margin-right: 31px; } 206     margin-right: 31px; }
207   .mfp-arrow-left:before { 207   .mfp-arrow-left:before {
208     margin-right: 25px; 208     margin-right: 25px;
209     border-left: 27px solid #3F3F3F; } 209     border-left: 27px solid #3F3F3F; }
210  210 
211 .mfp-arrow-right { 211 .mfp-arrow-right {
212   left: 0; } 212   left: 0; }
213   .mfp-arrow-right:after { 213   .mfp-arrow-right:after {
214     border-right: 17px solid #FFF; 214     border-right: 17px solid #FFF;
215     margin-right: 39px; } 215     margin-right: 39px; }
216   .mfp-arrow-right:before { 216   .mfp-arrow-right:before {
217     border-right: 27px solid #3F3F3F; } 217     border-right: 27px solid #3F3F3F; }
218  218 
219 .mfp-iframe-holder { 219 .mfp-iframe-holder {
220   padding-top: 40px; 220   padding-top: 40px;
221   padding-bottom: 40px; } 221   padding-bottom: 40px; }
222   .mfp-iframe-holder .mfp-content { 222   .mfp-iframe-holder .mfp-content {
223     line-height: 0; 223     line-height: 0;
224     width: 200px; 224     width: 200px;
225     max-width: 900px; } 225     max-width: 900px; }
226   .mfp-iframe-holder .mfp-close { 226   .mfp-iframe-holder .mfp-close {
227     top: -40px; } 227     top: -44px;
    228     width: auto;
    229     font-size: 0;
    230   }
228 .mfp-iframe-holder .mfp-close:hover { 231 .mfp-iframe-holder .mfp-close:hover {
229     background: transparent; 232     background: transparent;
230 } 233 }
231  234 
232 .mfp-iframe-scaler { 235 .mfp-iframe-scaler {
233   width: 100%; 236   width: 100%;
234   height: 0; 237   height: 0;
235   overflow: hidden; 238   overflow: hidden;
236   padding-top: 64.25%; } 239   padding-top: 64.25%; }
237   .mfp-iframe-scaler iframe { 240   .mfp-iframe-scaler iframe {
238     position: absolute; 241     position: absolute;
239     display: block; 242     display: block;
240     top: 0; 243     top: 0;
241     right: 0; 244     right: 0;
242     width: 100%; 245     width: 100%;
243     height: 100%; 246     height: 100%;
244     box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); 247     box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
245     opacity: 0; 248     opacity: 0;
246     background: #000; } 249     background: #000; }
247  250 
248 /* Main image in popup */ 251 /* Main image in popup */
249 img.mfp-img { 252 img.mfp-img {
250   width: auto; 253   width: auto;
251   max-width: 100%; 254   max-width: 100%;
252   height: auto; 255   height: auto;
253   display: block; 256   display: block;
254   line-height: 0; 257   line-height: 0;
255   box-sizing: border-box; 258   box-sizing: border-box;
256   padding: 40px 0 40px; 259   padding: 40px 0 40px;
257   margin: 0 auto; } 260   margin: 0 auto; }
258  261 
259 /* The shadow behind the image */ 262 /* The shadow behind the image */
260 .mfp-figure { 263 .mfp-figure {
261   line-height: 0; } 264   line-height: 0; }
262   .mfp-figure:after { 265   .mfp-figure:after {
263     content: ''; 266     content: '';
264     position: absolute; 267     position: absolute;
265     left: 0; 268     left: 0;
266     top: 40px; 269     top: 40px;
267     bottom: 40px; 270     bottom: 40px;
268     display: block; 271     display: block;
269     right: 0; 272     right: 0;
270     width: auto; 273     width: auto;
271     height: auto; 274     height: auto;
272     z-index: -1; 275     z-index: -1;
273     box-shadow: 0 0 8px rgba(0, 0, 0, 0.6); 276     box-shadow: 0 0 8px rgba(0, 0, 0, 0.6);
274     background: #444; } 277     background: #444; }
275   .mfp-figure small { 278   .mfp-figure small {
276     color: #BDBDBD; 279     color: #BDBDBD;
277     display: block; 280     display: block;
278     font-size: 12px; 281     font-size: 12px;
279     line-height: 14px; } 282     line-height: 14px; }
280   .mfp-figure figure { 283   .mfp-figure figure {
281     margin: 0; } 284     margin: 0; }
282  285 
283 .mfp-bottom-bar { 286 .mfp-bottom-bar {
284   margin-top: -36px; 287   margin-top: -36px;
285   position: absolute; 288   position: absolute;
286   top: 100%; 289   top: 100%;
287   right: 0; 290   right: 0;
288   width: 100%; 291   width: 100%;
289   cursor: auto; } 292   cursor: auto; }
290  293 
291 .mfp-title { 294 .mfp-title {
292   text-align: right; 295   text-align: right;
293   line-height: 18px; 296   line-height: 18px;
294   color: #F3F3F3; 297   color: #F3F3F3;
295   word-wrap: break-word; 298   word-wrap: break-word;
296   padding-left: 36px; } 299   padding-left: 36px; }
297  300 
298 .mfp-image-holder .mfp-content { 301 .mfp-image-holder .mfp-content {
299   max-width: 100%; } 302   max-width: 100%; }
300  303 
301 .mfp-gallery .mfp-image-holder .mfp-figure { 304 .mfp-gallery .mfp-image-holder .mfp-figure {
302   cursor: pointer; } 305   cursor: pointer; }
303  306 
304 @media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) { 307 @media screen and (max-width: 800px) and (orientation: landscape), screen and (max-height: 300px) {
305   /** 308   /**
306        * Remove all paddings around the image on small screen 309        * Remove all paddings around the image on small screen
307        */ 310        */
308   .mfp-img-mobile .mfp-image-holder { 311   .mfp-img-mobile .mfp-image-holder {
309     padding-left: 0; 312     padding-left: 0;
310     padding-right: 0; } 313     padding-right: 0; }
311   .mfp-img-mobile img.mfp-img { 314   .mfp-img-mobile img.mfp-img {
312     padding: 0; } 315     padding: 0; }
313   .mfp-img-mobile .mfp-figure:after { 316   .mfp-img-mobile .mfp-figure:after {
314     top: 0; 317     top: 0;
315     bottom: 0; } 318     bottom: 0; }
316   .mfp-img-mobile .mfp-figure small { 319   .mfp-img-mobile .mfp-figure small {
317     display: inline; 320     display: inline;
318     margin-right: 5px; } 321     margin-right: 5px; }
319   .mfp-img-mobile .mfp-bottom-bar { 322   .mfp-img-mobile .mfp-bottom-bar {
320     background: rgba(0, 0, 0, 0.6); 323     background: rgba(0, 0, 0, 0.6);
321     bottom: 0; 324     bottom: 0;
322     margin: 0; 325     margin: 0;
323     top: auto; 326     top: auto;
324     padding: 3px 5px; 327     padding: 3px 5px;
325     position: fixed; 328     position: fixed;
326     box-sizing: border-box; } 329     box-sizing: border-box; }
327     .mfp-img-mobile .mfp-bottom-bar:empty { 330     .mfp-img-mobile .mfp-bottom-bar:empty {
328       padding: 0; } 331       padding: 0; }
329   .mfp-img-mobile .mfp-counter { 332   .mfp-img-mobile .mfp-counter {
330     left: 5px; 333     left: 5px;
331     top: 3px; } 334     top: 3px; }
332   .mfp-img-mobile .mfp-close { 335   .mfp-img-mobile .mfp-close {
333     top: 0; 336     top: 0;
334     left: 0; 337     left: 0;
335     width: 35px; 338     width: 35px;
336     height: 35px; 339     height: 35px;
337     line-height: 35px; 340     line-height: 35px;
338     background: rgba(0, 0, 0, 0.6); 341     background: rgba(0, 0, 0, 0.6);
339     position: fixed; 342     position: fixed;
340     text-align: center; 343     text-align: center;
341     padding: 0; } } 344     padding: 0; } }
342  345 
343 @media all and (max-width: 900px) { 346 @media all and (max-width: 900px) {
344   .mfp-arrow { 347   .mfp-arrow {
345     -webkit-transform: scale(0.75); 348     -webkit-transform: scale(0.75);
346     transform: scale(0.75); } 349     transform: scale(0.75); }
347   .mfp-arrow-left { 350   .mfp-arrow-left {
348     -webkit-transform-origin: 0; 351     -webkit-transform-origin: 0;
349     transform-origin: 0; } 352     transform-origin: 0; }
350   .mfp-arrow-right { 353   .mfp-arrow-right {
351     -webkit-transform-origin: 100%; 354     -webkit-transform-origin: 100%;
352     transform-origin: 100%; } 355     transform-origin: 100%; }
353   .mfp-container { 356   .mfp-container {
354     padding-left: 6px; 357     padding-left: 6px;
355     padding-right: 6px; } } 358     padding-right: 6px; } }
356  359 
357  360 
358 .mfp-preloader { 361 .mfp-preloader {
359     border: 1px solid #ccc; 362     border: 1px solid #ccc;
360     border-width: 2.5px; 363     border-width: 2.5px;
361     border-radius: 15px; 364     border-radius: 15px;
362     border-top-color: transparent; 365     border-top-color: transparent;
363     width: 30px; 366     width: 30px;
364     height: 30px; 367     height: 30px;
365     margin: 0 auto; 368     margin: 0 auto;
366     -webkit-animation: spin 1s infinite linear; 369     -webkit-animation: spin 1s infinite linear;
367     animation: spin 1s infinite linear; 370     animation: spin 1s infinite linear;
368     z-index: 99999; 371     z-index: 99999;
369 } 372 }
370  373 
371 @-webkit-keyframes rotateplane { 374 @-webkit-keyframes rotateplane {
372   0% { -webkit-transform: perspective(120px) } 375   0% { -webkit-transform: perspective(120px) }
373   50% { -webkit-transform: perspective(120px) rotateY(180deg) } 376   50% { -webkit-transform: perspective(120px) rotateY(180deg) }
374   100% { -webkit-transform: perspective(120px) rotateY(180deg)  rotateX(180deg) } 377   100% { -webkit-transform: perspective(120px) rotateY(180deg)  rotateX(180deg) }
375 } 378 }
376  379 
377 @keyframes rotateplane { 380 @keyframes rotateplane {
378   0% { transform: perspective(120px) rotateX(0deg) rotateY(0deg) } 381   0% { transform: perspective(120px) rotateX(0deg) rotateY(0deg) }
379   50% { transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg) } 382   50% { transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg) }
380   100% { transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg) } 383   100% { transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg) }
381 } 384 }

Araxis Merge (but not the data content of this report) is Copyright © 1993–2019 Araxis Ltd (www.araxis.com). All rights reserved.