MyCrypto/common/components/ui/Tooltip.scss

37 lines
812 B
SCSS

@import 'common/sass/variables';
@import 'common/sass/mixins';
.Tooltip {
position: absolute;
top: 0;
left: 50%;
width: 220px;
color: #FFF;
font-size: $font-size-xs;
font-family: $font-family-sans-serif;
pointer-events: none;
opacity: 0;
visibility: hidden;
transform: translate(-50%, -100%) translateY(-5px);
transition-property: opacity, transform, visibility;
transition-duration: 100ms, 100ms, 0ms;
transition-delay: 0ms, 0ms, 100ms;
z-index: $zindex-tooltip;
> span {
display: inline-block;
background: rgba(#000, 0.9);
border-radius: 2px;
padding: 4px 8px;
&:after {
position: absolute;
content: '';
bottom: 0;
left: 50%;
transform: translate(-50%, 100%);
@include triangle(8px, rgba(#000, 0.9), down);
}
}
}