fixTooltip

This commit is contained in:
2021-08-14 15:10:07 +03:00
parent a66ccba187
commit 2791acedda
+16 -12
View File
@@ -81,19 +81,23 @@
border-width: var(--kit-tooltip-border-width) 0 0 var(--kit-tooltip-border-width);
}
/*right*/
.kit-tooltip-right, .kit-tooltip-auto[x-placement^="right"] {
.kit-tooltip-right, .kit-tooltip-auto[x-placement^="right"], .kit-tooltip-end {
padding: 0 calc(var(--kit-tooltip-arrow-width) / var(--math-sqrt-2) + var(--kit-tooltip-border-width) * (var(--math-sqrt-2) - 1));
}
.kit-tooltip-right .tooltip-arrow, .kit-tooltip-auto[x-placement^="right"] .tooltip-arrow {
.kit-tooltip-right .arrow,
.kit-tooltip-auto[x-placement^="right"] .arrow,
.kit-tooltip-end .tooltip-arrow {
left: 0;
width: calc(var(--kit-tooltip-arrow-width) / var(--math-sqrt-2) + var(--kit-tooltip-border-width) * var(--math-sqrt-2));
height: calc(var(--kit-tooltip-arrow-width) * var(--math-sqrt-2) + var(--kit-tooltip-border-width) * var(--math-sqrt-2));
top: 50% !important;
transform: translate(0px, -50%);
transform: translate(0px, -50%) !important;
}
.kit-tooltip-right .tooltip-arrow::before, .kit-tooltip-auto[x-placement^="right"] .tooltip-arrow::before {
.kit-tooltip-right .arrow::before,
.kit-tooltip-auto[x-placement^="right"] .arrow::before,
.kit-tooltip-end .tooltip-arrow::before {
left: 0px;
top: 50%;
transform: rotate(
@@ -110,7 +114,7 @@
padding: calc(var(--kit-tooltip-arrow-width) / var(--math-sqrt-2) + var(--kit-tooltip-border-width) * (var(--math-sqrt-2) - 1)) 0;
}
.kit-tooltip-bottom .tooltip-arrow, .kit-tooltip-auto[x-placement^="bottom"] .tooltip-arrow {
.kit-tooltip-bottom .tooltip-arrow, .kit-tooltip-auto[x-placement^="bottom"] .arrow {
top: 0;
width: calc(var(--kit-tooltip-arrow-width) * var(--math-sqrt-2) + var(--kit-tooltip-border-width) * var(--math-sqrt-2));
height: calc(var(--kit-tooltip-arrow-width) / var(--math-sqrt-2) + var(--kit-tooltip-border-width) * var(--math-sqrt-2));
@@ -118,7 +122,7 @@
/*transform: translate(-50%, 0);*/
}
.kit-tooltip-bottom .tooltip-arrow::before, .kit-tooltip-auto[x-placement^="bottom"] .tooltip-arrow::before {
.kit-tooltip-bottom .tooltip-arrow::before, .kit-tooltip-auto[x-placement^="bottom"] .arrow::before {
top: 0;
left: 50%;
transform: rotate(
@@ -135,12 +139,12 @@
/*left*/
.kit-tooltip-left,
.kit-tooltip-auto[x-placement^="left"],
.kit-tooltip-start[data-popper-placement^="left"] {
.kit-tooltip-start {
padding: 0 calc(var(--kit-tooltip-arrow-width) / var(--math-sqrt-2) + var(--kit-tooltip-border-width) * (var(--math-sqrt-2) - 1));
}
.kit-tooltip-left .tooltip-arrow, .kit-tooltip-auto[x-placement^="left"] .tooltip-arrow,
.kit-tooltip-start[data-popper-placement^="left"] .tooltip-arrow {
.kit-tooltip-left .arrow, .kit-tooltip-auto[x-placement^="left"] .arrow,
.kit-tooltip-start .tooltip-arrow {
right: 0;
width: calc(var(--kit-tooltip-arrow-width) / var(--math-sqrt-2) + var(--kit-tooltip-border-width) * var(--math-sqrt-2));
height: calc(var(--kit-tooltip-arrow-width) * var(--math-sqrt-2) + var(--kit-tooltip-border-width) * var(--math-sqrt-2));
@@ -148,9 +152,9 @@
transform: translate(0px, -50%) !important;
}
.kit-tooltip-left .tooltip-arrow::before,
.kit-tooltip-auto[x-placement^="left"] .tooltip-arrow::before,
.kit-tooltip-start[data-popper-placement^="left"] .tooltip-arrow::before {
.kit-tooltip-left .arrow::before,
.kit-tooltip-auto[x-placement^="left"] .arrow::before,
.kit-tooltip-start .tooltip-arrow::before {
right: 0;
top: 50%;
transform: rotate(