Summary Table

Categories Total Count
PII 0
URL 0
DNS 0
EKL 0
IP 0
PORT 0
VsID 0
CF 0
AI 0
VPD 0
PL 0
Other 0

File Content

.tooltip {
// The tooltip container
display: inline-block;
}

.tooltip a {
// The tooltip link
padding: 2px;
text-decoration: none;
color: $color-info;
cursor: pointer;
&:hover {
text-decoration: underline;
}
}

.tooltip > span {
// The tooltip display body
display: block;
position: absolute;
margin-top: 18px;
padding: $padding-base;
height: 0;
max-width: 333px;
min-width: 150px;
opacity: 0;
overflow: hidden;
background-color: $tooltip-bg;
border-radius: $radius-base;
box-shadow: $shadow-base;
text-align: left;
line-height: 21px;
color: $tooltip-text;
font-size: 15px;
transition: all 0.4s ease-in-out 0s;
white-space: normal;
word-break: normal;
z-index: -1;
cursor: pointer;
&::before {
// This is the pointer
content: '';
height: 0;
width: 0;
position: absolute;
top: -8px;
left: 12px;
border-left: 9px solid transparent;
border-right: 9px solid transparent;
border-bottom: 9px solid $gray-darker; // $color-warning;
}
}

.tooltip.tab-top {
// This is for Help or Info icons at the tops of page tabs.
& label {
margin-left: 4px;
}
& a {
display: block;
height: 32px
}
& span {
top: 32px;
width: 333px;
margin-left: -138px;
padding: 18px 24px 24px;
&::before {
left: auto;
right: 24px;
}
}
}

.tooltip a:focus+span,
.tooltip a:hover+span {
// This 'activates' the tooltip
height: auto;
opacity: 1;
overflow: visible;
transition-delay: 1s;
}

.tooltip a:hover+span {
margin-top: 6px;
z-index: 2001;
}

.tooltip a:focus+span {
margin-top: 12px;
z-index: 2002;
}