All files / components/Tooltip styles.module.css

100% Statements 64/64
100% Branches 2/2
100% Functions 1/1
100% Lines 64/64

Press n or j to go to the next uncovered block, b, p or k for the previous block.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 651x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x 1x  
.tooltip {
  visibility: hidden;
  width: max-content;
  position: absolute;
  top: 0;
  left: 0;
  padding: 8px 16px;
  border-radius: 3px;
  font-size: 90%;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.3s ease-out;
  will-change: opacity, visibility;
}
 
.arrow {
  position: absolute;
  background: var(--rt-color-dark);
  width: 8px;
  height: 8px;
  transform: rotate(45deg);
}
 
.show {
  visibility: visible;
  opacity: 0.9;
}
 
/** Types variant **/
.dark,
.dark .arrow {
  background: var(--rt-color-dark);
  color: var(--rt-color-white);
}
 
.light,
.light .arrow {
  background-color: var(--rt-color-white);
  color: var(--rt-color-dark);
}
 
.success,
.success .arrow {
  background-color: var(--rt-color-success);
  color: var(--rt-color-white);
}
 
.warning,
.warning .arrow {
  background-color: var(--rt-color-warning);
  color: var(--rt-color-white);
}
 
.error,
.error .arrow {
  background-color: var(--rt-color-error);
  color: var(--rt-color-white);
}
 
.info,
.info .arrow {
  background-color: var(--rt-color-info);
  color: var(--rt-color-white);
}