analytics/assets/css/tooltip.css

46 lines
826 B
CSS
Raw Normal View History

/* @format */
[tooltip] {
position: relative;
display: inline-block;
2019-09-02 14:29:19 +03:00
}
[tooltip]::before {
transition: 0.3s;
content: '';
2019-09-02 14:29:19 +03:00
position: absolute;
top: -6px;
left: 50%;
2019-09-02 14:29:19 +03:00
transform: translateX(-50%);
border-width: 4px 6px 0;
2019-09-02 14:29:19 +03:00
border-style: solid;
border-color: rgba(25 30 56) transparent transparent;
2019-09-02 14:29:19 +03:00
z-index: 99;
opacity: 0;
2019-09-02 14:29:19 +03:00
}
[tooltip]::after {
transition: 0.3s;
2019-09-02 14:29:19 +03:00
white-space: nowrap;
content: attr(tooltip);
position: absolute;
left: 50%;
top: -6px;
transform: translateX(-50%) translateY(-100%);
background: rgba(25 30 56);
2019-09-02 14:29:19 +03:00
text-align: center;
color: #fff;
font-size: 0.875rem;
2019-09-02 14:29:19 +03:00
min-width: 80px;
max-width: 420px;
2019-09-02 14:29:19 +03:00
border-radius: 3px;
pointer-events: none;
padding: 4px 8px;
z-index: 99;
opacity: 0;
2019-09-02 14:29:19 +03:00
}
[tooltip]:hover::after,
[tooltip]:hover::before {
opacity: 1;
2019-09-02 14:29:19 +03:00
}