@klippa/ngx-enhancy-forms 20.0.9 → 20.0.11
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.
|
@@ -2943,12 +2943,9 @@ class WithTooltipDirective {
|
|
|
2943
2943
|
return;
|
|
2944
2944
|
}
|
|
2945
2945
|
}
|
|
2946
|
-
if (getComputedStyle(el.nativeElement).position === 'static') {
|
|
2947
|
-
el.nativeElement.style.position = 'relative';
|
|
2948
|
-
}
|
|
2949
2946
|
this.hookDiv = document.createElement('div');
|
|
2950
|
-
|
|
2951
|
-
|
|
2947
|
+
const top = el.nativeElement.getBoundingClientRect().top;
|
|
2948
|
+
const left = el.nativeElement.getBoundingClientRect().left;
|
|
2952
2949
|
el.nativeElement.prepend(this.hookDiv);
|
|
2953
2950
|
this.div = document.createElement('div');
|
|
2954
2951
|
this.div.style.zIndex = `${zIndexStart + 2}`;
|
|
@@ -2956,10 +2953,14 @@ class WithTooltipDirective {
|
|
|
2956
2953
|
this.div.style.backgroundColor = `${colors[this.klpWithTooltip].background}`;
|
|
2957
2954
|
this.div.style.position = 'fixed';
|
|
2958
2955
|
if (this.position === 'top') {
|
|
2956
|
+
this.div.style.top = `${top}px`;
|
|
2957
|
+
this.div.style.left = `${left}px`;
|
|
2959
2958
|
this.div.style.transform = `translate(calc(-100% + ${el.nativeElement.getBoundingClientRect().width}px), calc(-100% - 0.3rem))`;
|
|
2960
2959
|
}
|
|
2961
2960
|
else if (this.position === 'bottom') {
|
|
2962
|
-
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))`;
|
|
2963
2964
|
}
|
|
2964
2965
|
if (this.tooltipMinWidth > 0) {
|
|
2965
2966
|
this.div.style.minWidth = `${this.tooltipMinWidth}px`;
|
|
@@ -2991,10 +2992,14 @@ class WithTooltipDirective {
|
|
|
2991
2992
|
this.triangle.style.zIndex = `${zIndexStart + 1}`;
|
|
2992
2993
|
this.triangle.style.position = 'fixed';
|
|
2993
2994
|
if (this.position === 'top') {
|
|
2995
|
+
this.triangle.style.top = `${top}px`;
|
|
2996
|
+
this.triangle.style.left = `${left}px`;
|
|
2994
2997
|
this.triangle.style.transform = `translate(${el.nativeElement.getBoundingClientRect().width}px) translate(-100%, calc(-100% + 0.1rem))`;
|
|
2995
2998
|
}
|
|
2996
2999
|
else if (this.position === 'bottom') {
|
|
2997
|
-
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)`;
|
|
2998
3003
|
}
|
|
2999
3004
|
this.triangle.style.width = '0';
|
|
3000
3005
|
this.triangle.style.height = '0';
|
|
@@ -3006,10 +3011,15 @@ class WithTooltipDirective {
|
|
|
3006
3011
|
this.triangleWhite.style.zIndex = `${zIndexStart + 3}`;
|
|
3007
3012
|
this.triangleWhite.style.position = 'fixed';
|
|
3008
3013
|
if (this.position === 'top') {
|
|
3014
|
+
this.triangleWhite.style.top = `${top}px`;
|
|
3015
|
+
this.triangleWhite.style.left = `${left}px`;
|
|
3009
3016
|
this.triangleWhite.style.transform = `translate(${el.nativeElement.getBoundingClientRect().width}px) translate(-100%, calc(-100% + 0.1rem - 2px))`;
|
|
3010
3017
|
}
|
|
3011
3018
|
else if (this.position === 'bottom') {
|
|
3012
|
-
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)`;
|
|
3013
3023
|
}
|
|
3014
3024
|
this.triangleWhite.style.width = '0';
|
|
3015
3025
|
this.triangleWhite.style.height = '0';
|