mirror of
https://github.com/facebook/react.git
synced 2025-11-01 09:12:30 +00:00
Brian Vaughn
cb88572227
* Improve DevTools Profiler commit-selector UX 1. Use natural log of durations (rather than linear) when calculating bar height. This reduces the impact of one (or few) outlier times on more common smaller durations. (Continue to use linear for bar color though.) 2. Decrease the minimum bar height to make the differences in height more noticeable. 3. Add a background hover highlight to increase contrast. 4. Add hover tooltip with commit duration and timestamp.
26 lines
517 B
CSS
26 lines
517 B
CSS
.Tooltip {
|
|
position: absolute;
|
|
pointer-events: none;
|
|
border: none;
|
|
border-radius: 0.25rem;
|
|
padding: 0.25rem 0.5rem;
|
|
font-family: var(--font-family-sans);
|
|
font-size: 12px;
|
|
background-color: var(--color-tooltip-background);
|
|
color: var(--color-tooltip-text);
|
|
opacity: 1;
|
|
white-space: nowrap;
|
|
/* Make sure this is above the DevTools, which are above the Overlay */
|
|
z-index: 10000002;
|
|
}
|
|
|
|
.Tooltip.hidden {
|
|
opacity: 0;
|
|
}
|
|
|
|
|
|
.Container {
|
|
width: -moz-max-content;
|
|
width: -webkit-max-content;
|
|
}
|