304. Araxis Merge File Comparison Report

Produced by Araxis Merge on 2024-03-04 14:39:20 +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.

304.1 Files compared

#LocationFileLast Modified
12024-03-04 14:39:20 +0000
2/Users/coca/Documents/www/Porto v4.0.2/Theme Files/Magento 2.x/Porto Theme v4.0.8/pub/media/porto/web/csstest.css2023-12-02 04:03:48 +0000

304.2 Comparison summary

DescriptionBetween
Files 1 and 2
Text BlocksLines
Unchanged00
Changed00
Inserted1530
Removed00

304.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

304.4 Active regular expressions

No regular expressions were active.

304.5 Comparison detail

    1 :root {
    2   --porto-grid-gutter-width: 20px;
    3   --porto-el-spacing: 20px;
    4 }
    5 
    6 .porto-posts-grid .product-category,.porto-tb-item {
    7     margin-bottom: var(--porto-el-spacing,var(--porto-grid-gutter-width,20px))
    8 }
    9 
    10 .wp-block[data-type="porto/porto-section"] {
    11     position: static
    12 }
    13 
    14 .porto-tb-featured-image {
    15     overflow: hidden;
    16     position: relative
    17 }
    18 
    19 .porto-tb-featured-image .img-thumbnail {
    20     display: block
    21 }
    22 
    23 .porto-tb-featured-image img {
    24     display: block;
    25     width: 100%
    26 }
    27 
    28 .porto-tb-featured-image .owl-nav {
    29     z-index: 1
    30 }
    31 
    32 .porto-tb-featured-image .owl-carousel {
    33     z-index: auto
    34 }
    35 
    36 .porto-tb-featured-image .zoom {
    37     line-height: 30px
    38 }
    39 
    40 .porto-tb-featured-image p {
    41     overflow-wrap: break-word
    42 }
    43 
    44 .porto-tb-featured-image:hover {
    45     z-index: auto
    46 }
    47 
    48 .porto-tb-featured-image:hover .zoom {
    49     opacity: 1
    50 }
    51 
    52 .tb-image-type-gallery .img-thumbnail .zoom {
    53     opacity: 0
    54 }
    55 
    56 .tb-image-type-gallery .img-thumbnail:hover .zoom {
    57     opacity: 1
    58 }
    59 
    60 .grid-creative .tb-image-type-default,.grid-creative .tb-image-type-hover {
    61     height: 100%
    62 }
    63 
    64 .grid-creative .tb-image-type-default .img-thumbnail,.grid-creative .tb-image-type-default .img-thumbnail img,.grid-creative .tb-image-type-hover .img-thumbnail,.grid-creative .tb-image-type-hover .img-thumbnail img {
    65     height: inherit;
    66     object-fit: cover
    67 }
    68 
    69 .grid-creative>.porto-tb-item {
    70     margin-bottom: 0
    71 }
    72 
    73 .tb-image-type-hover {
    74     position: relative
    75 }
    76 
    77 .tb-image-type-hover .hover-image {
    78     position: absolute;
    79     left: 0;
    80     top: 0;
    81     height: 100%;
    82     right: 0;
    83     object-fit: cover;
    84     transition: opacity 0.3s,transform 2s cubic-bezier(0,0,0.44,1.18);
    85     opacity: 0
    86 }
    87 
    88 .tb-image-type-hover:hover .hover-image {
    89     opacity: 1;
    90     transform: scale(1.1,1.1) translateZ(0)
    91 }
    92 
    93 .tb-image-type-slider .owl-item,.tb-image-type-slider .owl-stage,.tb-image-type-slider .owl-stage-outer,.tb-image-type-slider .porto-carousel {
    94     position: static
    95 }
    96 
    97 .tb-image-type-slider .porto-carousel .owl-dots {
    98     top: auto;
    99     bottom: 10px;
    100     justify-content: center;
    101     z-index: 5
    102 }
    103 
    104 .tb-image-type-slider .porto-carousel .zoom {
    105     z-index: 5
    106 }
    107 
    108 .tb-image-type-slider .img-thumbnail {
    109     overflow: hidden
    110 }
    111 
    112 .tb-woo-price .price {
    113     display: block
    114 }
    115 
    116 .porto-img-effect-1 .img-thumbnail:after,.porto-img-effect-1 .img-thumbnail:before {
    117     content: "";
    118     position: absolute;
    119     opacity: 1;
    120     z-index: 1
    121 }
    122 
    123 .porto-img-effect-1 .img-thumbnail:before {
    124     background: rgba(255,255,255,0.3);
    125     bottom: 0;
    126     left: 50%;
    127     right: 51%;
    128     top: 0
    129 }
    130 
    131 .porto-img-effect-1 .img-thumbnail:after {
    132     bottom: 50%;
    133     left: 0;
    134     right: 0;
    135     top: 50%
    136 }
    137 
    138 .porto-img-effect-1:hover .img-thumbnail:after,.porto-img-effect-1:hover .img-thumbnail:before {
    139     left: 0;
    140     right: 0;
    141     opacity: 0;
    142     transition: 0.5s linear
    143 }
    144 
    145 .porto-img-effect-2 .img-thumbnail:after,.porto-img-effect-2 .img-thumbnail:before {
    146     content: "";
    147     position: absolute;
    148     background: rgba(255,255,255,0.6);
    149     height: 100%;
    150     left: 0;
    151     opacity: 0.4;
    152     top: 0;
    153     transition: 0.9s;
    154     width: 100%;
    155     z-index: 1
    156 }
    157 
    158 .porto-img-effect-2 .img-thumbnail:before {
    159     transform: translate(105%,0%)
    160 }
    161 
    162 .porto-img-effect-2 .img-thumbnail:after {
    163     transform: translate(-105%,0%)
    164 }
    165 
    166 .porto-img-effect-2:hover .img-thumbnail:after,.porto-img-effect-2:hover .img-thumbnail:before {
    167     opacity: 0;
    168     transform: none
    169 }
    170 
    171 .porto-img-effect-3 .img-thumbnail:before {
    172     content: "";
    173     position: absolute;
    174     top: 0;
    175     left: 50%;
    176     width: 120%;
    177     height: 60px;
    178     background: rgba(255,255,255,0.1);
    179     transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,-150%,0);
    180     transition: 0.5s linear;
    181     backface-visibility: hidden;
    182     z-index: 1
    183 }
    184 
    185 .porto-img-effect-3:hover .img-thumbnail:before {
    186     top: 100%;
    187     left: -100%;
    188     transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,200%,0)
    189 }
    190 
    191 .porto-img-effect-4 .img-thumbnail:after,.porto-img-effect-4 .img-thumbnail:before {
    192     content: "";
    193     position: absolute;
    194     background: rgba(255,255,255,0.1);
    195     opacity: 1;
    196     transition: 0.5s;
    197     z-index: 1
    198 }
    199 
    200 .porto-img-effect-4 .img-thumbnail:before {
    201     bottom: 0;
    202     left: 50%;
    203     right: 51%;
    204     top: 0
    205 }
    206 
    207 .porto-img-effect-4 .img-thumbnail:after {
    208     bottom: 50%;
    209     left: 0;
    210     right: 0;
    211     top: 50%
    212 }
    213 
    214 .porto-img-effect-4:hover .img-thumbnail:after,.porto-img-effect-4:hover .img-thumbnail:before {
    215     left: 0;
    216     right: 0;
    217     top: 0;
    218     bottom: 0;
    219     opacity: 0.5
    220 }
    221 
    222 .porto-img-zoom img {
    223     transition: transform 1s,opacity 1s;
    224     opacity: 1
    225 }
    226 
    227 .porto-img-zoom:hover img {
    228     transform: scale(1.1,1.1) translateZ(0);
    229     opacity: 0.9
    230 }
    231 
    232 .tb-hover-content,.tb-hover-content .porto-tb-link,.wp-block[data-type="porto-tb/porto-featured-image"]>.block-editor-inner-blocks {
    233     position: absolute;
    234     left: 0;
    235     top: 0;
    236     width: 100%;
    237     height: 100%;
    238     z-index: 4
    239 }
    240 
    241 .tb-hover-content,.wp-block[data-type="porto-tb/porto-featured-image"]>.block-editor-inner-blocks>.block-editor-block-list__layout {
    242     background: rgba(255,255,255,0.8);
    243     display: flex;
    244     flex-direction: column;
    245     flex-wrap: wrap;
    246     height: 100%
    247 }
    248 
    249 .tb-hover-content {
    250     transition: transform 0.4s,opacity 0.3s;
    251     opacity: 0
    252 }
    253 
    254 .tb-hover-content.thumb-info-floating-element-wrapper:not(.with-link)>:first-child {
    255     display: none
    256 }
    257 
    258 .tb-hover-content.thumb-info-floating-element-wrapper.with-link>:nth-child(2) {
    259     display: none;
    260 }
    261 
    262 .porto-tb-item:hover .tb-hover-content {
    263     opacity: 1
    264 }
    265 
    266 .hover-start-fadein {
    267     opacity: 0
    268 }
    269 
    270 .hover-start-translateleft {
    271     transform: translateX(-101%)
    272 }
    273 
    274 .hover-start-translatetop {
    275     transform: translateY(-101%)
    276 }
    277 
    278 .hover-start-translatebottom {
    279     transform: translateY(101%)
    280 }
    281 
    282 .hover-start-contenttranslatebottom>:not(.porto-tb-link) {
    283     transform: translateY(100px);
    284     transition: transform 0.3s,opacity 0.3s
    285 }
    286 
    287 .porto-tb-item:hover .hover-start-fadein {
    288     opacity: 1
    289 }
    290 
    291 .porto-tb-item:hover .hover-start-translateleft {
    292     transform: translateX(0)
    293 }
    294 
    295 .porto-tb-item:hover .hover-start-translatebottom,.porto-tb-item:hover .hover-start-translatetop {
    296     transform: translateY(0)
    297 }
    298 
    299 .porto-tb-item:hover .hover-start-contenttranslatebottom>:not(.porto-tb-link) {
    300     transform: translateY(0)
    301 }
    302 
    303 .tb-hover-content>* {
    304     position: relative;
    305     z-index: 1
    306 }
    307 
    308 .tb-hover-content .porto-tb-link {
    309     z-index: auto
    310 }
    311 
    312 .porto-tb-icon-left i {
    313     margin-right: 0.25rem
    314 }
    315 
    316 .porto-tb-icon-right i {
    317     margin-left: 0.25rem
    318 }
    319 
    320 .porto-tb-woo-link {
    321     display: inline-block;
    322     cursor: pointer;
    323     color: var(--porto-dark-color,#222529);
    324     line-height: 1.8;
    325     text-decoration: none;
    326     transition: transform 0.3s,opacity 0.3s,background-color 0.3s,border-color 0.3s,color 0.3s
    327 }
    328 
    329 .porto-tb-woo-link:hover {
    330     color: var(--porto-primary-color)
    331 }
    332 
    333 .porto-tb-woo-link a {
    334     color: inherit
    335 }
    336 
    337 .porto-tb-wishlist a.view-wishlist {
    338     display: none
    339 }
    340 
    341 .porto-tb-wishlist a,.porto-tb-wishlist span:not(.yith-wcwl-tooltip) {
    342     text-indent: 0;
    343     border: none;
    344     width: auto;
    345     height: auto;
    346     line-height: inherit;
    347     background: none;
    348     border: none;
    349     color: inherit;
    350     transition: none
    351 }
    352 
    353 .porto-tb-wishlist.porto-tb-icon-left i {
    354     margin-right: 0.25rem
    355 }
    356 
    357 .porto-tb-wishlist .count-add-to-wishlist {
    358     display: none!important
    359 }
    360 
    361 .editor-styles-wrapper .yith-wcwl-add-to-wishlist span,.porto-tb-wishlist a:hover,.porto-tb-wishlist span:hover {
    362     background: none;
    363     color: inherit;
    364     border: none
    365 }
    366 
    367 .porto-tb-wishlist a:before,.porto-tb-wishlist span:before {
    368     position: static;
    369     font-size: inherit
    370 }
    371 
    372 .porto-tb-swatch .variations .label,.porto-tb-swatch .variations .reset_variations {
    373     display: none!important
    374 }
    375 
    376 .porto-tb-swatch .variations td {
    377     padding: 0 0 5px
    378 }
    379 
    380 .porto-tb-meta {
    381     display: inline-block
    382 }
    383 
    384 .porto-tb-meta a {
    385     color: inherit
    386 }
    387 
    388 .porto-tb-meta a:hover {
    389     color: var(--porto-primary-color)
    390 }
    391 
    392 .porto-posts-grid.porto-ajax-loading:after {
    393     z-index: 4
    394 }
    395 
    396 .porto-posts-grid .sort-source {
    397     margin-bottom: 1rem
    398 }
    399 
    400 .porto-posts-grid .pagination {
    401     margin: 0
    402 }
    403 
    404 .porto-posts-grid.porto-ajax-load {
    405     position: relative
    406 }
    407 
    408 .porto-posts-grid .porto-ibanner>img {
    409     width: auto
    410 }
    411 
    412 .porto-posts-grid .posts-container[data-plugin-masonry] {
    413     transition: height 0.3s ease-in-out
    414 }
    415 
    416 .porto-posts-grid .nothing-found-message {
    417     width: 100%
    418 }
    419 
    420 .porto-posts-grid .filter-check li a:before {
    421     content: "\f87a";
    422     font-family: "porto"
    423 }
    424 
    425 html:not(.rtl) .porto-posts-grid .filter-check li a:before {
    426     margin-right: 6px
    427 }
    428 
    429 .rtl .porto-posts-grid .filter-check li a:before {
    430     margin-left: 6px
    431 }
    432 
    433 .porto-posts-grid .filter-check li.active a:before {
    434     content: "\f87b"
    435 }
    436 
    437 @media (min-width: 768px) {
    438     .porto-posts-grid.filter-vertical {
    439         display:flex
    440     }
    441 
    442     .porto-posts-grid.filter-vertical .nav {
    443         flex-direction: column;
    444         flex: 0 0 auto;
    445         width: var(--porto-filter-width,20%)
    446     }
    447 
    448     html:not(.rtl) .porto-posts-grid.filter-vertical .sort-source li {
    449         margin-right: 0!important
    450     }
    451 
    452     .rtl .porto-posts-grid.filter-vertical .sort-source li {
    453         margin-left: 0!important
    454     }
    455 
    456     .porto-posts-grid.filter-vertical .posts-wrap {
    457         flex: 1;
    458         width: calc(100% - var(--porto-filter-width, 20%))
    459     }
    460 
    461     .porto-posts-grid.slider-wrapper .nav {
    462         padding: 0 calc(var(--porto-el-spacing, var(--porto-grid-gutter-width)) / 2)
    463     }
    464 }
    465 
    466 @media (max-width: 991px) and (min-width:768px) {
    467     .porto-posts-grid.filter-vertical .nav {
    468         width:var(--porto-filter-tablet-width,20%)
    469     }
    470 
    471     .porto-posts-grid.filter-vertical .posts-wrap {
    472         width: calc(100% - var(--porto-filter-tablet-width, 20%))
    473     }
    474 }
    475 
    476 .image-hover-overlay {
    477     position: relative
    478 }
    479 
    480 .image-hover-overlay .posts-wrap {
    481     position: relative;
    482     z-index: 2
    483 }
    484 
    485 .image-hover-overlay .posts-wrap .img-thumbnail {
    486     transition: opacity 0.8s
    487 }
    488 
    489 .image-hover-overlay.active .img-thumbnail {
    490     opacity: 0
    491 }
    492 
    493 .image-hover-overlay.active .product-image {
    494     background-color: transparent
    495 }
    496 
    497 .image-hover-overlay .thumb-info-full {
    498     position: absolute;
    499     left: 0;
    500     right: 0;
    501     bottom: var(--porto-el-spacing,var(--porto-grid-gutter-width,20px));
    502     height: calc(var(--porto-himg-height, 0px) - var(--porto-el-spacing, var(--porto-grid-gutter-width, 20px)));
    503     opacity: 0;
    504     transition: opacity 0.8s;
    505     background-size: cover
    506 }
    507 
    508 .image-hover-overlay .thumb-info-full.active {
    509     opacity: 1
    510 }
    511 
    512 .porto-tb-item:hover .viewcart.added {
    513     display: block;
    514     opacity: 1;
    515     cursor: pointer
    516 }
    517 
    518 .porto-tb-item.product-col .filter-color {
    519     --porto-sw-size: 17px;
    520     margin: 3px 6px 3px 0
    521 }
    522 
    523 .porto-tb-item.product-col .active .filter-color:before,.porto-tb-item.product-col .chosen .filter-color:before {
    524     --porto-sw-offset: -3px
    525 }
    526 
    527 .rtl .porto-tb-item.product-col .filter-color {
    528     margin-right: 0;
    529     margin-left: 6px
    530 }