@enact/sandstone/ProgressBar/ProgressBarTooltip.module.css

Large-screen/TV support library for Enact, containing a variety of UI components.

.tooltip {
  --tooltip-progress-proportion: 0;
  --tooltip-progress-percent: calc(var(--tooltip-progress-proportion) * 100%);
}
.tooltip .tooltipLabel {
  font-family: "Sandstone Number";
}
:global(.enact-locale-non-latin) .tooltip .tooltipLabel {
  font-family: "Sandstone Number";
}
.tooltip.horizontal {
  left: var(--tooltip-progress-percent);
}
.tooltip.horizontal.above {
  bottom: 0.875rem;
}
.tooltip.horizontal.below {
  top: 0.875rem;
}
.tooltip.vertical {
  bottom: var(--tooltip-progress-percent);
}
.tooltip.vertical.left,
.tooltip.vertical.before,
:global(.enact-locale-right-to-left) .tooltip.vertical.after {
  right: 0.875rem;
}
.tooltip.vertical.right,
.tooltip.vertical.after,
:global(.enact-locale-right-to-left) .tooltip.vertical.before {
  left: 0.875rem;
}
.tooltip.radial {
  left: 50%;
  bottom: 50%;
}
.tooltip.radial.above.left,
.tooltip.radial.below.left,
.tooltip.radial.above.before,
.tooltip.radial.below.before,
:global(.enact-locale-right-to-left) .tooltip.radial.above.after,
:global(.enact-locale-right-to-left) .tooltip.radial.below.after {
  left: 50%;
}
.tooltip.radial.above.right,
.tooltip.radial.below.right,
.tooltip.radial.above.after,
.tooltip.radial.below.after,
:global(.enact-locale-right-to-left) .tooltip.radial.above.before,
:global(.enact-locale-right-to-left) .tooltip.radial.below.before {
  left: 50%;
}
.tooltip.radial.above.center,
.tooltip.radial.below.center {
  left: 50%;
}
.tooltip.radial.center.above {
  bottom: calc(100% + 0.875rem );
}
.tooltip.radial.center.below {
  top: calc(100% + 0.875rem );
}
.tooltip.radial.left,
.tooltip.radial.before,
:global(.enact-locale-right-to-left) .tooltip.radial.after {
  left: -0.875rem;
}
.tooltip.radial.left.above,
.tooltip.radial.before.above,
:global(.enact-locale-right-to-left) .tooltip.radial.after.above {
  bottom: calc(100% + 0.875rem );
}
.tooltip.radial.left.below,
.tooltip.radial.before.below,
:global(.enact-locale-right-to-left) .tooltip.radial.after.below {
  top: calc(100% + 0.875rem );
}
.tooltip.radial.right,
.tooltip.radial.after,
:global(.enact-locale-right-to-left) .tooltip.radial.before {
  left: calc(100% + 0.875rem );
}
.tooltip.radial.right.above,
.tooltip.radial.after.above,
:global(.enact-locale-right-to-left) .tooltip.radial.before.above {
  bottom: calc(100% + 0.875rem );
}
.tooltip.radial.right.below,
.tooltip.radial.after.below,
:global(.enact-locale-right-to-left) .tooltip.radial.before.below {
  top: calc(100% + 0.875rem );
}