codecheck

1
// core
2
.p-tooltip {
3
    position:absolute;
4
    display:none;
5
    padding: .25em .5rem;
6
    max-width: 12.5rem;
7
}
8

9
.p-tooltip.p-tooltip-right,
10
.p-tooltip.p-tooltip-left {
11
    padding: 0 .25rem;
12
}
13

14
.p-tooltip.p-tooltip-top,
15
.p-tooltip.p-tooltip-bottom {
16
    padding:.25em 0;
17
}
18

19
.p-tooltip .p-tooltip-text {
20
    white-space: pre-line;
21
    word-break: break-word;
22
}
23

24
.p-tooltip-arrow {
25
    position: absolute;
26
    width: 0;
27
    height: 0;
28
    border-color: transparent;
29
    border-style: solid;
30
    scale: 2;
31
}
32

33
.p-tooltip-right .p-tooltip-arrow {
34
    margin-top: -.25rem;
35
    border-width: .25em .25em .25em 0;
36
}
37

38
.p-tooltip-left .p-tooltip-arrow {
39
    margin-top: -.25rem;
40
    border-width: .25em 0 .25em .25rem;
41
}
42

43
.p-tooltip.p-tooltip-top {
44
    padding: .25em 0;
45
}
46

47
.p-tooltip-top .p-tooltip-arrow {
48
    margin-left: -.25rem;
49
    border-width: .25em .25em 0;
50
}
51

52
.p-tooltip-bottom .p-tooltip-arrow {
53
    margin-left: -.25rem;
54
    border-width: 0 .25em .25rem;
55
}
56

57
// theme
58
.p-tooltip {
59
    .p-tooltip-text {
60
        background: $tooltipBg;
61
        color: $tooltipTextColor;
62
        padding: $tooltipPadding;
63
        box-shadow: $inputOverlayShadow;
64
        border-radius: $borderRadius;
65
    }
66

67
    &.p-tooltip-right {
68
        .p-tooltip-arrow {
69
            border-right-color: $tooltipBg;
70
        }
71
    }
72

73
    &.p-tooltip-left {
74
        .p-tooltip-arrow {
75
            border-left-color: $tooltipBg;
76
        }
77
    }
78

79
    &.p-tooltip-top {
80
        .p-tooltip-arrow {
81
            border-top-color: $tooltipBg;
82
        }
83
    }
84

85
    &.p-tooltip-bottom {
86
        .p-tooltip-arrow {
87
            border-bottom-color: $tooltipBg;
88
        }
89
    }
90
}
91