1
0
Fork 0
mirror of https://we.phorge.it/source/phorge.git synced 2024-12-23 14:00:56 +01:00
phorge-phorge/webroot/rsrc/css/aphront/tooltip.css
Bob Trahan a652ca462e finish implementing N and W tooltips and use W in differential
Summary: 'cuz new fluid layouts require the westerlyness. Looks like D4126 started the N and W implementation but didn't finish it...? note I had to do the shifting of the 5 pixels in javascript; using the CSS didn't work for me in chrome.

Test Plan: uiexample, and hoping it goes well when deployed in prod for differential case

Reviewers: epriestley

Reviewed By: epriestley

CC: chad, aran, Korvin

Maniphest Tasks: T2211

Differential Revision: https://secure.phabricator.com/D4257
2012-12-20 18:23:35 -08:00

68 lines
1.1 KiB
CSS

/**
* @provides aphront-tooltip-css
*/
.jx-tooltip-container {
position: absolute;
z-index: 18;
}
.jx-tooltip {
background: #000;
color: #f9f9f9;
font-size: 12px;
padding: 4px 8px;
overflow: hidden;
white-space: pre-wrap;
border-radius: 3px;
opacity: 0.9;
box-shadow: 0 0 2px rgba(255, 255, 255, 0.5);
}
.jx-tooltip:after {
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
border-color: rgba(0, 0, 0, 0);
border-width: 5px;
}
.jx-tooltip-align-E {
margin-left: 5px;
}
.jx-tooltip-align-E .jx-tooltip:after {
margin-top: -5px;
border-right-color: #000;
right: 100%;
top: 50%;
}
.jx-tooltip-align-W .jx-tooltip:after {
margin-top: -5px;
border-left-color: #000;
left: 100%;
top: 50%;
}
.jx-tooltip-align-N {
margin-top: -5px;
}
.jx-tooltip-align-N .jx-tooltip:after {
margin-left: -5px;
border-top-color: #000;
top: 100%;
left: 50%;
}
.jx-tooltip-align-S .jx-tooltip:after {
margin-left: -5px;
border-bottom-color: #000;
bottom: 100%;
left: 50%;
}