392. Araxis Merge File Comparison Report

Produced by Araxis Merge on 2021-05-13 09:09: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.

392.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/Magento_Checkout/web/css/source/module/checkout_tooltip.less2018-11-28 08:56:04 +0000
2/Applications/Ampps/www/Porto v4.0.0/Theme Files/Magento 2.x/Porto Theme/app/design/frontend/Smartwave/porto_rtl/Magento_Checkout/web/css/source/module/checkout_tooltip.less2018-11-28 08:56:04 +0000

392.2 Comparison summary

DescriptionBetween
Files 1 and 2
Text BlocksLines
Unchanged1286
Changed00
Inserted00
Removed00

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

392.4 Active regular expressions

No regular expressions were active.

392.5 Comparison detail

1 // /** 1 // /**
2 //  * Copyright © 2015 Magento. All rights reserved. 2 //  * Copyright © 2015 Magento. All rights reserved.
3 //  * See COPYING.txt for license details. 3 //  * See COPYING.txt for license details.
4 //  */ 4 //  */
5  5 
6 // 6 //
7 //  Variables 7 //  Variables
8 //  _____________________________________________ 8 //  _____________________________________________
9  9 
10 @checkout-tooltip__hover__z-index: @tooltip__z-index;  10 @checkout-tooltip__hover__z-index: @tooltip__z-index; 
11  11 
12 @checkout-tooltip-icon-arrow__font-size: 10px; 12 @checkout-tooltip-icon-arrow__font-size: 10px;
13 @checkout-tooltip-icon-arrow__left: -( @checkout-tooltip-content__padding + @checkout-tooltip-icon-arrow__font-size - @checkout-tooltip-content__border-width); 13 @checkout-tooltip-icon-arrow__left: -( @checkout-tooltip-content__padding + @checkout-tooltip-icon-arrow__font-size - @checkout-tooltip-content__border-width);
14  14 
15 @checkout-tooltip-icon__color: @color-gray-light2; 15 @checkout-tooltip-icon__color: @color-gray-light2;
16 @checkout-tooltip-icon__content: @icon-help; 16 @checkout-tooltip-icon__content: @icon-help;
17 @checkout-tooltip-icon__font-size: 24px; 17 @checkout-tooltip-icon__font-size: 24px;
18 @checkout-tooltip-icon__hover__color: @primary__color; 18 @checkout-tooltip-icon__hover__color: @primary__color;
19  19 
20 @checkout-tooltip-content__background-color: @color-gray-light01; 20 @checkout-tooltip-content__background-color: @color-gray-light01;
21 @checkout-tooltip-content__border-color: #ddd; 21 @checkout-tooltip-content__border-color: #ddd;
22 @checkout-tooltip-content__border-width: 1px; 22 @checkout-tooltip-content__border-width: 1px;
23 @checkout-tooltip-content__font-size: @font-size__base; 23 @checkout-tooltip-content__font-size: @font-size__base;
24 @checkout-tooltip-content__padding: 12px; 24 @checkout-tooltip-content__padding: 12px;
25 @checkout-tooltip-content__width: 270px; 25 @checkout-tooltip-content__width: 270px;
26 @checkout-tooltip-content__active__border-color: #ddd; 26 @checkout-tooltip-content__active__border-color: #ddd;
27  27 
28 @checkout-tooltip-content-mobile-popup__width: 200px; 28 @checkout-tooltip-content-mobile-popup__width: 200px;
29 @checkout-tooltip-content-mobile__right: -(@indent__s); 29 @checkout-tooltip-content-mobile__right: -(@indent__s);
30 @checkout-tooltip-content-mobile__top: 30px + @checkout-tooltip-icon-arrow__font-size; 30 @checkout-tooltip-content-mobile__top: 30px + @checkout-tooltip-icon-arrow__font-size;
31  31 
32 // 32 //
33 //  Common 33 //  Common
34 //  _____________________________________________ 34 //  _____________________________________________
35  35 
36 & when (@media-common = true) { 36 & when (@media-common = true) {
37  37 
38     .field-tooltip { 38     .field-tooltip {
39         cursor: pointer; 39         cursor: pointer;
40         position: absolute; 40         position: absolute;
41         left: 0; 41         left: 0;
42         top: 1px; 42         top: 1px;
43  43 
44         &._active { 44         &._active {
45             .lib-css(z-index, @checkout-tooltip__hover__z-index); 45             .lib-css(z-index, @checkout-tooltip__hover__z-index);
46  46 
47             .field-tooltip-content { 47             .field-tooltip-content {
48                 display: block; 48                 display: block;
49             } 49             }
50             .field-tooltip-action { 50             .field-tooltip-action {
51                 &:before { 51                 &:before {
52                     .lib-css(color, @checkout-tooltip-icon__hover__color); 52                     .lib-css(color, @checkout-tooltip-icon__hover__color);
53                 } 53                 }
54             } 54             }
55         } 55         }
56  56 
57         .field-tooltip-action { 57         .field-tooltip-action {
58             .lib-icon-font( 58             .lib-icon-font(
59                 @checkout-tooltip-icon__content, 59                 @checkout-tooltip-icon__content,
60                 @_icon-font-size: @checkout-tooltip-icon__font-size, 60                 @_icon-font-size: @checkout-tooltip-icon__font-size,
61                 @_icon-font-text-hide: true, 61                 @_icon-font-text-hide: true,
62                 @_icon-font-color: @checkout-tooltip-icon__color, 62                 @_icon-font-color: @checkout-tooltip-icon__color,
63                 @_icon-font-color-hover: @checkout-tooltip-icon__hover__color, 63                 @_icon-font-color-hover: @checkout-tooltip-icon__hover__color,
64                 @_icon-font-color-active: false 64                 @_icon-font-color-active: false
65             ); 65             );
66  66 
67             &:focus { 67             &:focus {
68                 ._keyfocus & { 68                 ._keyfocus & {
69                     .lib-css(z-index, @checkout-tooltip__hover__z-index); 69                     .lib-css(z-index, @checkout-tooltip__hover__z-index);
70                     + .field-tooltip-content { 70                     + .field-tooltip-content {
71                         display: block; 71                         display: block;
72                     } 72                     }
73                     &:before { 73                     &:before {
74                         .lib-css(color, @checkout-tooltip-icon__hover__color); 74                         .lib-css(color, @checkout-tooltip-icon__hover__color);
75                     } 75                     }
76                 } 76                 }
77             } 77             }
78         } 78         }
79  79 
80         .field-tooltip-content { 80         .field-tooltip-content {
81             .lib-css(background, @checkout-tooltip-content__background-color); 81             .lib-css(background, @checkout-tooltip-content__background-color);
82             .lib-css(border, @checkout-tooltip-content__border-width solid @checkout-tooltip-content__border-color); 82             .lib-css(border, @checkout-tooltip-content__border-width solid @checkout-tooltip-content__border-color);
83             .lib-css(border-radius, @checkout-tooltip-content__border-width); 83             .lib-css(border-radius, @checkout-tooltip-content__border-width);
84             .lib-css(font-size, @checkout-tooltip-content__font-size); 84             .lib-css(font-size, @checkout-tooltip-content__font-size);
85             .lib-css(padding, @checkout-tooltip-content__padding); 85             .lib-css(padding, @checkout-tooltip-content__padding);
86             .lib-css(width, @checkout-tooltip-content__width); 86             .lib-css(width, @checkout-tooltip-content__width);
87             display: none; 87             display: none;
88             right: 38px; 88             right: 38px;
89             position: absolute; 89             position: absolute;
90             text-transform: none; 90             text-transform: none;
91             top: -9px; 91             top: -9px;
92             word-wrap: break-word; 92             word-wrap: break-word;
93             z-index: 2; 93             z-index: 2;
94  94 
95             &:before, 95             &:before,
96             &:after { 96             &:after {
97                 .lib-arrow( 97                 .lib-arrow(
98                 @_position: left, 98                 @_position: left,
99                 @_size: @checkout-tooltip-icon-arrow__font-size, 99                 @_size: @checkout-tooltip-icon-arrow__font-size,
100                 @_color: @checkout-tooltip-content__background-color 100                 @_color: @checkout-tooltip-content__background-color
101                 ); 101                 );
102                 .lib-css(right, @checkout-tooltip-icon-arrow__left); 102                 .lib-css(right, @checkout-tooltip-icon-arrow__left);
103                 .lib-css(top, @checkout-tooltip-content__padding); 103                 .lib-css(top, @checkout-tooltip-content__padding);
104                 border-right-color: transparent; 104                 border-right-color: transparent;
105                 border-left-color: @checkout-tooltip-content__background-color; 105                 border-left-color: @checkout-tooltip-content__background-color;
106                 content: ''; 106                 content: '';
107                 display: block; 107                 display: block;
108                 position: absolute; 108                 position: absolute;
109                 z-index: 3; 109                 z-index: 3;
110             } 110             }
111             &:before { 111             &:before {
112                 .lib-css(border-left-color, @checkout-tooltip-content__active__border-color); 112                 .lib-css(border-left-color, @checkout-tooltip-content__active__border-color);
113             } 113             }
114             &:after { 114             &:after {
115                 .lib-css(border-left-color, @checkout-tooltip-content__background-color); 115                 .lib-css(border-left-color, @checkout-tooltip-content__background-color);
116                 width: 1px; 116                 width: 1px;
117                 z-index: 4; 117                 z-index: 4;
118             } 118             }
119         } 119         }
120     } 120     }
121 } 121 }
122  122 
123 // 123 //
124 //  Mobile 124 //  Mobile
125 //  _____________________________________________ 125 //  _____________________________________________
126  126 
127 .media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__xs) { 127 .media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__xs) {
128     .modal-popup { 128     .modal-popup {
129         .field-tooltip { 129         .field-tooltip {
130             .field-tooltip-content { 130             .field-tooltip-content {
131                 .lib-css(width, @checkout-tooltip-content-mobile-popup__width); 131                 .lib-css(width, @checkout-tooltip-content-mobile-popup__width);
132             } 132             }
133         } 133         }
134     } 134     }
135 } 135 }
136  136 
137 .media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__m) { 137 .media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__m) {
138     .field-tooltip { 138     .field-tooltip {
139         .field-tooltip-content { 139         .field-tooltip-content {
140             &:extend(.abs-checkout-tooltip-content-position-top-mobile all); 140             &:extend(.abs-checkout-tooltip-content-position-top-mobile all);
141         } 141         }
142     } 142     }
143 } 143 }

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