@klippa/ngx-enhancy-forms 20.0.10 → 20.0.12
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -2944,19 +2944,23 @@ class WithTooltipDirective {
|
|
|
2944
2944
|
}
|
|
2945
2945
|
}
|
|
2946
2946
|
this.hookDiv = document.createElement('div');
|
|
2947
|
-
|
|
2948
|
-
|
|
2949
|
-
|
|
2947
|
+
const top = el.nativeElement.getBoundingClientRect().top;
|
|
2948
|
+
const left = el.nativeElement.getBoundingClientRect().left;
|
|
2949
|
+
document.body.appendChild(this.hookDiv);
|
|
2950
2950
|
this.div = document.createElement('div');
|
|
2951
2951
|
this.div.style.zIndex = `${zIndexStart + 2}`;
|
|
2952
2952
|
this.div.style.color = `${colors[this.klpWithTooltip].noAlpha}`;
|
|
2953
2953
|
this.div.style.backgroundColor = `${colors[this.klpWithTooltip].background}`;
|
|
2954
2954
|
this.div.style.position = 'fixed';
|
|
2955
2955
|
if (this.position === 'top') {
|
|
2956
|
+
this.div.style.top = `${top}px`;
|
|
2957
|
+
this.div.style.left = `${left}px`;
|
|
2956
2958
|
this.div.style.transform = `translate(calc(-100% + ${el.nativeElement.getBoundingClientRect().width}px), calc(-100% - 0.3rem))`;
|
|
2957
2959
|
}
|
|
2958
2960
|
else if (this.position === 'bottom') {
|
|
2959
|
-
this.div.style.
|
|
2961
|
+
this.div.style.top = `${top + el.nativeElement.getBoundingClientRect().height}px`;
|
|
2962
|
+
this.div.style.left = `${left}px`;
|
|
2963
|
+
this.div.style.transform = `translate(calc(-100% + ${el.nativeElement.getBoundingClientRect().width}px), calc(0% + 0.3rem))`;
|
|
2960
2964
|
}
|
|
2961
2965
|
if (this.tooltipMinWidth > 0) {
|
|
2962
2966
|
this.div.style.minWidth = `${this.tooltipMinWidth}px`;
|
|
@@ -2988,10 +2992,14 @@ class WithTooltipDirective {
|
|
|
2988
2992
|
this.triangle.style.zIndex = `${zIndexStart + 1}`;
|
|
2989
2993
|
this.triangle.style.position = 'fixed';
|
|
2990
2994
|
if (this.position === 'top') {
|
|
2995
|
+
this.triangle.style.top = `${top}px`;
|
|
2996
|
+
this.triangle.style.left = `${left}px`;
|
|
2991
2997
|
this.triangle.style.transform = `translate(${el.nativeElement.getBoundingClientRect().width}px) translate(-100%, calc(-100% + 0.1rem))`;
|
|
2992
2998
|
}
|
|
2993
2999
|
else if (this.position === 'bottom') {
|
|
2994
|
-
this.triangle.style.
|
|
3000
|
+
this.triangle.style.top = `${top + el.nativeElement.getBoundingClientRect().height}px`;
|
|
3001
|
+
this.triangle.style.left = `${left}px`;
|
|
3002
|
+
this.triangle.style.transform = `translate(calc(-100% + ${el.nativeElement.getBoundingClientRect().width}px), calc(0% - 0.15rem)) rotate(180deg)`;
|
|
2995
3003
|
}
|
|
2996
3004
|
this.triangle.style.width = '0';
|
|
2997
3005
|
this.triangle.style.height = '0';
|
|
@@ -3003,10 +3011,15 @@ class WithTooltipDirective {
|
|
|
3003
3011
|
this.triangleWhite.style.zIndex = `${zIndexStart + 3}`;
|
|
3004
3012
|
this.triangleWhite.style.position = 'fixed';
|
|
3005
3013
|
if (this.position === 'top') {
|
|
3014
|
+
this.triangleWhite.style.top = `${top}px`;
|
|
3015
|
+
this.triangleWhite.style.left = `${left}px`;
|
|
3006
3016
|
this.triangleWhite.style.transform = `translate(${el.nativeElement.getBoundingClientRect().width}px) translate(-100%, calc(-100% + 0.1rem - 2px))`;
|
|
3007
3017
|
}
|
|
3008
3018
|
else if (this.position === 'bottom') {
|
|
3009
|
-
this.triangleWhite.style.
|
|
3019
|
+
this.triangleWhite.style.top = `${top + el.nativeElement.getBoundingClientRect().height}px`;
|
|
3020
|
+
this.triangleWhite.style.left = `${left}px`;
|
|
3021
|
+
this.triangleWhite.style.transform = `translate(calc(-100% + ${el.nativeElement.getBoundingClientRect().width}px), calc(0% - 0.15rem + 2px)) rotate(180deg)`;
|
|
3022
|
+
// this.triangleWhite.style.transform = `translate(${el.nativeElement.getBoundingClientRect().width}px) translateY(${el.nativeElement.getBoundingClientRect().height}px) translate(-100%, -2px) rotate(180deg)`;
|
|
3010
3023
|
}
|
|
3011
3024
|
this.triangleWhite.style.width = '0';
|
|
3012
3025
|
this.triangleWhite.style.height = '0';
|
|
@@ -3042,7 +3055,7 @@ class WithTooltipDirective {
|
|
|
3042
3055
|
}
|
|
3043
3056
|
catch (ex) { }
|
|
3044
3057
|
try {
|
|
3045
|
-
|
|
3058
|
+
document.body.removeChild(this.hookDiv);
|
|
3046
3059
|
}
|
|
3047
3060
|
catch (ex) { }
|
|
3048
3061
|
});
|