@recaptime-dev's working patches + fork for Phorge, a community fork of Phabricator. (Upstream dev and stable branches are at upstream/main and upstream/stable respectively.)
hq.recaptime.dev/wiki/Phorge
phorge
phabricator
1/**
2 * @provides aphront-tooltip-css
3 */
4
5.jx-tooltip-container {
6 position: absolute;
7 padding: 5px;
8
9 /* In Chrome, moving the cursor into the empty space next to the "caret" on
10 the caret side of the tooltip can cause the tooltip to flicker rapidly
11 because the cursor hits the container. To stop this, prevent cursor
12 events on the container. See T8440. */
13 pointer-events: none;
14}
15
16.jx-tooltip-appear {
17 animation: 0.5s tooltip-appear;
18}
19
20@keyframes tooltip-appear {
21 0% {
22 opacity: 0;
23 }
24
25 100% {
26 opacity: 1;
27 }
28}
29
30.jx-tooltip-inner {
31 position: relative;
32 background: #000;
33 border-radius: 3px;
34}
35
36.jx-tooltip {
37 color: #fff;
38 font-size: {$normalfontsize};
39 font-weight: bold;
40 padding: 6px 8px;
41 overflow: hidden;
42 white-space: pre-wrap;
43}
44
45.jx-tooltip:after {
46 border: solid transparent;
47 content: " ";
48 height: 0;
49 width: 0;
50 position: absolute;
51 pointer-events: none;
52 border-color: rgba({$alphablack}, 0);
53 border-width: 5px;
54}
55
56.jx-tooltip-align-E {
57 margin-left: 5px;
58}
59
60.jx-tooltip-align-E .jx-tooltip:after {
61 margin-top: -5px;
62 border-right-color: #000;
63 right: 100%;
64 top: 50%;
65}
66
67.jx-tooltip-align-E {
68 margin-right: 5px;
69}
70
71.jx-tooltip-align-W .jx-tooltip:after {
72 margin-top: -5px;
73 border-left-color: #000;
74 left: 100%;
75 top: 50%;
76}
77
78.jx-tooltip-align-N {
79 margin-bottom: 5px;
80}
81
82.jx-tooltip-align-N .jx-tooltip:after {
83 margin-left: -5px;
84 border-top-color: #000;
85 top: 100%;
86 left: 50%;
87}
88
89.jx-tooltip-align-N {
90 margin-top: 5px;
91}
92
93.jx-tooltip-align-S .jx-tooltip:after {
94 margin-left: -5px;
95 border-bottom-color: #000;
96 bottom: 100%;
97 left: 50%;
98}